个性化阅读
专注于IT技术分析

我正在尝试将无限滚动与wordpress主题一起使用,但它不起作用

感谢你抽空帮助我。

我有一个wordpress网站:http://techchef.org/bridco/, 在这个网站上我正在使用wordpress 3.8.1;在主题中, 我想使用无限滚动;我尝试使用其他插件, 例如wp_infinitescroll, 滚动插件;没有任何工作, 所以我尝试使用自定义的方式来完成它。

因此, 我使用此处教程中提到的步骤http://code.tutsplus.com/tutorials/how-to-create-infinite-scroll-pagination–wp-24873;

但是我不确定, 但是看起来有一些小的变化, 这在下文提到的wordpress 3.8.1中是必需的,

在旧的wordpress版本中, 我们使用query_posts(array(‘paged’=> $ paged, ‘post_status’=>’publish’));

在新的wordpress版本中, 我们使用query_posts(array(‘page’=> $ paged, ‘post_status’=>’publish’));

而不是”分页”, 我们使用”页面”

我试过了, 但是也没用, 所以我把它改回原来的”分页”

对于无限滚动, 我使用

对于无限我使用下面提到的代码

在function.php中

function wp_infinitepaginate(){ 
    $loopFile        = $_POST['loop_file'];
    $paged           = $_POST['page_no'];
    $posts_per_page  = get_option('posts_per_page');

    # Load the posts

    query_posts(array('paged' => $paged, 'post_status' => 'publish'));
    get_template_part( $loopFile );

    exit;
}


add_action('wp_ajax_infinite_scroll', 'wp_infinitepaginate');           // for logged in user
add_action('wp_ajax_nopriv_infinite_scroll', 'wp_infinitepaginate');    // if user not logged in

在header.php我用

<script type="text/javascript">
function loadArticle(pageNumber) {
    jQuery.ajax({
        url: "<?php bloginfo('wpurl') ?>/wp-admin/admin-ajax.php", type:'POST', data: "action=infinite_scroll&page_no="+ pageNumber + '&loop_file=loop', success: function(html){
            jQuery("#main .container").append(html);    // This will be the div where our content will be loaded
        }
    });
    return false;
}
</script>


<script type="text/javascript">
            jQuery(window).scroll(function(){
                    if  (jQuery(window).scrollTop() == jQuery(document).height() - jQuery(window).height()){
                          // run our call for pagination
                    }
            }); 
</script>

但是它不起作用, 请帮忙, 指导我做错了什么, 或者缺少什么, 即使它没有显示任何js错误, 但我发现这里给出0值http://techchef.org/bridco /wp-admin/admin-ajax.php


#1


你错过了js的一部分来调用loadArticle和要加载的pageNumber

   var count = 2;//for first load
        $(window).scroll(function(){
                if  ($(window).scrollTop() == $(document).height() - $(window).height()){
                   loadArticle(count);
                   count++;
                }
        }); 

#2


我已经通过根据我的主题通过更改function.php中的循环函数来解决此问题, 我在下文中提到:此外, 我还用get_query_var(‘page’)更改了get_query_var(‘paged’)

     $loop_paged = (get_query_var('page')) ? get_query_var('page') : $paged;
     query_posts('orderby=date&order=ASC&paged=' . $loop_paged);

                            if ( have_posts() ) :
                                while ( have_posts() ) : the_post(); 
                                    get_template_part( 'content', get_post_format() );
                                endwhile; 
                                echo '</ul></div>
                                <div style="clear: both"></div>';
                                                       endif; 
赞(0) 打赏
未经允许不得转载:srcmini » 我正在尝试将无限滚动与wordpress主题一起使用,但它不起作用
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏