Question

我正在寻找数小时来修复我的WordPress网站上的Infinite Scroll。它看起来很容易实现，之前我已经完成了，但显然我现在做错了或插件与WordPress 3.8不兼容。

我刚刚在另一个使用WordPress版本3.5.1的网站上修复了相同的无限滚动。在比较了两个WordPress安装和主题后，我仍然无法修复它。

我做错了什么？

到目前为止我做过的事情：

禁用其他插件以查看是否存在任何冲突
多次重新安装插件
在footer.php中的脚本周围添加window.onload = function() （infinite-scroll / templates / footer.php）在pageload之后触发脚本。
在infinite-scroll.php第307行中将singular()更改为single()，以在自定义页面模板上加载JavaScript。

我想在自定义页面模板上使用无限滚动。

我页面上的WordPress分页输出是：

<div class="pagination">
  <div class="next">
    <a href="http://localhost:8080/products/?page_id=22&paged=2" >Next page</a>                                             
  </div>
</div>

管理面板中的选择器为：

内容选择器：#products
导航选择器：.pagination
下一个选择器：.pagination .next a
项目选择器：#products article

index.php内容：

<section id="products" class="products fullwidth first">                                    
<?php                           
  if ( get_query_var('paged') ) { $paged = get_query_var('paged'); }
  elseif ( get_query_var('page') ) { $paged = get_query_var('page'); }
  else { $paged = 1; }

   $args= array (
   'post_type' => 'products', 
   'paged' => $paged
   );

   query_posts( $args ); ?>
   <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

   <article class="product item">

     [article content]

   </article>

   <?php endwhile; ?>
   <?php else : ?>
   <?php endif; ?>

   <div class="pagination">
       <div class="next">
           <?php echo get_next_posts_link(); ?>
       </div>
    </div>

   <?php wp_reset_query(); ?>
</section>

页脚中插件生成的脚本（按此顺序）：

<script type='text/javascript'>
/* <![CDATA[ */
var infinite_scroll = "{\"loading\":{\"msgText\":\"<em>Loading...<\\\/em>\",\"finishedMsg\":\"<em>No additional posts.<\\\/em>\",\"img\":\"http:\\\/\\\/localhost:8080\\\/products\\\/wp-content\\\/plugins\\\/infinite-scroll\\\/img\\\/ajax-loader.gif\"},\"nextSelector\":\".pagination .next a\",\"navSelector\":\".pagination\",\"itemSelector\":\"#products article\",\"contentSelector\":\"#products\",\"debug\":false,\"behavior\":\"\",\"callback\":\"\"}";
/* ]]> */
</script>

<script type='text/javascript' src='http://localhost:8080/products/wp-content/plugins/infinite-scroll/js/front-end/jquery.infinitescroll.js'></script>

<script type="text/javascript">
window.onload = function() {
// Because the <code>wp_localize_script</code> method makes everything a string
    infinite_scroll = jQuery.parseJSON(infinite_scroll);
    jQuery( infinite_scroll.contentSelector ).infinitescroll( infinite_scroll, function(newElements, data, url) { eval(infinite_scroll.callback); });
};
</script>

使用Wordpress版本3.8的无限滚动

0 个答案: