WordPress?? AJAX? ???? ? ?? ??? ?? ??

??:

AJAX? ?? ???? ???? ???? ?? ????? ???? ?????. WordPress ??? ?? ??. ?? ?? ???? ?? ???? ?? ???? ??? ? ?? ???? ??? ? ?? ??? ??? ?????. ? ????? AJAX? ???? ? ?? ??? ??? ??? ? ?? ???? ???? ???? ??? ????.

?? ??:

???? AJAX? ???? ??? ??? ????? ????? ???? ???? ?? ?? ?? ??? ????. ???? ???? ?? ???? ??? ??????. ??? ???? jQuery?? ???? ??? ?????? ???? ???? ???? ???? ?????.

???:

??? ?? ??? ??? ?? ? ?? ???? ??? ??????. :

1. jQuery: $.post ??? ??? ??? (??? * (page - 1) * ppp ?? ppp) 1? ?????. ?? ??? ??? ?? ???? ???? ????? ? ??? (??? - 1) * ppp? ???? ???.
2. AJAX ??: function.php? more_post_ajax ???? offset ??? paged ??? ?? ???? ???. ??? ?? WP_Query? ??? ??? ???? ???? ???.
3. php: ?? ???? ?? PHP ??? ???? ??? ??? ? ????.
4. WordPress ???? ???: more_post_ajax ??? WordPress ????? ?????? ???. ???? ???? function.js?? ????? ???? ?? ????? ???. ?? ?? JavaScript ?? ??? ajax_posts ??? ??? ? ????.

?? ??:**

??? ??(index.php):

// Calculate the offset for page 2 onwards
$offset = ( isset( $_GET['page'] ) && $_GET['page'] > 1 ) ? ( $_GET['page'] - 1 ) * $postsPerPage : 0;

$args = [
    'post_type'             => 'post',
    'posts_per_page'        => $postsPerPage,
    'cat'                   => 1,
    'offset'                => $offset,
];

AJAX ?? (functions.php):

function more_post_ajax(){
    $ppp = (isset($_POST["ppp"])) ? $_POST["ppp"] : 3;
    $page = (isset($_POST['pageNumber'])) ? $_POST['pageNumber'] : 0;

    header("Content-Type: text/html");

    $args = array(
        'suppress_filters'     => true,
        'post_type'             => 'post',
        'posts_per_page'        => $ppp,
        'cat'                   => 1,
        'paged'                 => $page + 1, // Increase the page by 1 since offset is already calculated in the template file
    );

    $loop = new WP_Query($args);

    $out = '';

    if ($loop->have_posts()) :  while ($loop->have_posts()) : $loop->the_post();
        // Generate HTML for the post
        $out .= '<div class="small-12 large-4 columns">';
        $out .= '<h1>'.get_the_title().'</h1>';
        $out .= '<p>'.get_the_content().'</p>';
        $out .= '</div>';

    endwhile;
    endif;
    wp_reset_postdata();
    die($out);
}

// Localize the 'more_post_ajax' script
wp_localize_script( 'twentyfifteen-script', 'ajax_posts', array(
    'ajaxurl'   => admin_url( 'admin-ajax.php' ),
    'noposts'   => __('No older posts found', 'twentyfifteen'),
));

add_action('wp_ajax_nopriv_more_post_ajax', 'more_post_ajax');
add_action('wp_ajax_more_post_ajax', 'more_post_ajax');

ajax.js:

$(document).ready(function() {
    var ppp = 3;
    var cat = 8;
    var pageNumber = 1;

    function load_posts(){
        pageNumber++;
        var str = '&cat=' + cat + '&pageNumber=' + pageNumber + '&ppp=' + ppp + '&action=more_post_ajax';
        $.ajax({
            type: "POST",
            dataType: "html",
            url: ajax_posts.ajaxurl,
            data: str,
            success: function(data){
                var $data = $(data);
                if($data.length){
                    $("#ajax-posts").append($data);
                    $("#more_posts").attr("disabled",false);
                } else {
                    $("#more_posts").attr("disabled",true);
                }
            },
            error : function(jqXHR, textStatus, errorThrown) {
                $loader.html(jqXHR + " :: " + textStatus + " :: " + errorThrown);
            }
        });
        return false;
    }

    $("#more_posts").on("click",function(){
        $("#more_posts").attr("disabled",true);
        load_posts();
    });
});

??:

??? ??? ???? ?????? , AJAX? ???? ? ?? ??? ?? ??? ????? ??? ? ????. ??? ??? WordPress ???? ???? JavaScript ?? ??? WordPress ??? ?? ??? ??? ?? ? ???? ???? ? ??? ??? ???. ??? ???? ?? ?? ???? ???? ???? ???? ??? ??? ?? ?? ?? ??? ?????.

? ??? ? WordPress \'? ?? ??? ??\' ??? AJAX? ???? ?? ??? ??????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!