WordPress Ajax加载分类下的文章功能

首先,我们要在 WordPress 后台添加一个新的 Ajax 功能,在 functions.php 中添加如下代码:

// 添加 Ajax 加载分类下文章功能
add_action('wp_ajax_load_category_posts','load_category_posts_callback');
add_action('wp_ajax_nopriv_load_category_posts','load_category_posts_callback');
 
function load_category_posts_callback(){
  // 获取分类ID
  $cat_id = $_POST['cat_id'];
  // 设置参数
  $args = array(
    'cat' => $cat_id,
    'orderby' => 'date',
    'order' => 'DESC',
    'posts_per_page' => -1
  );
  $query = new WP_Query( $args );
  // 开始循环
  if ( $query->have_posts() ) :
    while ( $query->have_posts() ) : $query->the_post();
      // 这里填写文章模板
      echo '<article>';
      echo '<h3><a href="'.get_permalink().'">'.get_the_title().'</a></h3>';
      echo '<div class="entry-content">'.get_the_excerpt().'</div>';
      echo '</article>';
    endwhile;
  endif;
  // 重置post数据
  wp_reset_postdata();
  // 结束 Ajax 功能
  die();
}

接下来,我们要在需要加载文章的页面(可以是首页或者某个分类下的页面)中添加 JavaScript 代码,用来发起 Ajax 请求:

// 加载文章
jQuery(document).ready(function($){
  // 获取分类ID
  var cat_id = '1'; // 填写你要加载的分类ID
  // 设置Ajax参数
  var data = {
    'action': 'load_category_posts',
    'cat_id': cat_id
  };
  // Ajax请求
  $.post(ajaxurl, data, function(response) {
    // 将文章内容添加到页面中
    $('.post-list').html(response);
  });
});

最后,我们要在页面添加一个用来显示文章内容的容器:

<div class="post-list"></div>