网格布局中每行的帖子数不同

时间:2014-07-10 作者:Sergey

是否有办法根据从自定义字段检索到的帖子大小,在网格布局中返回每行不同数量的帖子?

例如:

|              Large post              |
|   Medium post    |    Medium post    |
| Small post | Small post | Small post |
|   Medium post    |    Medium post    |
|              Large post              |
行顺序可以不同。我从自定义字段中获取帖子大小值。我认为逻辑如下:

获取一篇文章的大小,如果它与行完全匹配,请关闭行标记,打开新的行标记并检查下一篇文章。如果文章与整行不匹配,请获取下一篇文章的大小并检查它是否匹配,等等。

有什么切实可行的想法吗?

非常感谢。

EDIT: 我已经研究了很多非常简单的代码片段。然而,它们都是指通过$计数器变量和模数创建相同数量的列,即将循环划分为两列/三列/四列布局。我从未见过一个片段允许在同一网格布局中使用不同的帖子大小。

文章大小在“自定义文章”字段中定义。可通过以下方式进行检查get_post_meta($post_id, \'_post_size\', true);

每行具有不同立柱数量和不同立柱尺寸的网格示例见Virgin.

1 个回复
SO网友:Nicolai Grossherr

这可以通过使用Masonry A.

级联网格布局库

WordPress自3.5版起就将其包括在内,并随着WP 3.9版的发布而更新至v3。这确实是一个很好的工具,可以完成不同类型的网格布局。当然,没有必要使用此库,但它确实适用于网格布局,因此您不妨使用它。

有大量的操作指南和教程可用,只要四处看看,你就会找到它们。通常,实现非常简单,然后通过CSS进行大小管理和控制(如果您想提供大小更改开关,还可以使用一些javascript/jQuery)。

作为补充信息,有一个可以说是专业版的砌体可用,它提供了更多的功能。它被称为Isotope, 如果你想看看的话。当然,它不是WP核心功能的一部分,此外,您需要一个非常实惠的许可证才能在商业上使用它。

结束

相关推荐

Get_Posts()强制忽略主循环上的粘滞帖子

我有一个自定义查询,使用get_posts() 除了忽略其主查询上的粘性之外,还忽略了主循环上的粘性帖子。四处阅读我发现get_posts() sticky有一些问题,但无法找到满足我需求的解决方案。粘滞柱通常显示,但不在顶部,这是意外的。如何使其正常工作?我使用的参数:\'numberposts\' => 5, \'category_name\' => \'\', \'post_status\' => \'publish\',