点击加载更多按钮后分类名称不显示的问题求助

问题现象 #

为项目列表添加Ajax加载更多按钮后，加载的项目卡片图片、标题显示正常，但分类名称无法展示。

代码排查与修复 #

核心问题1：变量名大小写不一致 #

在functions.php的Ajax回调函数中，定义的术语slug变量是$termsSlug（小写L），但输出div类名时错误使用了$termsSLug（大写L），导致类名无法正确输出，同时后续分类名称获取也可能因潜在报错中断。

核心问题2：未处理术语获取失败的情况 #

get_the_terms和wp_get_post_terms可能返回false或WP_Error对象，直接遍历会触发PHP报错，进而中断输出，这也是分类不显示的常见原因。

修复后的functions.php代码 #

<?php

add_action('wp_ajax_load_posts_by_ajax', 'load_posts_by_ajax_callback');
add_action('wp_ajax_nopriv_load_posts_by_ajax', 'load_posts_by_ajax_callback');
function load_posts_by_ajax_callback()
{
    check_ajax_referer('load_more_projects', 'security');
    $paged = $_POST['page'];

    $args = array(
        'post_type' => 'project',
        'post_status' => 'publish',
        'posts_per_page' => 6,
        'paged' => $paged,

    );
    $my_posts = new WP_Query($args);
    if ($my_posts->have_posts()) { ?>
            <?php
            while ($my_posts->have_posts()) {
                $my_posts->the_post();

                $termsSlug = "";
                $termsArray = get_the_terms(get_the_ID(), "project_category");
                // 添加错误判断
                if (!empty($termsArray) && !is_wp_error($termsArray)) {
                    foreach ($termsArray as $term) {
                        $termsSlug .= $term->slug . ' ';
                    }
                }
            ?>
                    <div class="single-portfolio col-sm-4  <?php echo  $termsSlug; ?>  grid-item">
                            <div class="item">
                                    <a href="<?php the_permalink(); ?>">
                                            <img src="<?php the_post_thumbnail_url(); ?>" alt="Work 1">
                                    </a>
                                    <div class="p-inner">
                                            <a href="<?php the_permalink(); ?>">
                                                    <h4><?php the_title(); ?></h4>
                                            </a>
                                            <div class="cat">
                                                    <?php
                                                    $terms = wp_get_post_terms(get_the_ID(), 'project_category');
                                                    // 添加错误判断
                                                    if (!empty($terms) && !is_wp_error($terms)) {
                                                        foreach ($terms as $term) {
                                                            $term_link = get_term_link($term);
                                                            // 检查分类链接是否有效
                                                            if (!is_wp_error($term_link)) {
                                                                echo '<a href="' . $term_link . '">' . $term->name . '</a>' . ' ';
                                                            }
                                                        }
                                                    }
                                                    ?>
                                            </div>
                                    </div>
                            </div>
                    </div>
            <?php  }
            ?>
    <?php  }
    wp_die();
}

额外优化建议 #

• 替换$post->ID为get_the_ID()：在循环中get_the_ID()更可靠，避免全局变量冲突。
• 检查分类链接有效性：get_term_link也可能返回错误，添加判断避免输出无效链接。

其他代码参考 #

Ajax JavaScript代码 #

var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
var page = 2;
jQuery(function() {
        // init isotope
        var $grid = jQuery('.grid');
        $grid.isotope({
                // options
                itemSelector: '.grid-item',
                percentPosition: true,
        });
        jQuery('body').on('click', '.loadmore', function(e) {

                var data = {
                        'action': 'load_posts_by_ajax',
                        'page': page,
                        'security': '<?php echo wp_create_nonce("load_more_projects"); ?>'
                };

                jQuery.post(ajaxurl, data, function(response) {
                        if (response != '') {
                                var $answer = jQuery(response);

                                //append items to grid
                                $grid.append($answer)
                                        .isotope('appended', $answer);

                                // layout on imagesLoaded
                                $grid.imagesLoaded(function() {
                                        $grid.isotope('layout');
                                });
                                page++;
                        } else {
                                jQuery('.loadmore').text("No more Project!");
                        }
                });
                e.preventDefault();
        });
});

front-page.php相关代码 #

<?php
$terms = get_terms('project_category');
foreach ($terms as  $term) { ?>
        <li data-filter=".<?php echo $term->slug; ?>"><?php echo $term->name; ?></li>
<?php  }
?>
</div>
<div class="filters-content">
        <div class="row grid">
                <?php
                $args = array(
                        'post_type' => 'project',
                        'posts_per_page' => 6,
                        'paged' => get_query_var('paged', 1), //page number 1 on load
                        'post_status' => 'publish',
                );
                $query = new WP_Query($args);
                while ($query->have_posts()) {
                        $query->the_post();
                        $termsArray = get_the_terms($post->ID, 'project_category');
                        $termsSLug = "";
                        foreach ($termsArray as $term) {
                                $termsSLug .= $term->slug . ' ';
                        }
                ?>
                        <div class="single-portfolio col-sm-4  <?php echo  $termsSLug; ?>  grid-item">
                                <div class="item">
                                        <a href="<?php the_permalink(); ?>">
                                                <img src="<?php the_post_thumbnail_url(); ?>" alt="Work 1">
                                        </a>
                                        <div class="p-inner">
                                                <a href="<?php the_permalink(); ?>">
                                                        <h4><?php the_title(); ?></h4>
                                                </a>
                                                <div class="cat">
                                                        <?php
                                                        $terms = wp_get_post_terms($post->ID, 'project_category');
                                                        foreach ($terms as $term) {
                                                                $term_link = get_term_link($term);
                                                                echo '<a href="' . $term_link . '">' . $term->name . '</a>' . ' ';
                                                        }
                                                ?>
                                                </div>
                                        </div>
                                </div>
                        </div>
                <?php  }
                wp_reset_postdata();
                ?>
        </div>
        
        <?php if ($query->max_num_pages >1) { ?>
                  <div class="button_load_more ">
                     <div class="btn_wrapper">
                     <a class="btn btn-default btn_style_more loadmore "href="#">Load More Projects</a>
                       </div>

footer.php截图 #

内容的提问来源于stack exchange，提问作者Devnuru