0

这是我的第一篇文章，我对 WordPress 还很陌生，所以请不要问我愚蠢的问题。

目前，我正在尝试将 Masonry http://masonry.desandro.com/安装到基于 WordPress 附带的标准二十一主题的子主题中。

我遵循了大约 20 个不同教程的指示，但不知道为什么我不能让它工作。我特别想让它为开发项目工作http://www.ct-social.com/ctsdev/aff/our-trips/

任何可以引导我走向正确方向的建议。也许有人可以告诉我我做错了什么。

2012 年 11 月 30 日更新我已将脚本更改为以下内容：

<script type="text/javascript">
jQuery(document).ready(function($){
  var $container = $('.container');
  $container.imagesLoaded(function(){
    $container.masonry({
      itemSelector : '.featured',
      singleMode:true
    });
  });
});
</script>

并且html的结构如下：

<div class="container">
  <div class="featured">
      Stuff inside
  </div>
</div>

仍然没有运气。有任何想法吗？

4

2 回答 2

0

你正在使用这个

var $container = $('#container');
  $container.imagesLoaded(function(){
    $container.masonry({
      itemSelector : '.item',
      columnWidth : 240
    });
  });

失败是因为您的“图块”都使用容器作为 id，并且$('#container')只希望找到一个元素。您不应该在同一页面上有多个具有相同 id 的元素。

如果您查看 Masonry 教程示例标记

<div id="container">
  <div class="item">...</div>
  <div class="item">...</div>
  <div class="item">...</div>
  ...
</div>

有一个带有 id 容器的 div，每个项目都有相同的类。

您需要将所有项目放入 id 为“container”的 div 中，并将“featured”类添加到您希望 Masonry 平铺的所有元素中。

于 2012-11-30T01:40:57.447 回答
0

我发现了我的问题并且能够解决我的问题。

而不是在我的functions.php文件底部将Jquery排入队列。

wp_enqueue_script('jquery');
wp_register_script('jquery_masonry', get_template_directory_uri().'/js/jquery.masonry.min.js', array('jquery'), '2.0.110526' );
wp_enqueue_script('jquery_masonry');

再加上你 Enrico 提到的变化，还有 BOOM！砌体现在正在工作。非常感谢您的帮助，如果没有它，我仍然会用头撞石头。

于 2012-11-30T17:54:13.927 回答