// 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(); }