Good-Production/Fakel-Gym
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

блоки в админку и фиксы стилей

Browse Source
This commit is contained in:
GP_DEV
2025-06-03 21:52:23 +03:00
parent 32e9eba2ac
commit 9aa5906efa
16 changed files with 3797 additions and 436 deletions
Download Patch File Download Diff File Expand all files Collapse all files

259
template-parts/la-components/blocks/reviews-block/reviews-block.php
View File

@@ -1,136 +1,153 @@
<?php
// Моковые данные отзывов (потом заменить на ACF поля)
$reviewsData = [
'google' => [
'title' => 'Отзывы Google',
'reviews' => [
[
'src' => 'https://placehold.co/800x600/4f46e5/ffffff?text=Отзыв+Google+1',
'thumb' => 'https://placehold.co/300x200/4f46e5/ffffff?text=G1',
'alt' => 'Отзыв Google 1'
],
[
'src' => 'https://placehold.co/800x600/7c3aed/ffffff?text=Отзыв+Google+2',
'thumb' => 'https://placehold.co/300x200/7c3aed/ffffff?text=G2',
'alt' => 'Отзыв Google 2'
],
[
'src' => 'https://placehold.co/800x600/8b5cf6/ffffff?text=Отзыв+Google+3',
'thumb' => 'https://placehold.co/300x200/8b5cf6/ffffff?text=G3',
'alt' => 'Отзыв Google 3'
],
[
'src' => 'https://placehold.co/800x600/a855f7/ffffff?text=Отзыв+Google+4',
'thumb' => 'https://placehold.co/300x200/a855f7/ffffff?text=G4',
'alt' => 'Отзыв Google 4'
]
]
],
'yandex' => [
'title' => 'Отзывы Яндекс',
'reviews' => [
[
'src' => 'https://placehold.co/800x600/f59e0b/ffffff?text=Отзыв+Яндекс+1',
'thumb' => 'https://placehold.co/300x200/f59e0b/ffffff?text=Я1',
'alt' => 'Отзыв Яндекс 1'
],
[
'src' => 'https://placehold.co/800x600/d97706/ffffff?text=Отзыв+Яндекс+2',
'thumb' => 'https://placehold.co/300x200/d97706/ffffff?text=Я2',
'alt' => 'Отзыв Яндекс 2'
],
[
'src' => 'https://placehold.co/800x600/b45309/ffffff?text=Отзыв+Яндекс+3',
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=Я3',
'alt' => 'Отзыв Яндекс 3'
]
]
],
'video' => [
'title' => 'Видеоотзывы',
'reviews' => [
[
'src' => '/path/to/video1.mp4', // Путь к видеофайлу
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=В1',
'alt' => 'Видеоотзыв 1',
'type' => 'video',
'video_type' => 'mp4' // Тип видео
],
[
'src' => '/path/to/video2.webm',
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=В2',
'alt' => 'Видеоотзыв 2',
'type' => 'video',
'video_type' => 'webm'
],
[
'src' => '/path/to/video3.mov',
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=В3',
'alt' => 'Видеоотзыв 3',
'type' => 'video',
'video_type' => 'mov'
]
]
]
];
$id = 'reviews-block-' . $block['id'];
if ( ! empty($block['anchor'] ) ) {
$id = $block['anchor'];
}
$block_id = 'reviews-' . $block['id'];
$classes = 'block-reviews-block';
if ( ! empty( $block['className'] ) ) {
$classes .= ' ' . $block['className'];
}
if ( ! empty( $block['align'] ) ) {
$classes .= ' align' . $block['align'];
}
$heading = get_field('heading');
$slider_tabs = get_field('slider_tabs');
$slider_video_reviews = get_field('slider_video_reviews');
$stars = get_field('stars');
?>
<div class="reviews-block container mx-auto"
id="<?php echo $block_id; ?>"
data-reviews-id="<?php echo $block_id; ?>">
<div class="reviews-block container mx-auto mt-[24px]"
id="<?php echo esc_attr( $id ); ?>"
data-reviews-id="<?php echo esc_attr( $id ); ?>">
<div>
<h2 class="text-[32px] font-bold mb-[30px]">Отзывы клиентов</h2>
<?php if ($heading) : ?>
<h2 class="text-[32px] font-bold mt-[24px]"><?php echo esc_html($heading); ?></h2>
<?php endif; ?>
<!-- Табы -->
<div class="flex gap-[10px] mb-[30px]">
<?php foreach ($reviewsData as $index => $tab): ?>
<button class="tab-button px-[24px] py-[12px] border-0 rounded-[25px] cursor-pointer transition-all <?php echo $index === 'google' ? 'active underline' : ''; ?>"
data-tab="<?php echo $index; ?>">
<?php echo esc_html($tab['title']); ?>
<div class="flex gap-[10px] mt-[24px]">
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
<?php if (!empty($tab['tab_name'])) : ?>
<button class="tab-button px-[24px] py-[12px] border rounded-[25px] cursor-pointer transition-all <?php echo $tab_index === 0 ? 'active underline' : ''; ?>"
data-tab="<?php echo $tab_index; ?>">
<?php echo esc_html($tab['tab_name']); ?>
</button>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
<?php if ($slider_video_reviews) : ?>
<button class="tab-button px-[24px] py-[12px] border rounded-[25px] cursor-pointer transition-all"
data-tab="video">
Видеоотзывы
</button>
<?php endforeach; ?>
<?php endif; ?>
</div>
</div>
<!-- Контент табов -->
<?php foreach ($reviewsData as $tab_id => $tab_data): ?>
<div class="tab-content <?php echo $tab_id === 'google' ? 'block' : 'hidden'; ?>"
id="tab-<?php echo $tab_id; ?>">
<!-- Swiper для отзывов -->
<div class="swiper reviews-swiper mb-[20px] h-[440px]" id="swiper-<?php echo $tab_id; ?>">
<div class="swiper-wrapper">
<?php foreach ($tab_data['reviews'] as $review): ?>
<div class="swiper-slide cursor-pointer min-h-[440px]">
<a href="<?php echo esc_url($review['src']); ?>"
class="glightbox block w-full h-full relative"
data-gallery="reviews-<?php echo $tab_id; ?>"
<?php if (isset($review['type']) && $review['type'] === 'video'): ?>
data-type="video"
data-description="<?php echo esc_attr($review['alt']); ?>"
<?php endif; ?>>
<img src="<?php echo esc_url($review['thumb']); ?>"
alt="<?php echo esc_attr($review['alt']); ?>"
class="w-full h-full object-cover rounded-lg">
<?php if (isset($review['type']) && $review['type'] === 'video'): ?>
<!-- Иконка воспроизведения для видео -->
<div class="absolute inset-0 flex items-center justify-center bg-[rgba(0,0,0,0.5)] hover:bg-[rgba(0,0,0,0.1)] transition-all">
<div class="w-[60px] h-[60px] bg-white bg-opacity-90 rounded-full flex items-center justify-center shadow-lg">
<svg class="w-[24px] h-[24px]" fill="currentColor" viewBox="0 0 20 20">
<path d="M8 5v10l8-5-8-5z"/>
</svg>
</div>
</div>
<?php endif; ?>
</a>
</div>
<?php endforeach; ?>
<div class="mt-[24px] flex gap-[20px]">
<div class="flex gap-[5px] w-full items-center justify-center">
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
</svg>
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
</svg>
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
</svg>
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
</svg>
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
</svg>
<div>
Оценок:  
<?php
echo $stars;
?>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
<div class="tab-content mt-[24px] <?php echo $tab_index === 0 ? 'block' : 'hidden'; ?>"
id="tab-<?php echo $tab_index; ?>">
<?php if (!empty($tab['slider_images'])) : ?>
<div class="swiper reviews-swiper" id="swiper-<?php echo $tab_index; ?>">
<div class="swiper-wrapper">
<?php foreach ($tab['slider_images'] as $image) : ?>
<div class="swiper-slide max-w-[449px] cursor-pointer">
<a href="<?php echo esc_url($image['url']); ?>"
class="glightbox block w-full h-full relative"
data-gallery="reviews-<?php echo $tab_index; ?>">
<img src="<?php echo esc_url($image['url']); ?>"
alt="<?php echo esc_attr($image['alt']); ?>"
class="w-full h-full object-contain">
</a>
</div>
<?php endforeach; ?>
</div>
</div>
<?php endif; ?>
</div>
<?php endforeach; ?>
<?php endif; ?>
<?php if ($slider_video_reviews) : ?>
<div class="tab-content mt-[24px] hidden" id="tab-video">
<div class="swiper reviews-swiper" id="swiper-video">
<div class="swiper-wrapper">
<?php foreach ($slider_video_reviews as $video) : ?>
<?php if (!empty($video['slider_video_review'])) : ?>
<div class="swiper-slide max-w-[449px] cursor-pointer">
<a href="<?php echo esc_url($video['slider_video_review']['url']); ?>"
class="glightbox block w-full h-full relative"
data-gallery="reviews-video"
data-type="video">
<div class="w-full h-[200px] relative overflow-hidden rounded-lg">
<?php if (!empty($video['slider_video_prereview'])) : ?>
<div class="w-full h-full bg-[#f3f4f6] flex items-center justify-center">
<div class="text-center">
<div class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] w-[60px] h-[60px] bg-white bg-opacity-90 rounded-full flex items-center justify-center mx-auto mb-[8px]">
<svg class="w-[24px] h-[24px]" fill="currentColor" viewBox="0 0 20 20">
<path d="M8 5v10l8-5-8-5z"/>
</svg>
</div>
<img src="<?php echo esc_url($video['slider_video_prereview']['url']); ?>"
alt="<?php echo esc_attr($video['slider_video_prereview']['alt'] ?: 'Превью видеоотзыва'); ?>"
class="w-full h-full object-cover">
</div>
</div>
<?php else : ?>
<div class="w-full h-full bg-[#f3f4f6] flex justify-center">
<div class="text-center">
<div class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] w-[60px] h-[60px] bg-white bg-opacity-90 rounded-full flex items-center justify-center mx-auto mb-[8px]">
<svg class="w-[24px] h-[24px]" fill="currentColor" viewBox="0 0 20 20">
<path d="M8 5v10l8-5-8-5z"/>
</svg>
</div>
<p class="text-[14px] text-[#6b7280]">Видеоотзыв</p>
</div>
</div>
<?php endif; ?>
</div>
</a>
</div>
<?php endif; ?>
<?php endforeach; ?>
</div>
</div>
</div>
<?php endif; ?>
</div>