feat: add content feed with AJAX filtering and load more on front page

This commit is contained in:
2026-04-03 01:13:09 +05:00
parent 82105c6f09
commit 8f1f001085
7 changed files with 484 additions and 1 deletions
@@ -0,0 +1,78 @@
<?php
/**
* БИТ.WMS Child Theme — templates/content-card.php
*
* Universal content card used in the content feed section and AJAX responses.
* Reads the current post from The Loop (global $post).
*
* @package bitwms-child
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
// Map post_type to label. For 'post' also check for "news" category.
$type_labels = array(
'case' => __( 'Кейс', 'bitwms-child' ),
'webinar' => __( 'Вебинар', 'bitwms-child' ),
'course' => __( 'Курс', 'bitwms-child' ),
'event' => __( 'Мероприятие', 'bitwms-child' ),
'material' => __( 'Материал', 'bitwms-child' ),
);
$post_type = get_post_type();
$badge_text = '';
if ( 'post' === $post_type ) {
if ( has_category( 'news' ) ) {
$badge_text = __( 'Новость', 'bitwms-child' );
} else {
$badge_text = __( 'Статья', 'bitwms-child' );
}
} elseif ( isset( $type_labels[ $post_type ] ) ) {
$badge_text = $type_labels[ $post_type ];
}
// Trim excerpt to 15 words.
$excerpt = get_the_excerpt();
if ( $excerpt ) {
$words = explode( ' ', $excerpt );
$excerpt = implode( ' ', array_slice( $words, 0, 15 ) );
if ( count( $words ) > 15 ) {
$excerpt .= '…';
}
}
?>
<article class="content-card" data-post-type="<?php echo esc_attr( $post_type ); ?>">
<a href="<?php the_permalink(); ?>" class="content-card__link">
<div class="content-card__image">
<?php if ( has_post_thumbnail() ) : ?>
<?php the_post_thumbnail( 'medium_large', array( 'alt' => esc_attr( get_the_title() ) ) ); ?>
<?php else : ?>
<div class="content-card__placeholder" aria-hidden="true"></div>
<?php endif; ?>
</div>
<div class="content-card__body">
<?php if ( $badge_text ) : ?>
<span class="badge"><?php echo esc_html( $badge_text ); ?></span>
<?php endif; ?>
<h3 class="content-card__title"><?php the_title(); ?></h3>
<?php if ( $excerpt ) : ?>
<p class="content-card__excerpt"><?php echo esc_html( $excerpt ); ?></p>
<?php endif; ?>
<div class="content-card__meta">
<time datetime="<?php echo esc_attr( get_the_date( 'Y-m-d' ) ); ?>">
<?php echo esc_html( get_the_date( 'd.m.Y' ) ); ?>
</time>
</div>
</div>
</a>
</article>
@@ -0,0 +1,78 @@
<?php
/**
* БИТ.WMS Child Theme — templates/section-filter.php
*
* Content feed section with tag-based filter bar and "Load more" button.
* Initial query fetches 6 posts across all 6 custom post types, ordered by date DESC.
*
* @package bitwms-child
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
$filter_buttons = array(
'all' => __( 'Все', 'bitwms-child' ),
'post' => __( 'Статьи', 'bitwms-child' ),
'case' => __( 'Кейсы', 'bitwms-child' ),
'webinar' => __( 'Вебинары', 'bitwms-child' ),
'course' => __( 'Курсы', 'bitwms-child' ),
'event' => __( 'Мероприятия', 'bitwms-child' ),
'material'=> __( 'Материалы', 'bitwms-child' ),
);
$post_types = array( 'post', 'case', 'webinar', 'course', 'event', 'material' );
$posts_per_page = 6;
$initial_query = new WP_Query( array(
'post_type' => $post_types,
'posts_per_page' => $posts_per_page,
'orderby' => 'date',
'order' => 'DESC',
'post_status' => 'publish',
) );
?>
<section class="content-feed">
<div class="container">
<div class="filter-bar" role="tablist">
<?php foreach ( $filter_buttons as $value => $label ) : ?>
<button
class="filter-bar__btn<?php echo $value === 'all' ? ' filter-bar__btn--active' : ''; ?>"
data-filter="<?php echo esc_attr( $value ); ?>"
role="tab"
aria-selected="<?php echo $value === 'all' ? 'true' : 'false'; ?>"
>
<?php echo esc_html( $label ); ?>
</button>
<?php endforeach; ?>
</div>
<div class="content-grid" id="content-grid">
<?php if ( $initial_query->have_posts() ) : ?>
<?php while ( $initial_query->have_posts() ) : $initial_query->the_post(); ?>
<?php get_template_part( 'templates/content-card' ); ?>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p><?php esc_html_e( 'Материалы не найдены.', 'bitwms-child' ); ?></p>
<?php endif; ?>
</div>
<?php if ( $initial_query->found_posts > $posts_per_page ) : ?>
<div class="content-feed__more">
<button
class="btn btn--outline load-more-btn"
id="load-more-btn"
data-page="1"
data-filter="all"
>
<?php esc_html_e( 'Загрузить ещё', 'bitwms-child' ); ?>
</button>
</div>
<?php endif; ?>
</div>
</section>