我在谷歌上四处搜索，但没有找到一个好的解决方案。我想做的是在帖子中创建一个类似砖石的网格，帖子中的所有图像都应该在砖石网格中。我怎样才能做到这一点？
【问题讨论】：
注意：有了这个想法，您可以在图库或内容中将所有附加图像添加到帖子中
首先让我们将 Masonry 添加到您的主题中，
wp_enqueue_script( 'masonry' );
wp_enqueue_script( 'masonry', '//cdnjs.cloudflare.com/ajax/libs/masonry/4.1.1/masonry.pkgd.min.js' );
然后将此 javascript 代码添加到您的主题的页脚或 custom.js 文件中的某处
jQuery(window).load(function() {
var container = jQuery('#mas-maincontainer');
var msnry = new Masonry(container, {
itemSelector: '.mas-item',
columnWidth: '.mas-item',
});
});
现在让我们根据需要获取所有附加到帖子的图片
$attachments = get_children(array('post_parent' => $post->ID,
'post_status' => 'inherit',
'post_type' => 'attachment',
'post_mime_type' => 'image'));
foreach($attachments as $att_id => $attachment) {
$full_img_url = wp_get_attachment_url($attachment->ID);
//Here is your HTML to grid your images...
// Remember your images should be between <div id="mas-maincontainer"></div>
}
现在您应该添加自定义 CSS，如下所示
.mas-item {
width: 50%; // if you want two column
}
.mas-item {
width: 33%; // if you want three column
}
这就是整个想法，希望它对你有用
【讨论】：
您可以使用wordpress's native gallery. 这个解决方案可以让您很好地控制图片在内容中的放置位置，并且可以轻松管理图库及其图片。
使用此过滤器禁用默认样式：
add_filter( 'use_default_gallery_style', '__return_false' );
然后使用desandro's masonry plugin 创建网格。这个插件有很好的文档，是创建砖石网格的最常见的插件，所以你应该很好地使用这个插件。
请记住设置画廊的样式，以便它可以与砖石插件一起使用。这是您将使用的 2 个选择器，.gallery（是每个画廊的容器）和 .gallery-item（是画廊中每个图像的容器)。
【讨论】：