帮助添加AJAX加载更多按钮

时间:2016-12-09 作者:user6738171

我正在尝试将插件“Easy Load More”添加到我的主题中(https://wordpress.org/plugins/easy-load-more/). 你应该把它包起来<div id="ajax"> 然后放置<?php load_more_button(); ?> 您希望加载更多按钮的位置。我不太清楚添加此代码的正确位置(正如您可以从下面的代码中看到的,它当前位于错误的位置)。下面是我希望“加载更多”按钮的外观图片。

enter image description here

这是我的电流front-page.php

<?php
/*
 * Template Name:
 */

get_header();
get_template_part (\'inc/carousel\');

$the_query = new WP_Query( [
    \'posts_per_page\' => 14,
    \'paged\' => $paged
] );

if ( $the_query->have_posts() ) { 
load_more_button();
?>
    <div id="ajax">
    <?php
    $i = 0;
    while ( $the_query->have_posts() ) { $the_query->the_post();

        if ( $i % 7 === 0 ) { // Large post: on the first iteration and every 7th post after... ?>
        <article <?php post_class( \'col-md-12\' ); ?>>
            <?php the_post_thumbnail(\'large-thumbnail\'); ?>
            <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
            <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
            <?php get_template_part( \'share-buttons\' ); ?>
            <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
            <?php comments_popup_link (\'No Comments\', \'1 Comment\', \'% Comments\', \'comment-count\', \'none\'); ?>
            </article><?php

        } else { // Small posts ?>

            <article <?php post_class( \'col-md-4\' ); ?>>
                <?php the_post_thumbnail( \'medium-thumbnail\' ); ?>
                <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                <?php get_template_part( \'share-buttons\' ); ?>
                <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                <?php comments_popup_link (\'No Comments\', \'1 Comment\', \'% Comments\', \'comment-count\', \'none\'); ?>
            </article>
            <?php
        }
        $i++;
    }
    wp_reset_postdata();?>
    </div>
    <?php
}
else {
    echo \'<p>Sorry, no posts matched your criteria.</p>\';
}
load_more_button();
get_footer();

1 个回复
最合适的回答,由SO网友:iantsch 整理而成

div包装器位于while循环中,并由if子句拆分。这无法正常工作,因为您的循环将生成多达14个id为ajax的div。

将开始div标记放在if ( $the_query->have_posts() ) { 以及之后的关闭wp_reset_postdata(); 你应该没事的。

Edit

您确定没有遗漏任何打开/关闭php标记吗?e、 g.load\\u more\\u button()是用php包装的,但您之前没有关闭php。

<?php
/*
 * Template Name:
 */

get_header();
get_template_part (\'inc/carousel\');

$the_query = new WP_Query( [
    \'posts_per_page\' => 14,
    \'paged\' => get_query_var(\'paged\', 1)
] );

if ( $the_query->have_posts() ) { ?>
    <div id="ajax">
    <?php
    $i = 0;
    while ( $the_query->have_posts() ) { $the_query->the_post();

        if ( $i % 7 === 0 ) { // Large post: on the first iteration and every 7th post after... ?>
        <article <?php post_class( \'col-md-12\' ); ?>>
            <?php the_post_thumbnail(\'large-thumbnail\'); ?>
            <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
            <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
            <?php get_template_part( \'share-buttons\' ); ?>
            <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
            <?php comments_popup_link (\'No Comments\', \'1 Comment\', \'% Comments\', \'comment-count\', \'none\'); ?>
            </article><?php

        } else { // Small posts ?>

            <article <?php post_class( \'col-md-4\' ); ?>>
                <?php the_post_thumbnail( \'medium-thumbnail\' ); ?>
                <h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
                <?php get_template_part( \'share-buttons\' ); ?>
                <a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
                <?php comments_popup_link (\'No Comments\', \'1 Comment\', \'% Comments\', \'comment-count\', \'none\'); ?>
            </article>
            <?php
        }
        $i++;
    }?>
    </div>
    <?php if(get_query_var(\'paged\') < $the_query->max_num_pages) {
       load_more_button();
    }
}
elseif (!get_query_var(\'paged\') || get_query_var(\'paged\') == \'1\') {
    echo \'<p>Sorry, no posts matched your criteria.</p>\';
}
wp_reset_postdata();
get_footer();

相关推荐

尝试在WordPress中实现AJAX注释,遇到WP错误

我试图在WordPress中为我的评论实现Ajax,使用this tutorial. 但我在将教程中的代码集成到自己的预构建主题时遇到了问题。问题是,我要么得到一个WP错误“检测到重复注释;看来你已经说过了!”或标准500错误。以下是我得到的:下面是我对ajax的评论。js文件如下所示: * Let\'s begin with validation functions */ jQuery.extend(jQuery.fn, { /* * check i