>백엔드 개발 >PHP 튜토리얼 >WordPress 단축 코드에서 AJAX를 사용하여 임의의 인용문을 표시하는 방법은 무엇입니까?

WordPress 단축 코드에서 AJAX를 사용하여 임의의 인용문을 표시하는 방법은 무엇입니까?

Linda Hamilton
Linda Hamilton원래의
2024-12-08 21:35:20393검색

How to Display Random Quotes with AJAX in a WordPress Shortcode?

WordPress 단축 코드에서 AJAX를 사용하여 무작위 인용문을 생성하는 방법

질문:

다음을 사용하여 페이지 콘텐츠를 업데이트하는 방법 AJAX 인 WordPress?

답변:

다음은 질문에 제공된 코드의 향상된 버전입니다. 이 코드는 임의의 따옴표를 표시하기 위해 WordPress 단축 코드에 AJAX 기능을 구현합니다.

단축코드 (shortcode.php)

function random_quote_shortcode( $atts ) {
    $atts = shortcode_atts( array(
        'path' => get_template_directory_uri() . '/quotes.txt'
    ), $atts );

    $quotes = file( $atts['path'] );
    $random_quote = $quotes[array_rand($quotes)];

    $output = sprintf(
        '<div>

AJAX 핸들러(ajax-handler.php)

add_action( 'wp_ajax_load_random_quote', 'load_random_quote' );
add_action( 'wp_ajax_nopriv_load_random_quote', 'load_random_quote' );

function load_random_quote() {
    $quotes = file( $_POST['file_path'] );
    $random_quote = $quotes[array_rand($quotes)];

    echo $random_quote;
    wp_die();
}

jQuery 스크립트 (ajax-script.js)

jQuery(document).ready(function($) {
    $('#newquote').click(function(e) {
        e.preventDefault();

        $.ajax({
            url: ajaxurl,
            data: {
                action: 'load_random_quote',
                file_path: '<?php echo get_template_directory_uri() . '/quotes.txt'; ?>'
            },
            success: function(data) {
                $('#randomquote').html(data);
            }
        });
    });
});

스크립트 대기열에 넣고 데이터 현지화(functions.php)

function enqueue_ajax_scripts() {
    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/ajax-script.js', array('jquery'), '1.0.0', true );
    wp_localize_script( 'ajax-script', 'ajax_object', array(
        'ajax_url' => admin_url( 'admin-ajax.php' )
    ) );
}

add_action( 'wp_enqueue_scripts', 'enqueue_ajax_scripts' );

설명:

  1. 단축코드 random_quote는 초기 무작위 견적과 "새 견적"이라는 버튼을 생성합니다.
  2. "새 견적" 버튼을 클릭하면 jQuery가 AJAX 요청을 처리합니다.
  3. 핸들러 함수 load_random_quote는 새로운 임의의 인용문이 이전 인용문 대신 jQuery에 의해 표시됩니다.
  4. 보안 문제를 방지하기 위해 AJAX nonce가 구현되었습니다.

추가 참고:

사용자 정의 테마를 사용하는 경우 get_template_directory_uri()를 테마에 적합한 함수로 바꾸세요.

위 내용은 WordPress 단축 코드에서 AJAX를 사용하여 임의의 인용문을 표시하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.