Refactor WooCommerce product loop templates to support AJAX quick add-to-cart, wishlist functionality, and improved visual badges. Added new static pages for About and Contact. - Refactor `content-product.php` to include quick actions and discount badges - Update `archive-product.php` and `front-page.php` for improved product display - Add `motayeb_get_rating_html` helper function in `functions.php` - Add `page-about.php` and `page-contact.php` - Fix product card width issues in `header.php` - Implement dynamic banner option in `front-page.php`
95 lines
5.7 KiB
PHP
95 lines
5.7 KiB
PHP
<?php
|
|
/**
|
|
* قالب صفحه درباره ما (About)
|
|
*
|
|
* @package Motayeb
|
|
*/
|
|
|
|
get_header();
|
|
?>
|
|
|
|
<!-- ===== BRAND STORY SECTION ===== -->
|
|
<section class="py-16 md:py-24 bg-cream-100 dark:bg-dark-bg relative overflow-hidden leaf-pattern">
|
|
<div class="max-w-7xl mx-auto px-4 md:px-6">
|
|
<div class="grid md:grid-cols-2 gap-12 items-center">
|
|
<!-- بخش تصویر (ثابت) -->
|
|
<div class="relative">
|
|
<div class="rounded-3xl overflow-hidden shadow-xl">
|
|
<img src="https://picsum.photos/seed/organic-farm-nature/600/500.jpg" alt="مزرعه ارگانیک" class="w-full h-[350px] md:h-[450px] object-cover">
|
|
</div>
|
|
<div class="absolute -bottom-6 -left-6 bg-white dark:bg-dark-card rounded-2xl p-5 shadow-xl max-w-[200px]">
|
|
<div class="text-3xl font-extrabold text-forest-500 dark:text-forest-300">+۱۲</div>
|
|
<div class="text-sm text-earth-400 dark:text-dark-text font-medium">سال تجربه</div>
|
|
<div class="text-xs text-cream-500 dark:text-dark-muted mt-1">در تولید محصولات ارگانیک</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- بخش محتوای متنی (دینامیک، قابل ویرایش با گوتنبرگ) -->
|
|
<div>
|
|
<span class="text-xs font-medium text-honey-400 tracking-wider font-inter">OUR STORY</span>
|
|
<div class="mt-2 mb-6">
|
|
<?php the_content(); ?>
|
|
</div>
|
|
|
|
<!-- بخش ویژگیها (ثابت) -->
|
|
<div class="grid grid-cols-2 gap-4 mb-8">
|
|
<div class="flex items-start gap-3">
|
|
<div class="w-10 h-10 bg-forest-50 dark:bg-forest-900/30 rounded-xl flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
<iconify-icon icon="lucide:sprout" width="20" class="text-forest-500 dark:text-forest-300"></iconify-icon>
|
|
</div>
|
|
<div>
|
|
<div class="font-bold text-sm mb-0.5">کشت ارگانیک</div>
|
|
<div class="text-xs text-cream-500 dark:text-dark-muted">بدون سم و کود شیمیایی</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-start gap-3">
|
|
<div class="w-10 h-10 bg-honey-50 dark:bg-honey-900/30 rounded-xl flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
<iconify-icon icon="lucide:shield-check" width="20" class="text-honey-400"></iconify-icon>
|
|
</div>
|
|
<div>
|
|
<div class="font-bold text-sm mb-0.5">تضمین اصالت</div>
|
|
<div class="text-xs text-cream-500 dark:text-dark-muted">آزمایشگاهی و مستند</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-start gap-3">
|
|
<div class="w-10 h-10 bg-emerald-50 dark:bg-emerald-900/30 rounded-xl flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
<iconify-icon icon="lucide:recycle" width="20" class="text-emerald-500"></iconify-icon>
|
|
</div>
|
|
<div>
|
|
<div class="font-bold text-sm mb-0.5">بستهبندی سبز</div>
|
|
<div class="text-xs text-cream-500 dark:text-dark-muted">دوستدار محیط زیست</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-start gap-3">
|
|
<div class="w-10 h-10 bg-blue-50 dark:bg-blue-900/30 rounded-xl flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
<iconify-icon icon="lucide:map-pin" width="20" class="text-blue-500"></iconify-icon>
|
|
</div>
|
|
<div>
|
|
<div class="font-bold text-sm mb-0.5">تأمین محلی</div>
|
|
<div class="text-xs text-cream-500 dark:text-dark-muted">حمایت از کشاورز ایرانی</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- برچسبهای گواهی (ثابت) -->
|
|
<div class="flex items-center gap-3 flex-wrap">
|
|
<div class="flex items-center gap-2 px-3 py-2 bg-white dark:bg-dark-card rounded-xl border border-cream-200 dark:border-dark-border text-xs">
|
|
<iconify-icon icon="lucide:badge-check" width="16" class="text-forest-500 dark:text-forest-300"></iconify-icon>
|
|
<span>گواهی ارگانیک ایران</span>
|
|
</div>
|
|
<div class="flex items-center gap-2 px-3 py-2 bg-white dark:bg-dark-card rounded-xl border border-cream-200 dark:border-dark-border text-xs">
|
|
<iconify-icon icon="lucide:badge-check" width="16" class="text-forest-500 dark:text-forest-300"></iconify-icon>
|
|
<span>استاندارد ملی بهداشت</span>
|
|
</div>
|
|
<div class="flex items-center gap-2 px-3 py-2 bg-white dark:bg-dark-card rounded-xl border border-cream-200 dark:border-dark-border text-xs">
|
|
<iconify-icon icon="lucide:badge-check" width="16" class="text-forest-500 dark:text-forest-300"></iconify-icon>
|
|
<span>نماد اعتماد الکترونیکی</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<?php
|
|
get_footer();
|