在自定义主题中实现jquery-ias时遇到问题

我买了这个javascript jquery插件:Infinite AJAX Scroll, 我想在我创建的wordpress主题, 首页和档案上使用它。
我尝试了这些链接上的文档:https://infiniteajaxscroll.com/docs/getting-started.html和Wordpress一个:https://infiniteajaxscroll.com/docs/cookbook-wordpress.html
但是也许是因为我使用了2个不同的循环, 一个循环用于最后三个帖子, 第二个循环用于所有之后的帖子, 所以我不知道它应该如何工作。
这是一个大循环:

$args = array( 'offset' => 3 ); $query = new WP_query ( $args ); if ( $query-> have_posts() ) { ?> < section class="container"> < div class="row"> < h1 class="section_title ASG_dark col-lg-12"> Plus de news...< /h1> < /div> < div class="row"> < ?php while ( $query-> have_posts() ) : $query-> the_post(); ?> < ?php $url = wp_get_attachment_image_src( get_post_thumbnail_id( $post-> ID ), 'full' ); ?> < div class="col-lg-4 my-4"> < div class="highlight_sticker"> < div class="highlight_sticker_thumbnail" style="background-image: url('< ?php echo $url[0]; ?> '); "> < /div> < div class="highlight_sticker_info p-4"> < div class="highlight_sticker_title"> < a href="http://www.srcmini.com/< ?php echo the_permalink(); ?>"> < ?php echo the_title(); ?> < /a> < /div> < div class="highlight_sticker_date"> < ?php echo the_date(); ?> < /div> < /div> < div class="highlight_sticker_button"> < span class="oi oi-plus" title="plus" aria-hidden="true"> < /span> < /div> < /div> < /div> < ?php endwhile; ?> < ?php wp_reset_postdata(); ?> < div style="clear: both; "> < /div> < /div> < /section>

【在自定义主题中实现jquery-ias时遇到问题】当我尝试在Wordpress部分之后使用它时, 它仅显示” 你到达末尾” 。
有人可以帮我吗?我对Javascript很不好, 无法自己理解。
编辑:ias config应该看起来像这样:
< !-- Infinite Ajax Scroll --> < script src="http://www.srcmini.com/< ?php echo get_template_directory_uri(); ?> /js/jquery-ias.min.js" type="text/javascript"> < /script> < script type="text/javascript"> var ias = $.ias({ container: ".ias-container", item: ".ias-item", pagination: ".navigation", next: ".nav-previous a", }); ias.extension(new IASTriggerExtension({offset: 2})); ias.extension(new IASSpinnerExtension()); ias.extension(new IASNoneLeftExtension()); ias.extension(new IASTriggerExtension({ text: 'Load more items', // optionally })); < /script>

还有front-page.php模板
< ?php get_header(); ?> < ? $args = array( 'posts_per_page' => 3 ); $query = new WP_query ( $args ); if ( $query-> have_posts() ) { ?> < div id="highlight" class="container"> < div class="row"> < h1 class="section_title ASG_light col-lg-12"> Dernières news< /h1> < /div> < div class="row"> < ?php while ( $query-> have_posts() ) : $query-> the_post(); ?> < ?php $url = wp_get_attachment_image_src( get_post_thumbnail_id( $post-> ID ), 'full' ); ?> < div class="col-lg-4 my-4"> < div class="highlight_sticker"> < div class="highlight_sticker_thumbnail" style="background-image: url('< ?php echo $url[0]; ?> '); "> < /div> < div class="highlight_sticker_info p-4"> < div class="highlight_sticker_title"> < a href="http://www.srcmini.com/< ?php echo the_permalink(); ?>"> < ?php echo the_title(); ?> < /a> < /div> < div class="highlight_sticker_date"> < ?php echo the_date(); ?> < /div> < /div> < div class="highlight_sticker_button"> < span class="oi oi-plus" title="plus" aria-hidden="true"> < /span> < /div> < /div> < /div> < ?php endwhile; ?> < ?php wp_reset_postdata(); ?> < /div> < /div> < ?php } ?> < /header> < ?php /****************************************************************************************************************** */ ?> < section class="container py-5"> < div class="row"> < div class="col-lg-6"> < h1 class="section_title ASG_dark"> Nos dernières vidéos< /h1> < div class="stream_home"> < ?php if( twitch_stream_live() ){ ?> < iframe src="https://player.twitch.tv/?channel=asgardgg" frameborder="0" scrolling="no" height="378" width="650"> < /iframe> < ?php } else { ?> < iframe src="https://www.youtube.com/embed/bwOnTJ_FB4o" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen> < /iframe> < ?php } ?> < /div> < /div> < div class="col-lg-6"> < h1 class="section_title ASG_dark"> Les dernières nouveautés< /h1> < div class="stream_home"> < ul class="list-group ASG_events_list d-flex"> < ?php echo list_sidebar('news', 5); ?> < /ul> < /div> < /div> < /div> < /section> < ?php /****************************************************************************************************************** */ ?> < ? $args = array( 'offset' => 3 ); $query = new WP_query ( $args ); if ( $query-> have_posts() ) { ?> < section class="container"> < div class="row"> < h1 class="section_title ASG_dark col-lg-12"> Plus de news...< /h1> < /div> < div class="row"> < ?php while ( $query-> have_posts() ) : $query-> the_post(); ?> < ?php $url = wp_get_attachment_image_src( get_post_thumbnail_id( $post-> ID ), 'full' ); ?> < div class="col-lg-4 my-4"> < div class="highlight_sticker"> < div class="highlight_sticker_thumbnail" style="background-image: url('< ?php echo $url[0]; ?> '); "> < /div> < div class="highlight_sticker_info p-4"> < div class="highlight_sticker_title"> < a href="http://www.srcmini.com/< ?php echo the_permalink(); ?>"> < ?php echo the_title(); ?> < /a> < /div> < div class="highlight_sticker_date"> < ?php echo the_date(); ?> < /div> < /div> < div class="highlight_sticker_button"> < span class="oi oi-plus" title="plus" aria-hidden="true"> < /span> < /div> < /div> < /div> < ?php endwhile; ?> < ?php wp_reset_postdata(); ?> < div style="clear: both; "> < /div> < /div> < /section> < ?php} get_footer(); ?>

编辑N°2:
Archive.php< ?php get_header(); ?> < /header> < ?php if ( have_posts()): ?> < ?php if ( category_description() ) : // Show an optional category description ?> < ?php echo category_description(); ?> < ?php endif; ?> < ?php /* The loop */ ?> < section class="container ias-container"> < ?php if ( function_exists('yoast_breadcrumb') ) {yoast_breadcrumb('< nav id="breadcrumbs"> ', '< /nav> '); } ?> < ?php //get_sidebar(); $category_title = single_cat_title("", false); ?> < !-- Titre de la catégorie --> < h1> < ?php echo $category_title ?> < /h1> < div class="row"> < ?php while ( have_posts() ) : the_post(); ?> < div class="col-lg-4 my-4 ias-item"> < div class="highlight_sticker"> < div class="highlight_sticker_thumbnail" style="background-image: url('< ?php echo get_the_post_thumbnail_url( $post-> ID ); ?> '); "> < /div> < div class="highlight_sticker_info p-4"> < div class="highlight_sticker_title"> < a href="http://www.srcmini.com/< ?php echo the_permalink(); ?>"> < ?php echo the_title(); ?> < /a> < /div> < div class="highlight_sticker_date"> < ?php echo the_date(); ?> < /div> < /div> < div class="highlight_sticker_button"> < span class="oi oi-plus" title="plus" aria-hidden="true"> < /span> < /div> < /div> < /div> < ?php endwhile; ?> < div style="clear: both; "> < /div> < ?php else : ?> < div class="article_single_content"> < p> Pas encore d'articles par ici, mais que font ces admins?< /p> < /div> < ?php endif; ?> < /div> < /section> < div class="navigation"> < div class="nav-previous alignleft"> < ?php previous_posts_link( 'Older posts' ); ?> < /div> < div class="nav-next alignright"> < ?php next_posts_link( 'Newer posts' ); ?> < /div> < /div> < ?php get_footer(); ?>

#1” .col-lg-4 my-4″ 不是有效的类选择器。尝试使用” .col-lg-4 .my-4″ 或” .my-4″
更好的方法是在元素中添加一个更具体且唯一的类并使用它。

    推荐阅读