Blog Ajax Pagination PHP

PHOTO EMBED

Tue Mar 11 2025 13:22:43 GMT+0000 (Coordinated Universal Time)

Saved by @quanganh141220 #ajax #blog #pagination 

// AJAX BLOG PAGE
add_action('wp_ajax_filter_posts', 'filter_posts_callback');
add_action('wp_ajax_nopriv_filter_posts', 'filter_posts_callback');

function filter_posts_callback() {
    $category = isset($_POST['category']) ? sanitize_text_field($_POST['category']) : 'all';
    $paged = isset($_POST['paged']) ? intval($_POST['paged']) : 1;

    $args = array(
        'post_type' => 'post',
        'posts_per_page' => 10,
        'paged' => $paged,
    );

    if ($category !== 'all') {
        $args['tax_query'] = array(
            array(
                'taxonomy' => 'category',
                'field' => 'slug',
                'terms' => $category,
            ),
        );
    }

    $query = new WP_Query($args);

    ob_start();
    if ($query->have_posts()) :
        while ($query->have_posts()) : $query->the_post();
            $category = get_the_category();
            $brand_color = '';
            $color_class = 'color-default';
            $time_read = get_field('time_read');

            if (!empty($category)) {
                $category_id = $category[0]->term_id;
                $brand_color = get_field('brand_color', 'category_' . $category_id);

                if ($brand_color) {
                    $color_class = 'color-' . esc_attr($brand_color);
                }
            }
            ?>
            <div class="post-card <?php echo esc_attr(strtolower(str_replace(' ', '-', get_the_category()[0]->name))); ?>">
                <div class="post-header">
                    <img src="<?php the_post_thumbnail_url(); ?>" alt="<?php the_title(); ?>" class="post-feature-image">
                </div>
                <div class="post-info">
                    <div class="post-meta">
                        <?php if ($category || $time_read): ?>
                            <?php if ($category): ?>
                                <span class="category <?php echo esc_attr($color_class); ?>">
                                    <?php echo esc_html($category[0]->name); ?>
                                </span>
                            <?php endif; ?>
                            <?php if ($time_read): ?>
                                <span class="time-read">
                                    <?php if ($category); ?>
                                    <?php echo esc_html($time_read); ?>
                                </span>
                            <?php endif; ?>
                        <?php endif; ?>
                    </div>
                    <h3><?php the_title(); ?></h3>
                    <div class="author-posted">
                        <div class="author-info">
                            <img src="<?php echo get_avatar_url(get_the_author_meta('ID')); ?>" alt="Author Avatar" class="author-avatar">
                            <span class="author-name"><?php the_author(); ?></span>
                        </div>
                        <div class="post-time">
                            <span>Last Update: <?php the_modified_date(); ?></span>
                        </div>
                    </div>
                    <a href="<?php the_permalink(); ?>" class="post-link">Learn More</a>
                </div>
            </div>
            <?php
        endwhile;
        wp_reset_postdata();
    else :
        echo '<p>No posts found.</p>';
    endif;
    $posts_html = ob_get_clean(); 

    $total_pages = $query->max_num_pages;

    wp_send_json(array(
        'posts' => $posts_html,
        'total_pages' => $total_pages,
        'current_page' => $paged,
    ));

    wp_die();
}
content_copyCOPY