WordPress如何配置AJAX以支持点击加载更多?

WordPress 配置 AJAX 支持点击加载更多内容通常涉及到前端 JavaScript 和服务器端的配合。以下是基本步骤:

  1. 安装插件:你可以选择一个现成的插件如 "Advanced Custom Fields" 或者 "WP Infinite Scroll",它们已经内置了 AJAX 功能,简化了设置过程。

    function load_more_posts() {
    if ( ! current_user_can( 'edit_posts' ) ) {
    wp_die( -1 ); // 检查权限,仅允许有编辑权限的用户访问
    }

    args = array( 'post_type' => 'your_post_type', 'posts_per_page' => 5, // 加载的数量 'paged' => isset( _POST['page_num'] ) ? absint( _POST['page_num'] ) : 1, 'offset' => ( paged - 1 ) * posts_per_page ); new_query = new WP_Query( $args );

    if ( new_query->have_posts() ) { ob_start(); while ( new_query->have_posts() ) {
    new_query->the_post(); // 输出文章内容... } wp_reset_postdata(); output = ob_get_clean();
    } else {
    output = __( 'No more posts to load.' ); } die( json_encode( output ) );
    }
    add_action( 'wp_ajax_load_more_posts', 'load_more_posts' );
    add_action( 'wp_ajax_nopriv_load_more_posts', 'load_more_posts' );

https://so.csdn.net/chat?utm_source=vip_chatgpt_common_pc_toolbar&spm=1030.2200.3001.10025

相关推荐
宿6745 小时前
vue3-包管理器
前端·vue.js
@PHARAOH5 小时前
WHAT - Remix 入门和基本实践:理解两套产物
前端·remix
mayaairi5 小时前
Vue2 生命周期完全指南:从创建到销毁的8个钩子函数
前端·javascript·vue.js
研☆香6 小时前
一个简单的气泡弹窗制作
javascript
xy34536 小时前
axure9.0 如何打造一个计时器(简单版)
前端·ui·html·axure·原型·产品设计
大模型丫丫6 小时前
用 TypeScript、NestJS 和 LangGraph 搭建一个可控的 AI Agent
javascript·人工智能·typescript
IMPYLH7 小时前
HTML 的 <pre> 元素
前端·javascript·html
shmily麻瓜小菜鸡7 小时前
JavaScript / TypeScript 易踩坑知识点 —— 异步编程类
开发语言·javascript·typescript
tsumikistep8 小时前
【前端】Vue + Axios 跨域问题实战:7070 代理转发 8080 + 401 报错分析(黑马外卖)
前端·javascript·vue.js
lichenyang4538 小时前
鸿蒙首页从等高商品 Grid 到双列瀑布流:同一张图也能做出小红书式浏览节奏
前端