правки test1

wp-content/themes/twentytwentyfour/assets/css/test1-shared-shell.css

@@ -17,14 +17,29 @@
   flex-direction: column;
 }
 
+.test1-shared-faq-page {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+
 .test1-shared-cart-page .site-main {
   flex: 1 0 auto;
 }
 
+.test1-shared-faq-page .site-main {
+  flex: 1 0 auto;
+  padding-bottom: 26px;
+}
+
 .test1-shared-cart-page .classic-footer {
   margin-top: auto;
 }
 
+.test1-shared-faq-page .classic-footer {
+  margin-top: auto;
+}
+
 .test1-shared-shell .site-header {
   position: sticky;
   top: 0;

wp-content/themes/twentytwentyfour/assets/js/test1-faq.js

@@ -0,0 +1,38 @@
+(() => {
+  const faqItems = document.querySelectorAll('.faq-item')
+
+  if (!faqItems.length) {
+    return
+  }
+
+  faqItems.forEach(item => {
+    const trigger = item.querySelector('.faq-question')
+    const answer = item.querySelector('.faq-answer')
+
+    if (!trigger || !answer) {
+      return
+    }
+
+    trigger.addEventListener('click', () => {
+      const isOpen = item.classList.contains('open')
+
+      faqItems.forEach(entry => {
+        const entryTrigger = entry.querySelector('.faq-question')
+        const entryAnswer = entry.querySelector('.faq-answer')
+
+        entry.classList.remove('open')
+        entryTrigger?.setAttribute('aria-expanded', 'false')
+
+        if (entryAnswer) {
+          entryAnswer.hidden = true
+        }
+      })
+
+      if (!isOpen) {
+        item.classList.add('open')
+        trigger.setAttribute('aria-expanded', 'true')
+        answer.hidden = false
+      }
+    })
+  })
+})()

wp-content/themes/twentytwentyfour/functions.php

@@ -228,6 +228,29 @@ function twentytwentyfour_test1_template( $template ) {
 }
 add_filter( 'template_include', 'twentytwentyfour_test1_template' );
 
+/**
+ * Use a standalone PHP template for the page slug "faq".
+ *
+ * @since Twenty Twenty-Four 1.0
+ *
+ * @param string $template Resolved template path.
+ * @return string
+ */
+function twentytwentyfour_faq_template( $template ) {
+	if ( ! is_page( 'faq' ) ) {
+		return $template;
+	}
+
+	$custom_template = get_theme_file_path( 'page-faq.php' );
+
+	if ( file_exists( $custom_template ) ) {
+		return $custom_template;
+	}
+
+	return $template;
+}
+add_filter( 'template_include', 'twentytwentyfour_faq_template' );
+
 /**
  * Use a lightweight custom template for the WooCommerce checkout page.
  *
@@ -281,7 +304,7 @@ add_filter( 'template_include', 'twentytwentyfour_cart_template', 20 );
  * @return void
  */
 function twentytwentyfour_test1_assets() {
-	$use_test1_assets = is_page( 'test1' );
+	$use_test1_assets = is_page( array( 'test1', 'faq' ) );
 
 	if ( ! $use_test1_assets ) {
 		return;
@@ -290,7 +313,7 @@ function twentytwentyfour_test1_assets() {
 	$css_file = ABSPATH . 'index3.css';
 	$js_file  = ABSPATH . 'index3.js';
 
-	if ( is_page( 'test1' ) ) {
+	if ( $use_test1_assets ) {
 		wp_dequeue_style( 'global-styles' );
 		wp_dequeue_style( 'wp-block-library' );
 		wp_dequeue_style( 'wp-block-library-theme' );
@@ -335,6 +358,20 @@ function twentytwentyfour_test1_assets() {
 		}
 	}
 
+	if ( is_page( 'faq' ) ) {
+		$faq_js_file = get_theme_file_path( 'assets/js/test1-faq.js' );
+
+		if ( file_exists( $faq_js_file ) ) {
+			wp_enqueue_script(
+				'twentytwentyfour-test1-faq-script',
+				get_theme_file_uri( 'assets/js/test1-faq.js' ),
+				array(),
+				(string) filemtime( $faq_js_file ),
+				true
+			);
+		}
+	}
+
 }
 add_action( 'wp_enqueue_scripts', 'twentytwentyfour_test1_assets', 100 );
 
@@ -345,7 +382,7 @@ add_action( 'wp_enqueue_scripts', 'twentytwentyfour_test1_assets', 100 );
  * @return void
  */
 function twentytwentyfour_test1_shared_shell_assets() {
-	if ( ! ( ( function_exists( 'is_checkout' ) && is_checkout() && ! is_order_received_page() ) || ( function_exists( 'is_cart' ) && is_cart() ) ) ) {
+	if ( ! ( ( function_exists( 'is_checkout' ) && is_checkout() && ! is_order_received_page() ) || ( function_exists( 'is_cart' ) && is_cart() ) || is_page( 'faq' ) ) ) {
 		return;
 	}
 

wp-content/themes/twentytwentyfour/page-faq.php

@@ -0,0 +1,107 @@
+<?php
+/**
+ * FAQ template with shared test1 header/footer.
+ *
+ * @package Twenty_Twenty_Four
+ */
+
+?><!DOCTYPE html>
+<html <?php language_attributes(); ?>>
+<head>
+	<meta charset="<?php bloginfo( 'charset' ); ?>">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<?php wp_head(); ?>
+</head>
+<body <?php body_class( 'test1-shared-shell test1-shared-faq-page' ); ?>>
+	<?php wp_body_open(); ?>
+	<?php
+	$test1_header_action_url   = function_exists( 'wc_get_cart_url' ) ? wc_get_cart_url() : home_url( '/cart/' );
+	$test1_header_action_label = __( 'Корзина', 'twentytwentyfour' );
+	$test1_header_mode         = 'link';
+	require get_theme_file_path( 'template-parts/test1-shared-header.php' );
+	?>
+
+	<main class="site-main" role="main">
+		<section class="section" id="faq">
+			<div class="container">
+				<div class="section-head">
+					<div>
+						<span class="eyebrow"><?php esc_html_e( 'FAQ', 'twentytwentyfour' ); ?></span>
+						<h1 class="section-title"><?php esc_html_e( 'Частые вопросы о доставке воды в Севастополе', 'twentytwentyfour' ); ?></h1>
+					</div>
+					<p class="section-copy"><?php esc_html_e( 'Собрали ответы на основные вопросы по доставке воды, оплате, таре и срокам, чтобы оформить заказ было проще и быстрее.', 'twentytwentyfour' ); ?></p>
+				</div>
+
+				<div class="faq-list">
+					<article class="faq-item reveal open">
+						<button class="faq-question" id="faq-question-1" aria-expanded="true" aria-controls="faq-answer-1">
+							<span><?php esc_html_e( 'Как быстро вы привозите воду по Севастополю?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-1" role="region" aria-labelledby="faq-question-1"><?php esc_html_e( 'Обычно доставка воды в Севастополе занимает от 2 до 4 часов в пределах активных маршрутов. При высокой загрузке мы предлагаем ближайший удобный интервал и обязательно подтверждаем его по телефону.', 'twentytwentyfour' ); ?></div>
+					</article>
+
+					<article class="faq-item reveal reveal-delay-1">
+						<button class="faq-question" id="faq-question-2" aria-expanded="false" aria-controls="faq-answer-2">
+							<span><?php esc_html_e( 'Какие способы оплаты доступны?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-2" role="region" aria-labelledby="faq-question-2" hidden><?php esc_html_e( 'Принимаем наличные, оплату картой при получении, перевод по номеру телефона и безналичный расчет для компаний. Для офисов можем выставить счет.', 'twentytwentyfour' ); ?></div>
+					</article>
+
+					<article class="faq-item reveal reveal-delay-2">
+						<button class="faq-question" id="faq-question-3" aria-expanded="false" aria-controls="faq-answer-3">
+							<span><?php esc_html_e( 'Нужен ли залог за бутыль 19 литров?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-3" role="region" aria-labelledby="faq-question-3" hidden><?php esc_html_e( 'Если у вас нет своей тары, при первом заказе может взиматься возвратный депозит за бутыль. При возврате тары депозит учитывается в следующих заказах.', 'twentytwentyfour' ); ?></div>
+					</article>
+
+					<article class="faq-item reveal reveal-delay-3">
+						<button class="faq-question" id="faq-question-4" aria-expanded="false" aria-controls="faq-answer-4">
+							<span><?php esc_html_e( 'Как часто лучше заказывать воду домой?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-4" role="region" aria-labelledby="faq-question-4" hidden><?php esc_html_e( 'Для семьи из 2-4 человек обычно достаточно заказа 2-4 бутылей 19 литров раз в 1-2 недели. Точный график зависит от потребления и наличия кулера.', 'twentytwentyfour' ); ?></div>
+					</article>
+
+					<article class="faq-item reveal">
+						<button class="faq-question" id="faq-question-5" aria-expanded="false" aria-controls="faq-answer-5">
+							<span><?php esc_html_e( 'Откуда поступает вода и как контролируется качество?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-5" role="region" aria-labelledby="faq-question-5" hidden><?php esc_html_e( 'Мы используем артезианскую воду из защищенного источника, проводим фильтрацию, санитарную обработку тары и регулярный лабораторный контроль. По запросу предоставляем информацию о сертификатах качества.', 'twentytwentyfour' ); ?></div>
+					</article>
+
+					<article class="faq-item reveal reveal-delay-1">
+						<button class="faq-question" id="faq-question-6" aria-expanded="false" aria-controls="faq-answer-6">
+							<span><?php esc_html_e( 'Можно ли оформить доставку воды в офис?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-6" role="region" aria-labelledby="faq-question-6" hidden><?php esc_html_e( 'Да, мы регулярно обслуживаем офисы, кафе, фитнес-клубы, студии и медицинские кабинеты. Настраиваем график, безнал и объем под ваш режим работы.', 'twentytwentyfour' ); ?></div>
+					</article>
+
+					<article class="faq-item reveal reveal-delay-2">
+						<button class="faq-question" id="faq-question-7" aria-expanded="false" aria-controls="faq-answer-7">
+							<span><?php esc_html_e( 'Какой минимальный заказ действует для доставки?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-7" role="region" aria-labelledby="faq-question-7" hidden><?php esc_html_e( 'Для воды 19 литров можно заказать от одной бутыли. Для небольших упаковок минимальная сумма заказа составляет 500 ₽, чтобы доставка оставалась быстрой и выгодной.', 'twentytwentyfour' ); ?></div>
+					</article>
+
+					<article class="faq-item reveal reveal-delay-3">
+						<button class="faq-question" id="faq-question-8" aria-expanded="false" aria-controls="faq-answer-8">
+							<span><?php esc_html_e( 'Что делать с пустыми бутылками после использования?', 'twentytwentyfour' ); ?></span>
+							<span aria-hidden="true">+</span>
+						</button>
+						<div class="faq-answer" id="faq-answer-8" role="region" aria-labelledby="faq-question-8" hidden><?php esc_html_e( 'Сохраните пустые бутыли до следующего визита курьера. Мы заберем их при следующей доставке или согласуем отдельный выезд при крупном заказе.', 'twentytwentyfour' ); ?></div>
+					</article>
+				</div>
+			</div>
+		</section>
+	</main>
+
+	<?php require get_theme_file_path( 'template-parts/test1-shared-footer.php' ); ?>
+	<?php wp_footer(); ?>
+</body>
+</html>