vargha/hoponhopofftickets
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(theme): About, Contact, FAQ, blog list and post pages from new front

Browse Source 
- Route pages by address to theme templates (about-us, contact-us, faq, blogs, posts)
- Scoped design CSS (pages.css) + Astra/WordPress fixes (pages-wp.css), page JS
- Contact form emails the new Settings -> Viator Collector -> Contact email
  (fallback: admin email), Reply-To the visitor, honeypot spam trap
- Blog list shows real posts with search, sort and paging; posts use the
  article design with comments as reviews and related articles
- Design images converted to WebP (~15MB PNG -> ~1MB)
- Theme 1.0.10, plugin 1.9.1

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Amir Bagheri
2026-10-29 16:20:11 +03:30
parent 930b7e0534
commit f58ed49d07
30 changed files with 5932 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

304
astra-child-hoponhopoff/templates/faq.php Normal file
View File

@@ -0,0 +1,304 @@
<?php
/**
* FAQ page — markup from "new front/faq.html" (fixed copy).
* Routed by hoho_page_template() in inc/pages.php.
*/
defined( 'ABSPATH' ) || exit;
get_header();
?>
<main id="main" class="hoho-page">
<section class="hero hero--page hero--faq">
<div class="hero__media">
<img class="hero__img" src="<?php echo esc_url( hoho_asset( 'img/faq-hero.webp' ) ); ?>" alt="" fetchpriority="high" />
</div>
<div class="container hero__content">
<nav class="crumbs" aria-label="Breadcrumb">
<ol class="crumbs__list">
<li><a href="<?php echo esc_url( home_url( '/' ) ); ?>">Home</a></li>
<li aria-current="page">FAQ&rsquo;s</li>
</ol>
</nav>
<h1 class="hero__title">FAQ&rsquo;s</h1>
</div>
</section>
<div class="section pagebody faqpage">
<div class="container faqpage__layout">
<aside class="catnav" aria-label="FAQ categories">
<p class="catnav__title"><svg class="icon" aria-hidden="true"><use href="#i-grid" /></svg>Categorize</p>
<ul class="catnav__list">
<li><a class="catnav__link is-active" href="#faq-general" aria-current="true"><span>General</span><svg class="icon" aria-hidden="true"><use href="#i-chev-right" /></svg></a></li>
<li><a class="catnav__link" href="#faq-tours"><span>Tours</span><svg class="icon" aria-hidden="true"><use href="#i-chev-right" /></svg></a></li>
<li><a class="catnav__link" href="#faq-accounts"><span>Accounts</span><svg class="icon" aria-hidden="true"><use href="#i-chev-right" /></svg></a></li>
<li><a class="catnav__link" href="#faq-other"><span>Other</span><svg class="icon" aria-hidden="true"><use href="#i-chev-right" /></svg></a></li>
</ul>
</aside>
<div class="faqpage__main">
<section class="faqcard" id="faq-general" aria-labelledby="faq-general-t">
<h2 class="faqcard__title" id="faq-general-t">General</h2>
<div class="accordion" data-accordion>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="true">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
</div>
</section>
<section class="faqcard" id="faq-tours" aria-labelledby="faq-tours-t">
<h2 class="faqcard__title" id="faq-tours-t">Tours</h2>
<div class="accordion" data-accordion>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="true">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
</div>
</section>
<section class="faqcard" id="faq-accounts" aria-labelledby="faq-accounts-t">
<h2 class="faqcard__title" id="faq-accounts-t">Accounts</h2>
<div class="accordion" data-accordion>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="true">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
</div>
</section>
<section class="faqcard" id="faq-other" aria-labelledby="faq-other-t">
<h2 class="faqcard__title" id="faq-other-t">Other</h2>
<div class="accordion" data-accordion>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="true">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>How can i book a tour ?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
<div class="acc">
<h3>
<button class="acc__q" type="button" aria-expanded="false">
<span>is the booking process, full online?</span>
<svg class="icon icon--14 acc__plus" aria-hidden="true"><use href="#i-plus" /></svg>
<svg class="icon icon--14 acc__minus" aria-hidden="true"><use href="#i-minus" /></svg>
</button>
</h3>
<div class="acc__a">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut laboreLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</p>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
</main>
<?php
get_footer();