28501fec7c
Replace Shopify Buy Button iframe with custom implementation using Storefront API 2026-01. Create interactive cart drawer with full product management capabilities (add, remove, update quantities) and seamless checkout flow. Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
60 lines
2.2 KiB
PHP
60 lines
2.2 KiB
PHP
<?php snippet('header', ['title' => $page->title(), 'template' => 'shop']) ?>
|
|
|
|
<main>
|
|
<nav class="store__nav">
|
|
<a href="<?= $site->homePage()->url() ?>"><?= t('backToShop', 'Retour à la boutique') ?></a>
|
|
</nav>
|
|
|
|
<section class="section__product">
|
|
<div class="col-left">
|
|
<div class="hero">
|
|
<h2 class="p__baseline-big"><?= $page->title()->html() ?></h2>
|
|
<p class="p__baseline-big"><?= $page->price() ?>€</p>
|
|
</div>
|
|
|
|
<div class="details">
|
|
<?php if($page->details()->isNotEmpty()): ?>
|
|
<?= $page->details()->kt() ?>
|
|
<?php endif ?>
|
|
</div>
|
|
|
|
<?php snippet('buy-button--t-shirt') ?>
|
|
</div>
|
|
|
|
<div class="product-gallery swiper">
|
|
<div class="swiper-wrapper">
|
|
<?php
|
|
if ($page->hasFiles()):
|
|
foreach($page->files()->sortBy('sort', 'asc') as $image):
|
|
?>
|
|
<div class="swiper-slide">
|
|
<figure>
|
|
<?php snippet('picture', [
|
|
'file' => $image,
|
|
'alt' => $page->title()->html(),
|
|
'preset' => 'product-detail',
|
|
'size' => 50,
|
|
'lazy' => false
|
|
]) ?>
|
|
</figure>
|
|
</div>
|
|
<?php
|
|
endforeach;
|
|
endif;
|
|
?>
|
|
</div>
|
|
|
|
<!-- Navigation arrows -->
|
|
<div class="swiper-button-prev"></div>
|
|
<div class="swiper-button-next"></div>
|
|
|
|
<!-- Pagination dots -->
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<?php snippet('footer', ['scripts' => [
|
|
'assets/js/product-add-to-cart.js',
|
|
'assets/js/product-gallery.js'
|
|
]]) ?>
|