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

相关推荐
心.c6 分钟前
文件上传 - 入门篇
前端·javascript·vue.js·node.js·js
弓.长.7 分钟前
React Native 鸿蒙跨平台开发:实现一个计时器工具
javascript·react native·react.js
Dragon Wu9 分钟前
ReactNative MMKV和React Native Keychain存储本地数据
javascript·react native·react.js·前端框架
Never_Satisfied12 分钟前
在JavaScript / HTML中,cloneNode()方法详细指南
开发语言·javascript·html
—Qeyser19 分钟前
Flutter组件 - BottomNavigationBar 底部导航栏
开发语言·javascript·flutter
hxjhnct20 分钟前
CSS 伪类和伪元素
前端·javascript·css
❆VE❆21 分钟前
【css】打造倾斜异形按钮:CSS radial-gradient 与抗锯齿实战解析
前端·javascript·css
followYouself25 分钟前
ViewPager+Fragment
android·前端
37方寸27 分钟前
前端基础知识(HTML、CSS)
前端·css·html
u13013031 分钟前
深入解析二维码技术与前端生成方案
前端·二维码