gitmodir110/motayeb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

build(theme): scaffold initial theme directory structure and assets

Browse Source 
Initialize the base WordPress theme files, including core template
hierarchy (index, page, single, archive, 404), WooCommerce template
overrides, and essential asset directories.
This commit is contained in:
Kazem Alghasi 2026-08-15 22:11:08 +03:30
commit f408faac54
22 changed files with 4817 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
404.php Normal file
View File

@ -0,0 +1,25 @@
<?php
get_header();
// 404 Error Page
echo '<div class="error-404 not-found">
<div class="page-content">
<h1 class="page-title">404 - صفحه مورد نظر یافت نشد</h1>
<p>متأسفانه صفحه‌ای که به دنبال آن بودید یافت نشد. لطفاً چک کنید که آدرس درست باشد یا به صفحه اصلی بروید.</p>
<div class="search-form">
<form role="search" method="get" class="search-form" action="' . esc_url(home_url('/')) . '">
<label>
<span class="screen-reader-text">جستجو:</span>
<input type="search" class="search-field" placeholder="جستجو..." value="" name="s" title="جستجو:">
</label>
<input type="submit" class="search-submit" value="جستجو">
</form>
</div>
<div class="back-to-home">
<a href="' . esc_url(home_url('/')) . '" class="button">بازگشت به صفحه اصلی</a>
</div>
</div>
</div>';
get_footer();
?>

192
archive-product.php Normal file
View File

@ -0,0 +1,192 @@
<?php
/**
* آرشیو محصولات - فروشگاه و دسته‌بندی‌های مطیب
*/
get_header();
// دریافت نام دسته‌بندی فعلی (اگر روی یک دسته‌بندی هستیم)
$current_term = get_queried_object();
$page_title = $current_term && isset($current_term->name) ? $current_term->name : 'فروشگاه';
?>
<main class="pt-16 md:pt-[104px]">
<!-- هدر صفحه -->
<div class="bg-forest-500 dark:bg-forest-800 text-white py-10 md:py-16">
<div class="max-w-7xl mx-auto px-4 md:px-6 text-center">
<h1 class="text-3xl md:text-4xl font-extrabold mb-2"><?php echo esc_html($page_title); ?></h1>
<p class="text-white/70 text-sm flex items-center justify-center gap-2">
<a href="<?php echo home_url(); ?>" class="hover:text-white transition">خانه</a>
<iconify-icon icon="lucide:chevron-left" width="14"></iconify-icon>
<span><?php echo esc_html($page_title); ?></span>
</p>
</div>
</div>
<div class="max-w-7xl mx-auto px-4 md:px-6 py-8 md:py-12">
<div class="flex gap-8">
<!-- ===== سایدبار فیلترها (دسکتاپ) ===== -->
<aside class="hidden lg:block w-64 flex-shrink-0">
<div class="sticky top-32 space-y-6">
<!-- فیلتر دسته‌بندی -->
<div class="bg-white dark:bg-dark-card rounded-2xl p-5 border border-cream-200/50 dark:border-dark-border/50">
<h3 class="font-bold text-lg mb-4 flex items-center gap-2">
<iconify-icon icon="lucide:grid-3x3" width="20" class="text-forest-500 dark:text-forest-300"></iconify-icon>
دسته‌بندی‌ها
</h3>
<ul class="space-y-2">
<?php
$terms = get_terms( array( 'taxonomy' => 'product_cat', 'hide_empty' => true, 'parent' => 0 ) );
if ( ! is_wp_error( $terms ) ) :
$current_term_id = isset($current_term->term_id) ? $current_term->term_id : 0;
foreach ( $terms as $term ) :?>
<li>
<a href="<?php echo get_term_link( $term ); ?>" class="flex items-center justify-between py-2 px-3 rounded-xl text-sm transition <?php echo ($current_term_id == $term->term_id) ? 'bg-forest-50 dark:bg-forest-900/30 text-forest-500 dark:text-forest-300 font-bold' : 'hover:bg-cream-50 dark:hover:bg-dark-bg text-earth-400 dark:text-dark-text'; ?>">
<span><?php echo esc_html( $term->name ); ?></span>
<span class="text-xs text-cream-400 dark:text-dark-muted bg-cream-100 dark:bg-dark-bg px-2 py-0.5 rounded-full"><?php echo $term->count; ?></span>
</a>
</li>
<?php endforeach;
endif; ?>
<li><a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="flex items-center gap-2 py-2 px-3 rounded-xl text-sm text-honey-400 font-medium hover:bg-honey-50 dark:hover:bg-honey-900/20 transition">
<iconify-icon icon="lucide:x-circle" width="16"></iconify-icon> حذف فیلترها
</a></li>
</ul>
</div>
<!-- فیلتر قیمت (فرم استاندارد ووکامرس) -->
<div class="bg-white dark:bg-dark-card rounded-2xl p-5 border border-cream-200/50 dark:border-dark-border/50">
<h3 class="font-bold text-lg mb-4 flex items-center gap-2">
<iconify-icon icon="lucide:sliders-horizontal" width="20" class="text-forest-500 dark:text-forest-300"></iconify-icon>
فیلتر قیمت
</h3>
<form method="get" class="space-y-4">
<?php
// نگه داشتن پارامترهای فعلی (مثل دسته‌بندی)
foreach ( $_GET as $key => $value ) {
if ( $key !== 'min_price' && $key !== 'max_price' ) {
echo '<input type="hidden" name="' . esc_attr( $key ) . '" value="' . esc_attr( $value ) . '" />';
}
}
?>
<div class="flex items-center gap-2">
<input type="number" name="min_price" id="min_price" placeholder="از" value="<?php echo isset( $_GET['min_price'] ) ? esc_attr( $_GET['min_price'] ) : ''; ?>" min="0" class="w-full px-3 py-2.5 bg-cream-50 dark:bg-dark-bg border border-cream-200 dark:border-dark-border rounded-xl text-sm text-center outline-none focus:border-forest-500 transition" dir="ltr">
<span class="text-cream-400">-</span>
<input type="number" name="max_price" id="max_price" placeholder="تا" value="<?php echo isset( $_GET['max_price'] ) ? esc_attr( $_GET['max_price'] ) : ''; ?>" min="0" class="w-full px-3 py-2.5 bg-cream-50 dark:bg-dark-bg border border-cream-200 dark:border-dark-border rounded-xl text-sm text-center outline-none focus:border-forest-500 transition" dir="ltr">
</div>
<button type="submit" class="w-full py-2.5 bg-forest-500 text-white rounded-xl text-sm font-bold hover:bg-forest-600 transition">اعمال فیلتر</button>
</form>
</div>
<!-- بنر کناری -->
<div class="rounded-2xl overflow-hidden relative h-48 bg-forest-600">
<img src="https://picsum.photos/seed/organic-nature-banner/400/300.jpg" class="w-full h-full object-cover opacity-40" alt="banner">
<div class="absolute inset-0 flex flex-col items-center justify-center text-white p-4 text-center">
<iconify-icon icon="lucide:leaf" width="28" class="mb-2 text-honey-300"></iconify-icon>
<span class="font-bold text-sm">تضمین اصالت</span>
<span class="text-xs text-white/80 mt-1">۱۰۰٪ ارگانیک</span>
</div>
</div>
</div>
</aside>
<!-- ===== محتوای اصلی (محصولات) ===== -->
<div class="flex-1 min-w-0">
<!-- نوار ابزار بالا (مرتب‌سازی و دکمه فیلتر موبایل) -->
<div class="flex items-center justify-between bg-white dark:bg-dark-card rounded-2xl p-4 mb-6 border border-cream-200/50 dark:border-dark-border/50">
<!-- دکمه فیلتر موبایل -->
<button onclick="document.getElementById('filter-drawer').classList.remove('hidden'); document.body.style.overflow='hidden';" class="lg:hidden flex items-center gap-2 px-4 py-2 bg-cream-50 dark:bg-dark-bg rounded-xl text-sm font-medium">
<iconify-icon icon="lucide:sliders-horizontal" width="18"></iconify-icon>
فیلترها
</button>
<!-- تعداد نتایج -->
<div class="text-sm text-cream-500 dark:text-dark-muted hidden md:block">
<?php woocommerce_result_count(); ?>
</div>
<!-- مرتب‌سازی -->
<form class="flex items-center gap-2" method="get">
<?php foreach ( $_GET as $key => $value ) {
if ( $key !== 'orderby' ) {
echo '<input type="hidden" name="' . esc_attr( $key ) . '" value="' . esc_attr( $value ) . '" />';
}
}?>
<select name="orderby" id="orderby" class="appearance-none bg-cream-50 dark:bg-dark-bg border border-cream-200 dark:border-dark-border rounded-xl px-4 py-2 text-sm outline-none focus:border-forest-500 transition cursor-pointer pr-8" onchange="this.form.submit()">
<?php
$orderby = isset( $_GET['orderby'] ) ? esc_attr( $_GET['orderby'] ) : wc_get_default_products_orderby();
$catalog_orderby = apply_filters( 'woocommerce_catalog_orderby', array(
'popularity' => 'پرفروش‌ترین‌ها',
'rating' => 'محبوب‌ترین‌ها',
'date' => 'جدیدترین‌ها',
'price' => 'ارزان‌ترین',
'price-desc' => 'گران‌ترین',
) );
foreach ( $catalog_orderby as $id => $name ) :
echo '<option value="' . esc_attr( $id ) . '"' . selected( $orderby, $id, false ) . '>' . esc_html( $name ) . '</option>';
endforeach;
?>
</select>
</form>
</div>
<!-- حلقه محصولات ووکامرس -->
<?php if ( woocommerce_product_loop() ) : ?>
<div class="grid grid-cols-2 md:grid-cols-3 gap-4 md:gap-6">
<?php
// ردیف‌بندی با کلاس‌های خودمون (تعداد ستون‌ها رو تسک می‌گیریم)
$columns = 4; // در دسکتاپ 4 تاست ولی چون سایدبار داریم 3 تا میشه
woocommerce_product_loop_start();
if ( wc_get_loop_prop( 'total' ) ) {
while ( have_posts() ) {
the_post();
do_action( 'woocommerce_shop_loop' );
wc_get_template_part( 'content', 'product' );
}
}
woocommerce_product_loop_end();
?>
</div>
<!-- صفحه‌بندی (Pagination) -->
<div class="mt-10 flex justify-center">
<?php woocommerce_pagination(); ?>
</div>
<?php else : ?>
<!-- اگر محصولی پیدا نشد -->
<div class="text-center py-20">
<iconify-icon icon="lucide:search-x" width="64" class="text-cream-300 dark:text-dark-muted mb-4"></iconify-icon>
<h3 class="text-xl font-bold mb-2">محصولی یافت نشد</h3>
<p class="text-cream-500 dark:text-dark-muted mb-6">متأسفانه محصولی با این مشخصات پیدا نشد.</p>
<a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="inline-flex items-center gap-2 px-6 py-2.5 bg-forest-500 text-white rounded-xl font-semibold hover:bg-forest-600 transition">
<iconify-icon icon="lucide:grid-3x3" width="18"></iconify-icon>
مشاهده همه محصولات
</a>
</div>
<?php endif; ?>
</div>
</div>
</div>
</main>
<!-- ===== دراور فیلتر موبایل ===== -->
<div id="filter-drawer" class="fixed inset-0 z-[80] hidden">
<div class="absolute inset-0 bg-black/50" onclick="this.parentElement.classList.add('hidden'); document.body.style.overflow='';"></div>
<div class="absolute top-0 right-0 bottom-0 w-80 max-w-[85vw] bg-cream-100 dark:bg-dark-bg shadow-2xl overflow-y-auto p-6">
<div class="flex items-center justify-between mb-6">
<h3 class="font-bold text-lg">فیلترها</h3>
<button onclick="this.closest('#filter-drawer').classList.add('hidden'); document.body.style.overflow='';" class="w-8 h-8 flex items-center justify-center rounded-full hover:bg-cream-200 dark:hover:bg-dark-card">
<iconify-icon icon="lucide:x" width="20"></iconify-icon>
</button>
</div>
<!-- همون فیلترهای سایدبار اینجا هم تکرار میشن براحتی میتونی کپی کنی -->
<p class="text-sm text-cream-500 dark:text-dark-muted text-center py-10">فیلترهای دلخواه خود را انتخاب کنید</p>
</div>
</div>
<?php get_footer(); ?>

108
archive.php Normal file
View File

@ -0,0 +1,108 @@
<?php
/**
* لیست مقالات و دسته‌بندی‌های بلاگ
*/
get_header();
?>
<main class="pt-16 md:pt-[104px]">
<!-- هدر بخش -->
<div class="bg-forest-500 dark:bg-forest-800 text-white py-10 md:py-16">
<div class="max-w-7xl mx-auto px-4 md:px-6 text-center">
<h1 class="text-3xl md:text-4xl font-extrabold mb-2">
<?php if ( is_category() ) { single_cat_title(); }
elseif ( is_tag() ) { single_tag_title(); }
elseif ( is_search() ) { printf( __( 'نتایج جستجو برای: %s', 'motayeb' ), '<span>' . get_search_query() . '</span>' ); }
else { _e( 'مجله سلامت مطیب', 'motayeb' ); } ?>
</h1>
<p class="text-white/70 text-sm flex items-center justify-center gap-2 mt-3">
<a href="<?php echo home_url(); ?>" class="hover:text-white transition">خانه</a>
<iconify-icon icon="lucide:chevron-left" width="14"></iconify-icon>
<span>مجله</span>
</p>
</div>
</div>
<div class="max-w-7xl mx-auto px-4 md:px-6 py-12 md:py-16">
<?php if ( have_posts() ) : ?>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
<?php while ( have_posts() ) : the_post(); ?>
<article class="group bg-white dark:bg-dark-card rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-cream-200/50 dark:border-dark-border/50">
<!-- عکس مقاله -->
<a href="<?php the_permalink(); ?>" class="block overflow-hidden h-56">
<?php if ( has_post_thumbnail() ) : ?>
<?php the_post_thumbnail( 'medium_large', array( 'class' => 'w-full h-full object-cover group-hover:scale-105 transition-transform duration-500' ) ); ?>
<?php else : ?>
<div class="w-full h-full bg-cream-100 dark:bg-dark-bg flex items-center justify-center">
<iconify-icon icon="lucide:file-text" width="48" class="text-cream-300 dark:text-dark-muted"></iconify-icon>
</div>
<?php endif; ?>
</a>
<!-- محتوای مقاله -->
<div class="p-6">
<!-- دسته بندی -->
<div class="mb-3">
<?php
$categories = get_the_category();
if ( ! empty( $categories ) ) {
echo '<a href="' . esc_url( get_category_link( $categories[0]->term_id ) ) . '" class="inline-flex items-center gap-1.5 px-3 py-1 bg-forest-50 dark:bg-forest-900/30 text-forest-500 dark:text-forest-300 rounded-full text-xs font-semibold hover:bg-forest-100 dark:hover:bg-forest-900/50 transition">';
echo esc_html( $categories[0]->name );
echo '</a>';
}
?>
</div>
<!-- عنوان -->
<a href="<?php the_permalink(); ?>" class="block font-bold text-lg mb-3 group-hover:text-forest-500 dark:group-hover:text-forest-300 transition line-clamp-2 leading-relaxed">
<?php the_title(); ?>
</a>
<!-- چکیده -->
<p class="text-sm text-cream-500 dark:text-dark-muted leading-relaxed line-clamp-2 mb-5">
<?php echo get_the_excerpt(); ?>
</p>
<!-- پایین مقاله -->
<div class="flex items-center justify-between pt-5 border-t border-cream-100 dark:border-dark-border">
<div class="flex items-center gap-2 text-xs text-cream-400 dark:text-dark-muted">
<iconify-icon icon="lucide:calendar" width="14"></iconify-icon>
<span><?php echo get_the_date('Y/m/d'); ?></span>
</div>
<a href="<?php the_permalink(); ?>" class="flex items-center gap-1 text-xs font-bold text-forest-500 dark:text-forest-300 hover:gap-2 transition-all">
<span>ادامه مطلب</span>
<iconify-icon icon="lucide:arrow-left" width="14"></iconify-icon>
</a>
</div>
</div>
</article>
<?php endwhile; ?>
</div>
<!-- صفحه بندی -->
<div class="mt-12 flex justify-center">
<?php
the_posts_pagination( array(
'mid_size' => 2,
'prev_text' => '<iconify-icon icon="lucide:arrow-right" width="18"></iconify-icon>',
'next_text' => '<iconify-icon icon="lucide:arrow-left" width="18"></iconify-icon>',
) );
?>
</div>
<?php else : ?>
<!-- حالت جستجوی ناموفق -->
<div class="text-center py-20">
<iconify-icon icon="lucide:search-x" width="64" class="text-cream-300 dark:text-dark-muted mb-4"></iconify-icon>
<h2 class="text-2xl font-extrabold mb-3">مقاله‌ای یافت نشد</h2>
<p class="text-cream-500 dark:text-dark-muted mb-6">متأسفانه موردی با این مشخصات پیدا نشد.</p>
<a href="<?php echo home_url(); ?>" class="inline-flex items-center gap-2 px-6 py-2.5 bg-forest-500 text-white rounded-xl font-semibold hover:bg-forest-600 transition">
<span>بازگشت به خانه</span>
</a>
</div>
<?php endif; ?>
</div>
</main>
<?php get_footer(); ?>

1224
assets/css/main.css Normal file
View File

File diff suppressed because it is too large Load Diff

319
assets/js/main.js Normal file
View File

@ -0,0 +1,319 @@
/**
* Motayeb Theme - Main JavaScript
* مدیریت تعاملات، حالت تاریک، اسکرول و انیمیشن‌ها
*/
document.addEventListener('DOMContentLoaded', function () {
const html = document.documentElement;
const body = document.body;
const header = document.getElementById('header');
// ==========================================
// ۱. مدیریت حالت تاریک (Dark Mode)
// ==========================================
function initDarkMode() {
// بررسی تنظیمات ذخیره شده یا تنظیمات سیستم عامل
const savedTheme = localStorage.getItem('motayeb-theme');
if (savedTheme === 'dark') {
html.classList.add('dark');
}
// اتصال رویداد به دکمه تغییر تم
const darkBtn = header ? header.querySelector('button[aria-label="حالت تاریک"]') : null;
if (darkBtn) {
darkBtn.addEventListener('click', function () {
html.classList.toggle('dark');
const isDark = html.classList.contains('dark');
localStorage.setItem('motayeb-theme', isDark ? 'dark' : 'light');
});
}
}
// ==========================================
// ۲. سایه هدر هنگام اسکرول
// ==========================================
function initHeaderScroll() {
if (!header) return;
window.addEventListener('scroll', function () {
if (window.scrollY > 50) {
header.classList.add('shadow-lg');
} else {
header.classList.remove('shadow-lg');
}
}, { passive: true });
}
// ==========================================
// ۳. مدیریت پنل جستجو
// ==========================================
function initSearchOverlay() {
const overlay = document.getElementById('search-overlay');
if (!overlay) return;
const input = overlay.querySelector('.search-field');
const openBtns = document.querySelectorAll('[aria-label="جستجو"]');
// باز کردن
openBtns.forEach(function (btn) {
btn.addEventListener('click', function () {
overlay.classList.remove('hidden');
body.style.overflow = 'hidden'; // قفل اسکرول
setTimeout(function () { if (input) input.focus(); }, 150);
});
});
// بستن با کلیک روی بک‌دراپ
overlay.addEventListener('click', function (e) {
if (e.target === overlay) {
closeSearch();
}
});
}
function closeSearch() {
const overlay = document.getElementById('search-overlay');
if (overlay) {
overlay.classList.add('hidden');
body.style.overflow = ''; // آزاد کردن اسکرول
}
}
// ==========================================
// ۴. مدیریت منوی موبایل
// ==========================================
function initMobileMenu() {
const menu = document.getElementById('mobile-menu');
if (!menu) return;
// پیدا کردن دکمه همبرگرری
const openBtn = header ? header.querySelector('button[aria-label="منوی موبایل"]') : null;
// پیدا کردن دکمه ضربدر داخل منو و بک‌دراپ
const closeBtn = menu.querySelector('button');
const backdrop = menu.querySelector('.absolute.inset-0');
if (openBtn) {
openBtn.addEventListener('click', function () {
menu.classList.remove('hidden');
body.style.overflow = 'hidden';
});
}
if (closeBtn) {
closeBtn.addEventListener('click', closeMobileMenu);
}
if (backdrop) {
backdrop.addEventListener('click', closeMobileMenu);
}
}
function closeMobileMenu() {
const menu = document.getElementById('mobile-menu');
if (menu) {
menu.classList.add('hidden');
body.style.overflow = '';
}
}
// ==========================================
// ۵. میانبرهای کیبورد
// ==========================================
function initKeyboardShortcuts() {
document.addEventListener('keydown', function (e) {
// بستن با Escape
if (e.key === 'Escape') {
closeSearch();
closeMobileMenu();
}
// باز کردن جستجو با Ctrl+K
if ((e.metaKey || e.ctrlKey) && e.key === 'k') {
e.preventDefault();
const overlay = document.getElementById('search-overlay');
if (overlay) {
overlay.classList.toggle('hidden');
if (!overlay.classList.contains('hidden')) {
body.style.overflow = 'hidden';
setTimeout(function () {
const input = overlay.querySelector('.search-field');
if (input) input.focus();
}, 150);
} else {
body.style.overflow = '';
}
}
}
});
}
// ==========================================
// ۶. اسکرول نرم برای لینک‌های #
// ==========================================
function initSmoothScroll() {
document.querySelectorAll('a[href^="#"]:not([href="#"])').forEach(function (anchor) {
anchor.addEventListener('click', function (e) {
const targetId = this.getAttribute('href');
const targetElement = document.querySelector(targetId);
if (targetElement) {
e.preventDefault();
closeMobileMenu(); // بستن منو اگر باز بود
const headerHeight = header ? header.offsetHeight : 0;
const elementPosition = targetElement.getBoundingClientRect().top + window.pageYOffset;
const offsetPosition = elementPosition - headerHeight - 20;
window.scrollTo({
top: offsetPosition,
behavior: 'smooth'
});
}
});
});
}
// ==========================================
// ۷. انیمیشن هنگام اسکرول (Scroll Reveal)
// ==========================================
function initScrollAnimations() {
const elements = document.querySelectorAll('.animate-slide-up, .animate-fade-in');
if (elements.length === 0) return;
// مخفی کردن اولیه
elements.forEach(function (el) {
el.style.opacity = '0';
el.style.transform = 'translateY(30px)';
el.style.transition = 'opacity 0.7s cubic-bezier(0.5, 0, 0, 1), transform 0.7s cubic-bezier(0.5, 0, 0, 1)';
});
const observer = new IntersectionObserver(function (entries) {
entries.forEach(function (entry) {
if (entry.isIntersecting) {
entry.target.style.opacity = '1';
entry.target.style.transform = 'translateY(0)';
observer.unobserve(entry.target); // توقف مشاهده پس از اجرا
}
});
}, {
threshold: 0.1,
rootMargin: '0px 0px -40px 0px'
});
elements.forEach(function (el) {
observer.observe(el);
});
}
// ==========================================
// ۸. سیستم توست (برای استفاده در ووکامرس بعداً)
// ==========================================
window.motayebToast = function (message, type) {
type = type || 'success';
// حذف توست قبلی اگر وجود داشت
const existingToast = document.querySelector('.motayeb-toast-notification');
if (existingToast) existingToast.remove();
var toast = document.createElement('div');
toast.className = 'motayeb-toast-notification fixed top-24 left-1/2 -translate-x-1/2 z-[100] px-6 py-3 rounded-2xl shadow-2xl text-sm font-semibold text-white flex items-center gap-2 transition-all duration-300';
// تنظیم رنگ و آیکون
if (type === 'success') {
toast.style.backgroundColor = '#2D5F3F';
toast.innerHTML = '<iconify-icon icon="lucide:check-circle" width="20"></iconify-icon> ' + message;
} else if (type === 'error') {
toast.style.backgroundColor = '#dc2626';
toast.innerHTML = '<iconify-icon icon="lucide:x-circle" width="20"></iconify-icon> ' + message;
} else {
toast.style.backgroundColor = '#8B5A3C';
toast.innerHTML = '<iconify-icon icon="lucide:info" width="20"></iconify-icon> ' + message;
}
// حالت اولیه (مخفی بالای صفحه)
toast.style.opacity = '0';
toast.style.transform = 'translate(-50%, -20px)';
body.appendChild(toast);
// انیمیشن ورود
requestAnimationFrame(function () {
toast.style.opacity = '1';
toast.style.transform = 'translate(-50%, 0)';
});
// حذف خودکار
setTimeout(function () {
toast.style.opacity = '0';
toast.style.transform = 'translate(-50%, -20px)';
setTimeout(function () { toast.remove(); }, 300);
}, 3000);
};
// ==========================================
// اجرای تمام توابع
// ==========================================
initDarkMode();
initHeaderScroll();
initSearchOverlay();
initMobileMenu();
initKeyboardShortcuts();
initSmoothScroll();
initScrollAnimations();
// ==========================================
// ۹. تعویض عکس در صفحه محصول
// ==========================================
window.changeProductImage = function (btn, imgUrl) {
// تغییر عکس اصلی
const mainImg = document.getElementById('main-product-image');
if (mainImg) {
mainImg.src = imgUrl;
mainImg.setAttribute('data-large_image', imgUrl);
}
// تغییر کلاس فعال تامبنیل‌ها
document.querySelectorAll('.gallery-thumb').forEach(function (thumb) {
thumb.classList.remove('active');
thumb.style.borderColor = '';
});
btn.classList.add('active');
};
// ==========================================
// ۱۰. ستاره‌های امتیازدهی سفارشی
// ==========================================
const starsContainer = document.getElementById('custom-star-rating');
const ratingInput = document.getElementById('rating');
if (starsContainer && ratingInput) {
const stars = starsContainer.querySelectorAll('.star');
stars.forEach(star => {
star.addEventListener('mouseenter', function() {
const val = this.dataset.value;
stars.forEach(s => {
s.style.color = s.dataset.value <= val ? '#D4A574' : '';
});
});
star.addEventListener('click', function() {
ratingInput.value = this.dataset.value;
stars.forEach(s => s.classList.remove('active'));
this.classList.add('active');
// رنگ دادن به همه ستاره‌های تا اون عدد
const val = this.dataset.value;
stars.forEach(s => {
if(s.dataset.value <= val) s.classList.add('active');
});
});
});
starsContainer.addEventListener('mouseleave', function() {
const currentVal = ratingInput.value;
stars.forEach(s => {
s.style.color = s.dataset.value <= currentVal ? '#D4A574' : '';
});
});
}
});

47
author.php Normal file
View File

@ -0,0 +1,47 @@
<?php
get_header();
// Check if user is logged in
if (is_user_logged_in()) {
$current_user = wp_get_current_user();
// Display user dashboard
echo '<div class="user-dashboard">
<h1>پنل کاربری</h1>
<p>خوش آمدید، ' . esc_html($current_user->display_name) . '</p>
<div class="user-info">
<p><strong>نام کاربری:</strong> ' . esc_html($current_user->user_login) . '</p>
<p><strong>ایمیل:</strong> ' . esc_html($current_user->user_email) . '</p>
<p><strong>نقش:</strong> ' . esc_html(implode(', ', $current_user->roles)) . '</p>
</div>
<div class="dashboard-links">
<a href="' . wp_logout_url() . '" class="logout">خروج</a>
<a href="' . get_edit_user_link() . '" class="edit-profile">ویرایش پروفایل</a>
</div>
</div>';
} else {
// Display login form
echo '<div class="user-login">
<h1>ورود به حساب کاربری</h1>
<form name="loginform" id="loginform" action="' . esc_url(site_url('wp-login.php', 'login_post')) . '" method="post">
<p class="username">
<label for="user_login">نام کاربری<br>
<input type="text" name="log" id="user_login" class="input" value="" size="20" autocapitalize="off" autocorrect="off" maxlength="60" required>
</label>
</p>
<p class="password">
<label for="user_pass">رمز عبور<br>
<input type="password" name="pwd" id="user_pass" class="input" value="" size="20" required>
</label>
</p>
<p class="submit">
<input type="submit" name="wp-submit" id="wp-submit" class="button button-primary button-large" value="ورود">
<input type="hidden" name="redirect_to" value="' . esc_url(add_query_arg('logged_in', 'true', home_url())) . '">
</p>
</form>
<p class="lost-password"><a href="' . esc_url(wp_lostpassword_url()) . '">رمز عبور خود را فراموش کرده‌اید؟</a></p>
</div>';
}
get_footer();
?>

9
comments.php Normal file
View File

@ -0,0 +1,9 @@
<?php
defined('ABSPATH') || exit;
if(post_password_required()) return;
wp_list_comments(array(
'style' => 'div',
'avatar_size' => 48,
'max_depth' => 3,
));
?>

95
footer.php Normal file
View File

@ -0,0 +1,95 @@
<!-- Mobile Bottom Nav -->
<nav class="md:hidden fixed bottom-0 left-0 right-0 z-50 bg-white/90 dark:bg-dark-card/90 backdrop-blur-xl border-t border-cream-200 dark:border-dark-border" style="padding-bottom: env(safe-area-inset-bottom, 0);">
<div class="flex items-center justify-around py-2">
<a href="<?php echo home_url(); ?>" class="flex flex-col items-center gap-0.5 px-3 py-1.5 text-forest-500 dark:text-forest-300">
<iconify-icon icon="lucide:home" width="22"></iconify-icon>
<span class="text-[10px] font-medium">خانه</span>
</a>
<a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="flex flex-col items-center gap-0.5 px-3 py-1.5 text-cream-500 dark:text-dark-muted">
<iconify-icon icon="lucide:grid-3x3" width="22"></iconify-icon>
<span class="text-[10px] font-medium">دسته‌بندی</span>
</a>
<a href="<?php echo get_permalink( wc_get_page_id( 'cart' ) ); ?>" class="relative flex flex-col items-center gap-0.5 px-3 py-1.5 text-cream-500 dark:text-dark-muted">
<iconify-icon icon="lucide:shopping-bag" width="22"></iconify-icon>
<span class="text-[10px] font-medium">سبد خرید</span>
<?php if ( WC()->cart->get_cart_contents_count() > 0 ) : ?>
<span class="absolute -top-0.5 right-1 w-4 h-4 bg-honey-400 text-white text-[9px] font-bold rounded-full flex items-center justify-center"><?php echo WC()->cart->get_cart_contents_count(); ?></span>
<?php endif; ?>
</a>
<a href="<?php echo wp_login_url(); ?>" class="flex flex-col items-center gap-0.5 px-3 py-1.5 text-cream-500 dark:text-dark-muted">
<iconify-icon icon="lucide:user" width="22"></iconify-icon>
<span class="text-[10px] font-medium">حساب من</span>
</a>
</div>
</nav>
<div class="md:hidden h-16"></div>
<footer class="bg-forest-500 dark:bg-forest-800 text-white">
<div class="max-w-7xl mx-auto px-4 md:px-6 py-16">
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-12">
<div class="col-span-2 md:col-span-1">
<div class="flex items-center gap-2.5 mb-5">
<div class="w-10 h-10 bg-white/10 rounded-2xl flex items-center justify-center">
<iconify-icon icon="lucide:leaf" width="20" class="text-honey-300"></iconify-icon>
</div>
<span class="font-extrabold text-xl">مطیب</span>
</div>
<p class="text-white/70 text-sm leading-relaxed mb-5">ارائه‌دهنده محصولات ارگانیک و طبیعی ایرانی با ضمانت اصالت و کیفیت.</p>
</div>
<div>
<h4 class="font-bold mb-5">دسترسی سریع</h4>
<?php
if ( has_nav_menu( 'footer' ) ) {
wp_nav_menu( array(
'theme_location' => 'footer',
'container' => false,
'items_wrap' => '<ul class="space-y-3 text-sm text-white/70">%3$s</ul>',
'depth' => 1,
) );
} else { ?>
<ul class="space-y-3 text-sm text-white/70">
<li><a href="<?php echo home_url(); ?>" class="hover:text-honey-300 transition">صفحه اصلی</a></li>
<li><a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="hover:text-honey-300 transition">فروشگاه</a></li>
</ul>
<?php } ?>
</div>
<div>
<h4 class="font-bold mb-5">خدمات مشتریان</h4>
<ul class="space-y-3 text-sm text-white/70">
<li><a href="#" class="hover:text-honey-300 transition">سوالات متداول</a></li>
<li><a href="#" class="hover:text-honey-300 transition">شرایط بازگشت</a></li>
<li><a href="#" class="hover:text-honey-300 transition">نحوه ارسال</a></li>
</ul>
</div>
<?php if ( is_active_sidebar( 'footer-contact' ) ) : ?>
<div>
<?php dynamic_sidebar( 'footer-contact' ); ?>
</div>
<?php else: ?>
<div>
<h4 class="font-bold mb-5">تماس با ما</h4>
<ul class="space-y-3 text-sm text-white/70">
<li>تهران، خیابان ولیعصر</li>
<li>۰۲۱-۱۲۳۴۵۶۷۸</li>
<li class="font-inter" dir="ltr">info@motayeb.ir</li>
</ul>
</div>
<?php endif; ?>
</div>
</div>
<div class="border-t border-white/10">
<div class="max-w-7xl mx-auto px-4 md:px-6 py-5 flex flex-col md:flex-row items-center justify-between gap-4">
<p class="text-xs text-white/50">© <?php echo date('Y'); ?> مطیب. تمامی حقوق محفوظ است.</p>
<div class="flex items-center gap-4">
<div class="flex items-center gap-2 px-3 py-1.5 bg-white/10 rounded-lg text-xs"><iconify-icon icon="lucide:shield-check" width="14" class="text-honey-300"></iconify-icon> نماد اعتماد</div>
</div>
</div>
</div>
</footer>
<?php wp_footer(); ?>
</body>
</html>

319
front-page.php Normal file
View File

@ -0,0 +1,319 @@
<?php
/**
* Template Name: صفحه اصلی مطیب
*/
get_header();
?>
<main class="pt-16 md:pt-[104px]">
<!-- ===== HERO ===== -->
<section class="relative overflow-hidden honeycomb-bg">
<div class="max-w-7xl mx-auto px-4 md:px-6 py-16 md:py-28">
<div class="grid md:grid-cols-2 gap-8 md:gap-12 items-center">
<div class="text-center md:text-right">
<div class="inline-flex items-center gap-2 px-4 py-1.5 bg-forest-50 dark:bg-forest-900/30 rounded-full mb-6">
<span class="w-2 h-2 bg-forest-500 rounded-full animate-pulse"></span>
<span class="text-xs font-medium text-forest-500 dark:text-forest-300">محصولات ۱۰۰٪ ارگانیک و طبیعی</span>
</div>
<h1 class="text-4xl md:text-6xl lg:text-7xl font-extrabold leading-[1.1] mb-6">
<?php
if ( function_exists('get_field') ) {
$hero_title = get_field('hero_title');
if ($hero_title) {
echo wp_kses_post($hero_title);
} else { ?>
<span class="text-earth-400 dark:text-dark-text">طعم</span>
<span class="text-forest-500 dark:text-forest-300"> واقعی</span>
<br>
<span class="text-honey-400">طبیعت</span>
<?php }
} else { ?>
<span class="text-earth-400 dark:text-dark-text">طعم</span>
<span class="text-forest-500 dark:text-forest-300"> واقعی</span>
<br>
<span class="text-honey-400">طبیعت</span>
<?php } ?>
</h1>
<p class="text-cream-500 dark:text-dark-muted text-base md:text-lg leading-relaxed mb-8 max-w-md mx-auto md:mx-0">
<?php echo function_exists('get_field') ? esc_html(get_field('hero_subtitle') ?: 'از عسل کوهستان تا ارده سنتی، هر محصول مطیب سفری به دل طبیعت ایران است.') : 'از عسل کوهستان تا ارده سنتی، هر محصول مطیب سفری به دل طبیعت ایران است.'; ?>
</p>
<div class="flex flex-col sm:flex-row gap-3 justify-center md:justify-start">
<a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="inline-flex items-center justify-center gap-2 px-8 py-3.5 bg-forest-500 text-white rounded-2xl font-semibold hover:bg-forest-600 hover:-translate-y-0.5 transition-all shadow-lg shadow-forest-500/25">
<span><?php echo esc_html(function_exists('get_field') ? (get_field('hero_btn_text') ?: 'مشاهده محصولات') : 'مشاهده محصولات'); ?></span>
<iconify-icon icon="lucide:arrow-left" width="18"></iconify-icon>
</a>
<a href="#brand-story" class="inline-flex items-center justify-center gap-2 px-8 py-3.5 bg-white/60 dark:bg-dark-card/60 border border-cream-200 dark:border-dark-border rounded-2xl font-semibold hover:bg-white dark:hover:bg-dark-card hover:-translate-y-0.5 transition-all backdrop-blur">
<span>داستان مطیب</span>
<iconify-icon icon="lucide:play-circle" width="18" class="text-honey-400"></iconify-icon>
</a>
</div>
<!-- Stats -->
<?php
if ( function_exists('get_field') ) {
$stats = get_field('stats');
if (is_array($stats) && count($stats) > 0): ?>
<div class="flex items-center gap-6 mt-10 justify-center md:justify-start">
<?php foreach($stats as $i => $stat): ?>
<div class="text-center">
<div class="text-2xl font-bold text-forest-500 dark:text-forest-300"><?php echo esc_html($stat['number']); ?></div>
<div class="text-xs text-cream-500 dark:text-dark-muted"><?php echo esc_html($stat['label']); ?></div>
</div>
<?php if($i < count($stats)-1) echo '<div class="w-px h-10 bg-cream-200 dark:bg-dark-border"></div>'; ?>
<?php endforeach; ?>
</div>
<?php endif;
} ?>
</div>
<!-- Hero Image -->
<div class="relative">
<?php
if ( function_exists('get_field') ) {
$hero_img = get_field('hero_image');
if (is_array($hero_img) && isset($hero_img['url'])): ?>
<div class="relative rounded-3xl overflow-hidden shadow-2xl shadow-forest-500/10">
<img src="<?php echo esc_url($hero_img['url']); ?>" alt="<?php echo esc_attr($hero_img['alt'] ?? ''); ?>" class="w-full h-[350px] md:h-[500px] object-cover">
<div class="absolute inset-0 bg-gradient-to-t from-forest-500/30 to-transparent"></div>
</div>
<?php else: ?>
<div class="relative rounded-3xl overflow-hidden shadow-2xl bg-cream-200 dark:bg-dark-card h-[350px] md:h-[500px] flex items-center justify-center">
<div class="text-center p-6">
<iconify-icon icon="lucide:image-plus" width="48" class="text-cream-400 dark:text-dark-muted mb-3"></iconify-icon>
<p class="text-sm text-cream-400 dark:text-dark-muted">لطفاً از تنظیمات صفحه، تصویر هیرو را آپلود کنید.</p>
</div>
</div>
<?php endif;
} else { ?>
<div class="relative rounded-3xl overflow-hidden shadow-2xl bg-cream-200 dark:bg-dark-card h-[350px] md:h-[500px] flex items-center justify-center">
<p class="text-sm text-cream-400">پلاگین ACF فعال نیست.</p>
</div>
<?php } ?>
<!-- Floating Card -->
<div class="absolute -bottom-4 -right-4 md:bottom-8 md:-right-8 bg-white dark:bg-dark-card rounded-2xl p-4 shadow-xl hidden md:block">
<div class="flex items-center gap-3">
<div class="w-12 h-12 bg-honey-50 dark:bg-honey-900/30 rounded-xl flex items-center justify-center">
<iconify-icon icon="lucide:award" width="24" class="text-honey-400"></iconify-icon>
</div>
<div>
<div class="font-bold text-sm">گواهی ارگانیک</div>
<div class="text-xs text-cream-500 dark:text-dark-muted">تأیید شده توسط سازمان غذا</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="absolute bottom-0 left-0 right-0">
<svg viewBox="0 0 1440 60" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-full"><path d="M0 60V30C240 0 480 0 720 30C960 60 1200 60 1440 30V60H0Z" class="fill-cream-100 dark:fill-dark-bg"/></svg>
</div>
</section>
<!-- ===== CATEGORIES ===== -->
<?php
if ( function_exists('get_field') ) {
$categories = get_field('home_categories');
if (is_array($categories) && count($categories) > 0): ?>
<section class="py-16 md:py-24 bg-cream-100 dark:bg-dark-bg">
<div class="max-w-7xl mx-auto px-4 md:px-6">
<div class="text-center mb-12">
<span class="text-xs font-medium text-honey-400 tracking-wider font-inter">CATEGORIES</span>
<h2 class="text-3xl md:text-4xl font-extrabold mt-2 mb-3">دسته‌بندی محصولات</h2>
<p class="text-cream-500 dark:text-dark-muted max-w-lg mx-auto">از عسل‌های کوهستان تا دمنوش‌های گیاهی، بهترین‌های طبیعت را کشف کنید</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4">
<?php foreach($categories as $cat):
$color_map = array('honey'=>'honey', 'forest'=>'forest', 'red'=>'red', 'emerald'=>'emerald', 'amber'=>'amber');
$c = $color_map[$cat['color']] ?? 'forest';
?>
<a href="<?php echo esc_url($cat['link']); ?>" class="group relative bg-white dark:bg-dark-card rounded-2xl p-6 text-center hover:-translate-y-1 transition-all shadow-sm hover:shadow-xl border border-cream-200/50 dark:border-dark-border/50">
<div class="w-16 h-16 mx-auto mb-4 bg-<?php echo $c; ?>-50 dark:bg-<?php echo $c; ?>-900/20 rounded-2xl flex items-center justify-center group-hover:scale-110 transition-transform">
<iconify-icon icon="<?php echo esc_attr($cat['icon']); ?>" width="32" class="text-<?php echo $c; ?>-500 dark:text-<?php echo $c; ?>-300"></iconify-icon>
</div>
<h3 class="font-bold text-sm mb-1"><?php echo esc_html($cat['title']); ?></h3>
<span class="text-xs text-cream-500 dark:text-dark-muted"><?php echo esc_html($cat['count']); ?></span>
</a>
<?php endforeach; ?>
</div>
</div>
</section>
<?php endif;
} ?>
<!-- ===== BESTSELLERS ===== -->
<?php
if ( function_exists('get_field') ) {
$bestseller_ids = get_field('bestseller_ids');
if (is_array($bestseller_ids) && count($bestseller_ids) > 0): ?>
<section class="py-16 md:py-24 bg-white dark:bg-dark-card">
<div class="max-w-7xl mx-auto px-4 md:px-6">
<div class="flex items-end justify-between mb-10">
<div>
<span class="text-xs font-medium text-honey-400 tracking-wider font-inter">BESTSELLERS</span>
<h2 class="text-3xl md:text-4xl font-extrabold mt-2">پرفروش‌ترین‌ها</h2>
</div>
<a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="hidden md:flex items-center gap-1 text-sm font-medium text-forest-500 dark:text-forest-300 hover:gap-2 transition-all">
<span>مشاهده همه</span>
<iconify-icon icon="lucide:arrow-left" width="16"></iconify-icon>
</a>
</div>
<div class="grid grid-cols-2 lg:grid-cols-4 gap-4 md:gap-6">
<?php foreach( $bestseller_ids as $product_id ):
$product = wc_get_product( $product_id );
if ( ! $product ) continue;
?>
<div class="product-card group bg-cream-50 dark:bg-dark-bg rounded-2xl overflow-hidden border border-cream-200/50 dark:border-dark-border/50 hover:shadow-xl transition-all">
<a href="<?php echo get_permalink($product_id); ?>" class="block relative overflow-hidden">
<img src="<?php echo wp_get_attachment_image_url( $product->get_image_id(), 'medium' ); ?>" alt="<?php echo esc_attr($product->get_name()); ?>" class="product-img w-full h-48 md:h-56 object-cover">
<?php if( $product->is_on_sale() ): ?>
<div class="absolute top-3 right-3"><span class="px-2.5 py-1 bg-red-500 text-white text-[10px] rounded-full font-medium">تخفیف</span></div>
<?php endif; ?>
<div class="quick-actions absolute bottom-3 left-3 right-3 flex gap-2">
<a href="<?php echo esc_url($product->add_to_cart_url()); ?>" class="flex-1 py-2.5 bg-white/90 dark:bg-dark-card/90 backdrop-blur rounded-xl text-xs font-bold hover:bg-forest-500 hover:text-white transition flex items-center justify-center gap-1">
<iconify-icon icon="lucide:shopping-bag" width="14"></iconify-icon> افزودن
</a>
</div>
</a>
<div class="p-4">
<a href="<?php echo get_permalink($product_id); ?>" class="block font-bold text-sm line-clamp-2 mb-3 group-hover:text-forest-500 dark:group-hover:text-forest-300 transition"><?php echo $product->get_name(); ?></a>
<div class="flex items-end gap-2">
<span class="font-extrabold text-forest-500 dark:text-forest-300"><?php echo $product->get_price_html(); ?></span>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
</div>
</section>
<?php endif;
} ?>
<!-- ===== BRAND STORY ===== -->
<?php
if ( function_exists('get_field') && get_field('story_title') ): ?>
<section id="brand-story" class="py-16 md:py-24 bg-cream-100 dark:bg-dark-bg relative overflow-hidden">
<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">
<?php $story_img = get_field('story_image'); if(is_array($story_img) && isset($story_img['url'])): ?>
<div class="rounded-3xl overflow-hidden shadow-xl">
<img src="<?php echo esc_url($story_img['url']); ?>" alt="<?php echo esc_attr($story_img['alt'] ?? ''); ?>" class="w-full h-[350px] md:h-[450px] object-cover">
</div>
<?php endif; ?>
</div>
<div>
<span class="text-xs font-medium text-honey-400 tracking-wider font-inter">OUR STORY</span>
<h2 class="text-3xl md:text-4xl font-extrabold mt-2 mb-6"><?php echo esc_html(get_field('story_title')); ?></h2>
<p class="text-cream-500 dark:text-dark-muted leading-relaxed mb-6"><?php echo esc_html(get_field('story_text')); ?></p>
<?php $values = get_field('story_values'); if(is_array($values) && count($values) > 0): ?>
<div class="grid grid-cols-2 gap-4 mb-8">
<?php foreach($values as $val): ?>
<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="<?php echo esc_attr($val['icon']); ?>" width="20" class="text-forest-500 dark:text-forest-300"></iconify-icon>
</div>
<div>
<div class="font-bold text-sm mb-0.5"><?php echo esc_html($val['title']); ?></div>
<div class="text-xs text-cream-500 dark:text-dark-muted"><?php echo esc_html($val['desc']); ?></div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php $badges = get_field('certificates'); if(is_array($badges) && count($badges) > 0): ?>
<div class="flex items-center gap-3 flex-wrap">
<?php foreach($badges as $badge): ?>
<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><?php echo esc_html($badge['text']); ?></span>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
</div>
</div>
</section>
<?php endif; ?>
<!-- ===== TESTIMONIALS ===== -->
<?php
if ( function_exists('get_field') ) {
$testimonials = get_field('testimonials');
if (is_array($testimonials) && count($testimonials) > 0): ?>
<section class="py-16 md:py-24 bg-forest-500 dark:bg-forest-800 relative overflow-hidden">
<div class="absolute inset-0 opacity-10 honeycomb-bg"></div>
<div class="max-w-7xl mx-auto px-4 md:px-6 relative">
<div class="text-center mb-12">
<span class="text-xs font-medium text-honey-300 tracking-wider font-inter">TESTIMONIALS</span>
<h2 class="text-3xl md:text-4xl font-extrabold mt-2 text-white">نظرات مشتریان ما</h2>
</div>
<div class="grid md:grid-cols-3 gap-6">
<?php foreach($testimonials as $test): ?>
<div class="bg-white/10 backdrop-blur-md rounded-2xl p-6 border border-white/10">
<div class="flex text-honey-300 text-sm mb-4">★★★★★</div>
<p class="text-white/90 text-sm leading-relaxed mb-5">«<?php echo esc_html($test['text']); ?>»</p>
<div class="flex items-center gap-3">
<div class="w-10 h-10 bg-white/20 rounded-full flex items-center justify-center font-bold text-sm text-white"><?php echo esc_html($test['initials']); ?></div>
<div>
<div class="font-bold text-sm text-white"><?php echo esc_html($test['name']); ?></div>
<div class="text-xs text-white/60"><?php echo esc_html($test['city']); ?></div>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
</div>
</section>
<?php endif;
} ?>
<!-- ===== NEWSLETTER ===== -->
<section class="py-16 md:py-20 bg-white dark:bg-dark-card">
<div class="max-w-3xl mx-auto px-4 md:px-6 text-center">
<div class="w-16 h-16 mx-auto mb-6 bg-honey-50 dark:bg-honey-900/20 rounded-2xl flex items-center justify-center">
<iconify-icon icon="lucide:mail" width="32" class="text-honey-400"></iconify-icon>
</div>
<h2 class="text-2xl md:text-3xl font-extrabold mb-3"><?php echo esc_html(function_exists('get_field') ? (get_field('newsletter_title') ?: 'از تخفیف‌ها باخبر شوید') : 'از تخفیف‌ها باخبر شوید'); ?></h2>
<p class="text-cream-500 dark:text-dark-muted mb-8"><?php echo esc_html(function_exists('get_field') ? (get_field('newsletter_text') ?: 'با عضویت در خبرنامه، از جدیدترین محصولات مطلع شوید.') : 'با عضویت در خبرنامه، از جدیدترین محصولات مطلع شوید.'); ?></p>
<form class="flex flex-col sm:flex-row gap-3 max-w-lg mx-auto">
<input type="email" placeholder="ایمیل خود را وارد کنید..." required class="flex-1 px-5 py-3.5 bg-cream-50 dark:bg-dark-bg border border-cream-200 dark:border-dark-border rounded-2xl text-sm outline-none focus:border-forest-500 transition placeholder:text-cream-400">
<button type="submit" class="px-8 py-3.5 bg-forest-500 text-white rounded-2xl font-bold text-sm hover:bg-forest-600 transition whitespace-nowrap">عضویت</button>
</form>
</div>
</section>
<!-- ===== TRUST BADGES ===== -->
<section class="py-12 bg-cream-50 dark:bg-dark-bg border-y border-cream-200 dark:border-dark-border">
<div class="max-w-7xl mx-auto px-4 md:px-6">
<div class="grid grid-cols-2 md:grid-cols-4 gap-6 md:gap-8">
<div class="flex flex-col items-center text-center gap-2">
<div class="w-14 h-14 bg-white dark:bg-dark-card rounded-2xl flex items-center justify-center shadow-sm"><iconify-icon icon="lucide:truck" width="26" class="text-forest-500 dark:text-forest-300"></iconify-icon></div>
<div class="font-bold text-sm">ارسال سریع</div><div class="text-xs text-cream-500 dark:text-dark-muted">به سراسر ایران</div>
</div>
<div class="flex flex-col items-center text-center gap-2">
<div class="w-14 h-14 bg-white dark:bg-dark-card rounded-2xl flex items-center justify-center shadow-sm"><iconify-icon icon="lucide:shield-check" width="26" class="text-forest-500 dark:text-forest-300"></iconify-icon></div>
<div class="font-bold text-sm">ضمانت اصالت</div><div class="text-xs text-cream-500 dark:text-dark-muted">۱۰۰٪ اصل و طبیعی</div>
</div>
<div class="flex flex-col items-center text-center gap-2">
<div class="w-14 h-14 bg-white dark:bg-dark-card rounded-2xl flex items-center justify-center shadow-sm"><iconify-icon icon="lucide:credit-card" width="26" class="text-forest-500 dark:text-forest-300"></iconify-icon></div>
<div class="font-bold text-sm">پرداخت امن</div><div class="text-xs text-cream-500 dark:text-dark-muted">درگاه‌های معتبر</div>
</div>
<div class="flex flex-col items-center text-center gap-2">
<div class="w-14 h-14 bg-white dark:bg-dark-card rounded-2xl flex items-center justify-center shadow-sm"><iconify-icon icon="lucide:rotate-ccw" width="26" class="text-forest-500 dark:text-forest-300"></iconify-icon></div>
<div class="font-bold text-sm">بازگشت آسان</div><div class="text-xs text-cream-500 dark:text-dark-muted">۷ روز ضمانت</div>
</div>
</div>
</div>
</section>
</main>
<?php get_footer(); ?>

263
functions.php Normal file
View File

@ -0,0 +1,263 @@
<?php
// جلوگیری از دسترسی مستقیم
if ( ! defined( 'ABSPATH' ) ) exit;
// ۱. فعال‌سازی قابلیت‌های پایه وردپرس
function motayeb_setup() {
add_theme_support( 'title-tag' );
add_theme_support( 'post-thumbnails' );
add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list', 'gallery', 'caption', 'style', 'script' ) );
add_theme_support( 'woocommerce' );
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );
register_nav_menus( array(
'primary' => __( 'منوی اصلی', 'motayeb' ),
'footer' => __( 'منوی فوتر', 'motayeb' ),
) );
}
add_action( 'after_setup_theme', 'motayeb_setup' );
// ۲. لود فایل‌های CSS و JS
function motayeb_scripts() {
wp_enqueue_style( 'vazirmatn', 'https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap', array(), null );
wp_enqueue_script( 'tailwind-cdn', 'https://cdn.tailwindcss.com', array(), null, false );
wp_add_inline_script( 'tailwind-cdn', "
tailwind.config = {
darkMode: 'class',
theme: {
extend: {
colors: {
forest: { 50:'#e8f5ec', 100:'#c6e6cf', 200:'#9ed0ae', 300:'#6fb88a', 400:'#4a9a6b', 500:'#2D5F3F', 600:'#254d34', 700:'#1c3b28', 800:'#13291c', 900:'#0a1710' },
cream: { 50:'#FDFBF7', 100:'#F5F0E8', 200:'#EBE3D5', 300:'#DDD2BF', 400:'#C4B49A', 500:'#A99478' },
honey: { 50:'#FDF5ED', 100:'#F9E6D0', 200:'#F2CC9E', 300:'#E8AC6A', 400:'#D4A574', 500:'#C08B52', 600:'#A07040', 700:'#7D5630', 800:'#5A3D20', 900:'#3A2612' },
earth: { 50:'#F5EDE7', 100:'#E8D5C7', 200:'#D4B5A0', 300:'#BF9276', 400:'#8B5A3C', 500:'#734A30', 600:'#5C3B25', 700:'#452C1B', 800:'#2E1D12', 900:'#170E09' },
dark: { bg:'#1A1D23', card:'#22262E', border:'#2E333D', text:'#E8E6E3', muted:'#9CA3AF' }
},
fontFamily: { vazir: ['Vazirmatn', 'sans-serif'], inter: ['Inter', 'sans-serif'] }
}
}
}
" );
wp_enqueue_style( 'motayeb-main', get_template_directory_uri() . '/assets/css/main.css', array(), '1.0.0' );
wp_enqueue_script( 'iconify', 'https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js', array(), null, true );
wp_enqueue_script( 'motayeb-main', get_template_directory_uri() . '/assets/js/main.js', array(), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'motayeb_scripts' );
// ۳. حذف استایل پیش‌فرض ووکامرس
add_filter( 'woocommerce_enqueue_styles', '__return_empty_array' );
// ۴. بازنویسی تگ‌های Wraper ووکامرس
function motayeb_woo_wrapper_start() {
echo '<main id="primary" class="pt-16 md:pt-[104px]"><div class="max-w-7xl mx-auto px-4 md:px-6 py-8">';
}
function motayeb_woo_wrapper_end() {
echo '</div></main>';
}
remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10 );
remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10 );
add_action( 'woocommerce_before_main_content', 'motayeb_woo_wrapper_start', 10 );
add_action( 'woocommerce_after_main_content', 'motayeb_woo_wrapper_end', 10 );
// ۵. تنظیمات فروشگاه
add_filter( 'loop_shop_columns', function() { return 4; } );
add_filter( 'loop_shop_per_page', function() { return 12; } );
// ۶. اضافه کردن کلاس nav-link به منو
add_filter('nav_menu_link_attributes', 'motayeb_add_nav_link_class', 10, 3);
function motayeb_add_nav_link_class($atts, $item, $args) {
if ($args->theme_location === 'primary') {
$atts['class'] = isset($atts['class']) ? $atts['class'] . ' nav-link' : 'nav-link';
}
return $atts;
}
// ۸. فیلدهای صفحه اصلی (ACF)
if ( function_exists( 'acf_add_local_field_group' ) ) {
acf_add_local_field_group( array(
'key' => 'group_motayeb_homepage',
'title' => 'تنظیمات صفحه اصلی مطیب',
'fields' => array(
array( 'key' => 'field_hero_tab', 'label' => 'بخش هیرو', 'type' => 'tab' ),
array( 'key' => 'field_hero_title', 'name' => 'hero_title', 'label' => 'عنوان اصلی', 'type' => 'wysiwyg', 'tabs' => 'all', 'toolbar' => 'full', 'media_upload' => false, 'default_value' => '<span style="color: #8B5A3C;">طعم</span> <span style="color: #2D5F3F;">واقعی</span><br><span style="color: #D4A574;">طبیعت</span>' ),
array( 'key' => 'field_hero_subtitle', 'name' => 'hero_subtitle', 'label' => 'زیرعنوان', 'type' => 'textarea', 'rows' => 2, 'default_value' => 'از عسل کوهستان تا ارده سنتی، هر محصول مطیب سفری به دل طبیعت ایران است.' ),
array( 'key' => 'field_hero_image', 'name' => 'hero_image', 'label' => 'تصویر هیرو', 'type' => 'image', 'return_format' => 'array' ),
array( 'key' => 'field_hero_btn_text', 'name' => 'hero_btn_text', 'label' => 'متن دکمه', 'type' => 'text', 'default_value' => 'مشاهده محصولات' ),
array( 'key' => 'field_stats_tab', 'label' => 'آمار', 'type' => 'tab' ),
array( 'key' => 'field_stats', 'name' => 'stats', 'label' => 'آمار', 'type' => 'repeater', 'layout' => 'horizontal', 'button_label' => 'افزودن', 'sub_fields' => array(
array( 'key' => 'field_stat_number', 'name' => 'number', 'label' => 'عدد', 'type' => 'text' ),
array( 'key' => 'field_stat_label', 'name' => 'label', 'label' => 'توضیح', 'type' => 'text' ),
)),
array( 'key' => 'field_cats_tab', 'label' => 'دسته‌بندی‌ها', 'type' => 'tab' ),
array( 'key' => 'field_categories', 'name' => 'home_categories', 'label' => 'دسته‌بندی‌ها', 'type' => 'repeater', 'layout' => 'table', 'button_label' => 'افزودن', 'sub_fields' => array(
array( 'key' => 'field_cat_title', 'name' => 'title', 'label' => 'نام', 'type' => 'text' ),
array( 'key' => 'field_cat_icon', 'name' => 'icon', 'label' => 'آیکون', 'type' => 'text' ),
array( 'key' => 'field_cat_color', 'name' => 'color', 'label' => 'رنگ', 'type' => 'select', 'choices' => array( 'honey' => 'عسلی', 'forest' => 'سبز', 'red' => 'قرمز', 'emerald' => 'سبز روشن', 'amber' => 'کهربایی' ) ),
array( 'key' => 'field_cat_link', 'name' => 'link', 'label' => 'لینک', 'type' => 'url' ),
array( 'key' => 'field_cat_count', 'name' => 'count', 'label' => 'تعداد', 'type' => 'text' ),
)),
array( 'key' => 'field_bestsellers_tab', 'label' => 'پرفروش‌ها', 'type' => 'tab' ),
array( 'key' => 'field_bestsellers', 'name' => 'bestseller_ids', 'label' => 'محصولات پرفروش', 'type' => 'relationship', 'post_type' => array( 'product' ), 'filters' => array( 'search' ), 'elements' => array( 'featured_image' ), 'min' => 1, 'max' => 8, 'return_format' => 'id' ),
array( 'key' => 'field_story_tab', 'label' => 'داستان برند', 'type' => 'tab' ),
array( 'key' => 'field_story_title', 'name' => 'story_title', 'label' => 'عنوان', 'type' => 'text', 'default_value' => 'داستان مطیب، از طبیعت تا سفره شما' ),
array( 'key' => 'field_story_text', 'name' => 'story_text', 'label' => 'متن', 'type' => 'textarea', 'rows' => 4 ),
array( 'key' => 'field_story_image', 'name' => 'story_image', 'label' => 'تصویر', 'type' => 'image', 'return_format' => 'array' ),
array( 'key' => 'field_story_values', 'name' => 'story_values', 'label' => 'ویژگی‌ها', 'type' => 'repeater', 'layout' => 'table', 'button_label' => 'افزودن', 'sub_fields' => array(
array( 'key' => 'field_val_icon', 'name' => 'icon', 'label' => 'آیکون', 'type' => 'text' ),
array( 'key' => 'field_val_title', 'name' => 'title', 'label' => 'عنوان', 'type' => 'text' ),
array( 'key' => 'field_val_desc', 'name' => 'desc', 'label' => 'توضیح', 'type' => 'text' ),
)),
array( 'key' => 'field_story_badges', 'name' => 'certificates', 'label' => 'گواهی‌ها', 'type' => 'repeater', 'layout' => 'horizontal', 'button_label' => 'افزودن', 'sub_fields' => array(
array( 'key' => 'field_badge_text', 'name' => 'text', 'label' => 'متن', 'type' => 'text' ),
)),
array( 'key' => 'field_testimonials_tab', 'label' => 'نظرات', 'type' => 'tab' ),
array( 'key' => 'field_testimonials', 'name' => 'testimonials', 'label' => 'نظرات', 'type' => 'repeater', 'layout' => 'block', 'button_label' => 'افزودن', 'sub_fields' => array(
array( 'key' => 'field_test_text', 'name' => 'text', 'label' => 'متن', 'type' => 'textarea', 'rows' => 3 ),
array( 'key' => 'field_test_name', 'name' => 'name', 'label' => 'نام', 'type' => 'text' ),
array( 'key' => 'field_test_city', 'name' => 'city', 'label' => 'شهر', 'type' => 'text' ),
array( 'key' => 'field_test_init', 'name' => 'initials', 'label' => 'حروف', 'type' => 'text' ),
)),
array( 'key' => 'field_newsletter_tab', 'label' => 'خبرنامه', 'type' => 'tab' ),
array( 'key' => 'field_news_title', 'name' => 'newsletter_title', 'label' => 'عنوان', 'type' => 'text', 'default_value' => 'از تخفیف‌ها باخبر شوید' ),
array( 'key' => 'field_news_text', 'name' => 'newsletter_text', 'label' => 'توضیح', 'type' => 'text', 'default_value' => 'با عضویت در خبرنامه، از جدیدترین محصولات مطلع شوید.' ),
),
'location' => array(
array( array( 'param' => 'page_template', 'operator' => '==', 'value' => 'front-page.php' ) ),
),
) );
}
// ===================================================================
// تابع کمکی برای ظاهر کامنت‌ها (بدون خطای Cannot redeclare)
// ===================================================================
function motayeb_comment_callback($comment, $args, $depth) {
$author = get_comment_author($comment);
$initial = mb_substr($author, 0, 1);
$date = get_comment_date('Y/m/d');
$text = wpautop( esc_html( get_comment_text($comment) ) );
$is_pending = ('0' == $comment->comment_approved);
echo '<article class="bg-cream-50 dark:bg-dark-card rounded-2xl p-5 border border-cream-200/50 dark:border-dark-border/50 hover:shadow-md transition">';
echo '<div class="flex items-center justify-between mb-4">';
echo '<div class="flex items-center gap-3">';
echo '<div class="w-12 h-12 bg-forest-100 dark:bg-forest-800 rounded-full flex items-center justify-center font-bold text-sm text-forest-500 dark:text-forest-300 flex-shrink-0">' . $initial . '</div>';
echo '<div>';
echo '<div class="font-bold text-sm text-earth-400 dark:text-dark-text">' . $author . '</div>';
echo '<div class="text-xs text-cream-400 dark:text-dark-muted flex items-center gap-1.5"><span>' . $date . '</span>';
echo edit_comment_link('ویرایش', ' <span class="text-xs text-forest-500 dark:text-forest-300 hover:underline">', '</span>');
echo '</div></div></div>';
comment_reply_link(array_merge($args, array('reply_text' => '<iconify-icon icon="lucide:reply" width="16"></iconify-icon>', 'depth' => $depth, 'max_depth' => 3, 'before' => '')));
echo '</div>';
if ($is_pending) {
echo '<p class="text-xs text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 px-4 py-2 rounded-lg mb-3">نظر شما در انتظار تایید مدیریت است.</p>';
}
echo '<div class="text-sm text-cream-500 dark:text-dark-muted leading-7">' . $text . '</div>';
echo '</article>';
}
// ===================================================================
// دیتای تستی (فقط با زدن ?run_motayeb_seed در آدرس سایت اجرا می‌شود)
// ===================================================================
add_action('init', 'motayeb_seed_test_data');
function motayeb_seed_test_data() {
if (get_option('motayeb_seeded_done') || !isset($_GET['run_motayeb_seed'])) {
return;
}
require_once(ABSPATH . 'wp-admin/includes/media.php');
require_once(ABSPATH . 'wp-admin/includes/file.php');
require_once(ABSPATH . 'wp-admin/includes/image.php');
$categories = array('عسل طبیعی', 'ارده و حلوا', 'سرکه و ترشی', 'دمنوش گیاهی', 'خشکبار و آجیل', 'روغن طبیعی', 'شیره طبیعی');
$cat_ids = array();
foreach ($categories as $cat_name) {
$term = term_exists($cat_name, 'product_cat');
if (!$term) { $term = wp_insert_term($cat_name, 'product_cat'); }
$cat_ids[$cat_name] = is_array($term) ? $term['term_id'] : $term;
}
$products_data = array(
array('name' => 'عسل طبیعی کوهستان', 'desc' => 'عسل خالص و طبیعی جمع‌آوری شده از دامنه‌های زاگرس.', 'price' => 295000, 'sale_price' => 249000, 'cat' => 'عسل طبیعی', 'img' => 'https://images.unsplash.com/photo-1587049352846-4a222e784d38?w=600&q=80'),
array('name' => 'عسل آویشن و گون', 'desc' => 'عسل تک‌گلی آویشن و گون با عطر و طعمی بی‌نظیر.', 'price' => 345000, 'sale_price' => '', 'cat' => 'عسل طبیعی', 'img' => 'https://images.unsplash.com/photo-1558642452-9d2a7deb7f62?w=600&q=80'),
array('name' => 'ارده کنجد سنتی', 'desc' => 'ارده کنجد سنگ‌فرش شده با دستگاه‌های سنتی.', 'price' => 185000, 'sale_price' => '', 'cat' => 'ارده و حلوا', 'img' => 'https://images.unsplash.com/photo-1595475207225-428b62bda831?w=600&q=80'),
array('name' => 'حلوا ارده شیرین', 'desc' => 'حلوا اردهای سنتی با ترکیب ارده کنجد مرغوب.', 'price' => 210000, 'sale_price' => 189000, 'cat' => 'ارده و حلوا', 'img' => 'https://images.unsplash.com/photo-1590080875515-8a3a8dc5735e?w=600&q=80'),
array('name' => 'سرکه انگور طبیعی', 'desc' => 'سرکه انگور تخمیر شده به روش سنتی.', 'price' => 125000, 'sale_price' => '', 'cat' => 'سرکه و ترشی', 'img' => 'https://images.unsplash.com/photo-1596040033229-a9821ebd058d?w=600&q=80'),
array('name' => 'دمنوش بابونه', 'desc' => 'ترکیب آرامش‌بخش گل‌های بابونه و اسطوخودوس کوهی.', 'price' => 89000, 'sale_price' => '', 'cat' => 'دمنوش گیاهی', 'img' => 'https://images.unsplash.com/photo-1556679343-c7306c1976bc?w=600&q=80'),
array('name' => 'آجیل مخلوط لوکس', 'desc' => 'ترکیبی از پسته، بادام، فندق و گردو درجه یک.', 'price' => 485000, 'sale_price' => 429000, 'cat' => 'خشکبار و آجیل', 'img' => 'https://images.unsplash.com/photo-1599599810769-bcde5a160d32?w=600&q=80'),
array('name' => 'روغن زیتون فرابکر', 'desc' => 'روغن زیتون فرابکر کشت شده در باغ‌های گیلان.', 'price' => 275000, 'sale_price' => '', 'cat' => 'روغن طبیعی', 'img' => 'https://images.unsplash.com/photo-1474979266404-7eaabda50445?w=600&q=80'),
array('name' => 'شیره خرما طبیعی', 'desc' => 'شیره خالص خرما بدون شکر اضافه.', 'price' => 95000, 'sale_price' => 79000, 'cat' => 'شیره طبیعی', 'img' => 'https://images.unsplash.com/photo-1590165482129-1b8b27698780?w=600&q=80'),
array('name' => 'خشک انجیر درجه یک', 'desc' => 'انجیر خشک شده به روش آفتابی از باغ‌های استهبان.', 'price' => 165000, 'sale_price' => '', 'cat' => 'خشکبار و آجیل', 'img' => 'https://images.unsplash.com/photo-1596591868264-4ef737fbd18b?w=600&q=80')
);
foreach ($products_data as $p_data) {
$attach_id = media_sideload_image($p_data['img'], 0, $p_data['name'], 'id');
if (is_wp_error($attach_id)) { $attach_id = ''; }
$product_id = wp_insert_post(array(
'post_title' => $p_data['name'], 'post_content' => $p_data['desc'],
'post_status' => 'publish', 'post_type' => 'product',
));
if (!is_wp_error($product_id)) {
wp_set_object_terms($product_id, 'simple', 'product_type');
if (isset($cat_ids[$p_data['cat']])) {
wp_set_object_terms($product_id, array((int)$cat_ids[$p_data['cat']]), 'product_cat');
}
update_post_meta($product_id, '_price', $p_data['sale_price'] ? $p_data['sale_price'] : $p_data['price']);
update_post_meta($product_id, '_regular_price', $p_data['price']);
update_post_meta($product_id, '_sale_price', $p_data['sale_price']);
update_post_meta($product_id, '_stock_status', 'instock');
update_post_meta($product_id, '_manage_stock', 'no');
if ($attach_id) { set_post_thumbnail($product_id, $attach_id); }
}
}
$blog_cat = term_exists('سلامت و تغذیه', 'category');
if (!$blog_cat) {
$blog_cat = wp_insert_term('سلامت و تغذیه', 'category');
$blog_cat_id = is_array($blog_cat) ? $blog_cat['term_id'] : $blog_cat;
} else {
$blog_cat_id = is_array($blog_cat) ? $blog_cat['term_id'] : $blog_cat;
}
$posts_data = array(
array('title' => '۱۰ فایده شگفت‌انگیز عسل طبیعی', 'content' => '<p>عسل طبیعی یکی از قدیمی‌ترین مواد غذایی است.</p>', 'img' => 'https://images.unsplash.com/photo-1558642452-9d2a7deb7f62?w=800&q=80'),
array('title' => 'طرز تهیه حلوا ارده خانگی', 'content' => '<p>حلوا ارده یکی از شیرینی‌های سنتی ایرانی است.</p>', 'img' => 'https://images.unsplash.com/photo-1590080875515-8a3a8dc5735e?w=800&q=80')
);
foreach ($posts_data as $post_data) {
$attach_id = media_sideload_image($post_data['img'], 0, $post_data['title'], 'id');
if (is_wp_error($attach_id)) { $attach_id = ''; }
$post_id = wp_insert_post(array(
'post_title' => $post_data['title'], 'post_content' => $post_data['content'],
'post_status' => 'publish', 'post_type' => 'post',
));
if (!is_wp_error($post_id)) {
wp_set_object_terms($post_id, array((int)$blog_cat_id), 'category');
if ($attach_id) { set_post_thumbnail($post_id, $attach_id); }
}
}
update_option('motayeb_seeded_done', true);
wp_redirect(admin_url('admin.php?seed_success=1'));
exit;
}
add_action('admin_notices', 'motayeb_seed_success_notice');
function motayeb_seed_success_notice() {
if (isset($_GET['seed_success'])) {
echo '<div class="notice notice-success is-dismissible"><p><strong>موفقیت‌آمیز!</strong> دیتای تستی اضافه شد.</p></div>';
}
}
// ===================================================================
// تابع کمکی برای ظاهر کامنت‌ها (بدون خطای Cannot redeclare)
// ===================================================================
add_action('init', function() {
remove_action('comment_template', 'comment_form');
});

133
header.php Normal file
View File

@ -0,0 +1,133 @@
<!DOCTYPE html>
<html lang="fa" dir="rtl" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<?php wp_head(); ?>
</head>
<body <?php body_class('bg-cream-100 text-earth-400 dark:bg-dark-bg dark:text-dark-text transition-colors duration-300'); ?>>
<style>* { font-family: 'Vazirmatn', sans-serif; }</style>
<!-- Top Bar -->
<header id="header" class="fixed top-0 left-0 right-0 z-50 transition-all duration-300 bg-cream-100/80 dark:bg-dark-bg/80 backdrop-blur-xl border-b border-cream-200/50 dark:border-dark-border/50">
<div class="hidden md:block bg-forest-500 dark:bg-forest-700 text-white text-xs py-2">
<div class="max-w-7xl mx-auto px-6 flex items-center justify-between">
<div class="flex items-center gap-4">
<span class="flex items-center gap-1"><iconify-icon icon="lucide:truck" width="14"></iconify-icon> ارسال رایگان بالای ۵۰۰ هزار تومان</span>
<span class="w-px h-3 bg-white/30"></span>
<span class="flex items-center gap-1"><iconify-icon icon="lucide:shield-check" width="14"></iconify-icon> ضمانت اصالت کالا</span>
</div>
<div class="flex items-center gap-4">
<a href="tel:02112345678" class="flex items-center gap-1 hover:opacity-80 transition"><iconify-icon icon="lucide:phone" width="14"></iconify-icon> ۰۲۱-۱۲۳۴۵۶۷۸</a>
</div>
</div>
</div>
<!-- Main Nav -->
<div class="max-w-7xl mx-auto px-4 md:px-6">
<div class="flex items-center justify-between h-16 md:h-20">
<!-- Mobile Menu Toggle -->
<button onclick="document.getElementById('mobile-menu').classList.toggle('hidden')" class="md:hidden w-10 h-10 flex items-center justify-center rounded-xl hover:bg-cream-200 dark:hover:bg-dark-card transition" aria-label="منوی موبایل">
<iconify-icon icon="lucide:menu" width="22"></iconify-icon>
</button>
<!-- Logo -->
<a href="<?php echo home_url(); ?>" class="flex items-center gap-2.5">
<div class="w-10 h-10 bg-forest-500 rounded-2xl flex items-center justify-center shadow-lg shadow-forest-500/20">
<iconify-icon icon="lucide:leaf" width="20" class="text-white"></iconify-icon>
</div>
<div>
<span class="font-extrabold text-xl text-forest-500 dark:text-forest-300 leading-none">مطیب</span>
<span class="block text-[9px] text-cream-500 dark:text-dark-muted font-inter tracking-widest">MOTAYEB</span>
</div>
</a>
<!-- Desktop Nav (WP Menu) -->
<nav class="hidden md:flex items-center gap-8">
<?php
if ( has_nav_menu( 'primary' ) ) {
wp_nav_menu( array(
'theme_location' => 'primary',
'container' => false,
'menu_class' => 'flex items-center gap-8',
'items_wrap' => '%3$s',
'depth' => 1,
) );
} else { ?>
<a href="<?php echo home_url(); ?>" class="nav-link text-sm font-medium hover:text-forest-500 transition">صفحه اصلی</a>
<a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="nav-link text-sm font-medium hover:text-forest-500 transition">فروشگاه</a>
<?php } ?>
</nav>
<!-- Actions -->
<div class="flex items-center gap-2">
<button onclick="document.getElementById('search-overlay').classList.toggle('hidden')" class="w-10 h-10 flex items-center justify-center rounded-xl hover:bg-cream-200 dark:hover:bg-dark-card transition" aria-label="جستجو">
<iconify-icon icon="lucide:search" width="20"></iconify-icon>
</button>
<button class="hidden md:flex w-10 h-10 items-center justify-center rounded-xl hover:bg-cream-200 dark:hover:bg-dark-card transition" aria-label="حالت تاریک">
<iconify-icon icon="lucide:moon" width="20" class="dark:hidden"></iconify-icon>
<iconify-icon icon="lucide:sun" width="20" class="hidden dark:block text-honey-400"></iconify-icon>
</button>
<a href="<?php echo get_permalink( wc_get_page_id( 'cart' ) ); ?>" class="relative w-10 h-10 flex items-center justify-center rounded-xl hover:bg-cream-200 dark:hover:bg-dark-card transition" aria-label="سبد خرید">
<iconify-icon icon="lucide:shopping-bag" width="20"></iconify-icon>
<?php
$count = WC()->cart->get_cart_contents_count();
if ( $count > 0 ) : ?>
<span class="cart-badge absolute -top-0.5 -left-0.5 w-5 h-5 bg-honey-400 text-white text-[10px] font-bold rounded-full flex items-center justify-center">
<?php echo esc_html( $count ); ?>
</span>
<?php endif; ?>
</a>
<a href="<?php echo wp_login_url(); ?>" class="hidden md:flex w-10 h-10 items-center justify-center rounded-xl hover:bg-cream-200 dark:hover:bg-dark-card transition" aria-label="حساب کاربری">
<iconify-icon icon="lucide:user" width="20"></iconify-icon>
</a>
</div>
</div>
</div>
</header>
<!-- Search Overlay -->
<div id="search-overlay" class="fixed inset-0 z-[90] bg-black/50 backdrop-blur-sm hidden" onclick="this.classList.add('hidden')">
<div class="max-w-2xl mx-auto mt-24 px-4" onclick="event.stopPropagation()">
<form role="search" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>" class="bg-white dark:bg-dark-card rounded-2xl shadow-2xl p-6">
<div class="flex items-center gap-3 border-b border-cream-200 dark:border-dark-border pb-4">
<iconify-icon icon="lucide:search" width="22" class="text-forest-500"></iconify-icon>
<input type="search" class="search-field flex-1 bg-transparent text-lg outline-none placeholder:text-cream-400 dark:placeholder:text-dark-muted" placeholder="جستجو در محصولات..." value="<?php echo get_search_query(); ?>" name="s" autocomplete="off">
<input type="hidden" name="post_type" value="product">
<button type="button" onclick="this.closest('#search-overlay').classList.add('hidden')" class="text-cream-400 hover:text-earth-400">
<iconify-icon icon="lucide:x" width="22"></iconify-icon>
</button>
</div>
</form>
</div>
</div>
<!-- Mobile Menu Overlay -->
<div id="mobile-menu" class="fixed inset-0 z-[70] hidden">
<div class="absolute inset-0 bg-black/50" onclick="this.parentElement.classList.add('hidden')"></div>
<div class="absolute top-0 right-0 bottom-0 w-80 max-w-[85vw] bg-white dark:bg-dark-card shadow-2xl overflow-y-auto">
<div class="p-5 border-b border-cream-200 dark:border-dark-border flex items-center justify-between">
<span class="font-bold text-lg">مطیب</span>
<button onclick="this.closest('#mobile-menu').classList.add('hidden')" class="w-8 h-8 flex items-center justify-center rounded-full hover:bg-cream-100 dark:hover:bg-dark-bg">
<iconify-icon icon="lucide:x" width="20"></iconify-icon>
</button>
</div>
<nav class="p-4 space-y-1">
<?php
if ( has_nav_menu( 'primary' ) ) {
wp_nav_menu( array(
'theme_location' => 'primary',
'container' => false,
'items_wrap' => '%3$s',
'depth' => 1,
) );
} else { ?>
<a href="<?php echo home_url(); ?>" class="flex items-center gap-3 px-4 py-3 rounded-xl hover:bg-forest-50 dark:hover:bg-forest-900/30 transition">صفحه اصلی</a>
<a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>" class="flex items-center gap-3 px-4 py-3 rounded-xl hover:bg-forest-50 dark:hover:bg-forest-900/30 transition">فروشگاه</a>
<?php } ?>
</nav>
</div>
</div>

35
index.php Normal file
View File

@ -0,0 +1,35 @@
<?php
/**
* قالب پیش‌فرض (فallback)
* این فایل برای نمایش محتوا در مسیرهایی که تمپلیت خاصی تعریف نشده است استفاده می‌شود.
*/
get_header();
?>
<main id="primary" class="pt-16 md:pt-[104px]">
<div class="max-w-7xl mx-auto px-4 md:px-6 py-8 md:py-12">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<article class="mb-8">
<h1 class="text-3xl md:text-4xl font-extrabold mb-6 text-earth-400 dark:text-dark-text"><?php the_title(); ?></h1>
<div class="prose max-w-none text-cream-500 dark:text-dark-muted leading-relaxed">
<?php the_content(); ?>
</div>
</article>
<?php endwhile;
the_posts_pagination( array(
'mid_size' => 2,
'prev_text' => '<iconify-icon icon="lucide:arrow-right" width="18"></iconify-icon>',
'next_text' => '<iconify-icon icon="lucide:arrow-left" width="18"></iconify-icon>',
) );
else : ?>
<div class="text-center py-20">
<iconify-icon icon="lucide:search-x" width="64" class="text-cream-300 dark:text-dark-muted mb-4"></iconify-icon>
<h3 class="text-xl font-bold mb-2">محتوایی یافت نشد</h3>
<p class="text-cream-500 dark:text-dark-muted">متأسفانه محتوایی در این قسمت یافت نشد.</p>
</div>
<?php endif; ?>
</div>
</main>
<?php get_footer(); ?>

20
page.php Normal file
View File

@ -0,0 +1,20 @@
<?php
/**
* قالب برگه‌های ساده (سبد خرید، تسویه، و...)
*/
get_header();
?>
<main id="primary" class="pt-16 md:pt-[104px]">
<div class="max-w-7xl mx-auto px-4 md:px-6 py-8 md:py-12">
<?php
while ( have_posts() ) :
the_post();
the_content();
endwhile;
?>
</div>
</main>
<?php
get_footer();

BIN
screenshot.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 569 KiB

29
single-product.php Normal file
View File

@ -0,0 +1,29 @@
<?php
/**
* قالب تکی محصول
*/
get_header();
// نمایش breadcrumb مسیر صفحه
woocommerce_breadcrumb( array(
'wrap_before' => '<div class="max-w-7xl mx-auto px-4 md:px-6 pt-6 text-sm text-cream-500 dark:text-dark-muted flex items-center gap-2">',
'wrap_after' => '</div>',
'delimiter' => ' <iconify-icon icon="lucide:chevron-left" width="14"></iconify-icon> '
));
?>
<main class="pb-16 md:pb-24">
<div class="max-w-7xl mx-auto px-4 md:px-6">
<?php while ( have_posts() ) : ?>
<?php the_post(); ?>
<?php
// فراخوانی فایل محتوای محصول (داخل پوشه woocommerce)
wc_get_template_part( 'content', 'single-product' );
?>
<?php endwhile; ?>
</div>
</main>
<?php get_footer(); ?>

138
single.php Normal file
View File

@ -0,0 +1,138 @@
<?php
/**
* مقاله تکی بلاگ
*/
get_header();
?>
<main class="pt-16 md:pt-[104px]">
<div class="max-w-3xl mx-auto px-4 md:px-6 py-12 md:py-16">
<!-- نوار breadcrumbs -->
<div class="flex items-center gap-2 text-sm text-cream-500 dark:text-dark-muted mb-8">
<a href="<?php echo home_url(); ?>" class="hover:text-forest-500 transition">خانه</a>
<iconify-icon icon="lucide:chevron-left" width="14"></iconify-icon>
<a href="<?php echo esc_url( get_permalink( get_option( 'page_for_posts' ) ) ); ?>" class="hover:text-forest-500 transition">مجله</a>
<iconify-icon icon="lucide:chevron-left" width="14"></iconify-icon>
<span class="text-earth-400 dark:text-dark-text line-clamp-1 max-w-[200px]"><?php the_title(); ?></span>
</div>
<?php while ( have_posts() ) : the_post(); ?>
<!-- عنوان -->
<h1 class="text-3xl md:text-4xl font-extrabold leading-tight mb-6 text-earth-400 dark:text-dark-text">
<?php the_title(); ?>
</h1>
<!-- متادیتا (نویسنده و تاریخ) -->
<div class="flex flex-wrap items-center gap-4 mb-8 pb-8 border-b border-cream-200 dark:border-dark-border">
<?php
$author_id = get_the_author_meta('ID');
$avatar_url = get_avatar_url($author_id, 80);
if ( $avatar_url && ! is_wp_error($avatar_url) ) {
?>
<img src="<?php echo esc_url($avatar_url); ?>" alt="<?php echo esc_attr(get_the_author()); ?>" class="w-10 h-10 rounded-full border-2 border-cream-200 dark:border-dark-border">
<?php } ?>
<div>
<div class="text-sm font-bold text-earth-400 dark:text-dark-text"><?php the_author(); ?></div>
<div class="flex items-center gap-2 text-xs text-cream-400 dark:text-dark-muted">
<iconify-icon icon="lucide:calendar" width="14"></iconify-icon>
<span><?php echo get_the_date('d F Y'); ?></span>
</div>
</div>
<!-- دسته‌بندی‌ها -->
<div class="mr-auto flex gap-2 flex-wrap">
<?php
$categories = get_the_category();
if ( ! empty( $categories ) && ! is_wp_error( $categories ) ) {
foreach ( $categories as $cat ) {
echo '<a href="' . esc_url( get_category_link( $cat->term_id ) ) . '" class="px-3 py-1 bg-cream-100 dark:bg-dark-bg rounded-full text-xs text-cream-500 dark:text-dark-muted hover:bg-forest-50 hover:text-forest-500 dark:hover:bg-forest-900/30 dark:hover:text-forest-300 transition">' . esc_html($cat->name) . '</a>';
}
}
?>
</div>
</div>
<!-- عکس اصلی مقاله -->
<?php if ( has_post_thumbnail() ) : ?>
<div class="rounded-2xl overflow-hidden mb-10 border border-cream-200/50 dark:border-dark-border/50">
<?php the_post_thumbnail( 'large', array( 'class' => 'w-full object-cover' ) ); ?>
</div>
<?php endif; ?>
<!-- متن مقاله -->
<div class="prose max-w-none text-earth-400 dark:text-dark-text leading-relaxed mb-12
prose-headings:font-extrabold prose-headings:text-2xl prose-headings:text-forest-500 dark:prose-headings:text-forest-300 prose-headings:mt-8 prose-headings:mb-4
prose-p:text-cream-500 dark:prose-p:text-dark-muted prose-p:leading-8
prose-a:text-forest-500 dark:prose-a:text-forest-300 prose-a:font-semibold
prose-img:rounded-2xl prose-img:border prose-img:border-cream-200/50 dark:prose-img:border-dark-border/50 prose-img:my-8
prose-strong:text-earth-400 dark:prose-strong:text-dark-text">
<?php the_content(); ?>
</div>
<!-- تگ‌ها -->
<?php
$tags = get_the_tags();
if ( $tags && ! is_wp_error( $tags ) ) : ?>
<div class="flex items-center gap-2 flex-wrap mb-12 pb-12 border-b border-cream-200 dark:border-dark-border">
<iconify-icon icon="lucide:tag" width="18" class="text-cream-400 dark:text-dark-muted flex-shrink-0"></iconify-icon>
<?php foreach ( $tags as $tag ) : ?>
<a href="<?php echo esc_url( get_tag_link( $tag->term_id ) ); ?>" class="px-3 py-1.5 bg-cream-100 dark:bg-dark-bg rounded-full text-xs text-cream-500 dark:text-dark-muted hover:bg-honey-50 hover:text-honey-400 transition">
<?php echo esc_html($tag->name); ?>
</a>
<?php endforeach; ?>
</div>
<?php endif; ?>
<!-- کامنت‌ها -->
<?php
if ( comments_open() || get_comments_number() ) {
comments_template();
}
?>
<?php endwhile; ?>
<!-- نویسنده مقالات مرتبط -->
<?php
$cats = get_the_category();
if ( ! empty( $cats ) && ! is_wp_error( $cats ) ) {
$cat_ids = wp_list_pluck( $cats, 'term_id' );
if ( ! empty( $cat_ids ) ) {
$related_posts = get_posts( array(
'category__in' => $cat_ids,
'posts_per_page' => 3,
'post__not_in' => array( get_the_ID() ),
'orderby' => 'rand'
) );
if ( $related_posts && ! is_wp_error( $related_posts ) ) :
?>
<div class="mt-12 pt-12 border-t border-cream-200 dark:border-dark-border">
<h3 class="text-xl font-extrabold mb-8 text-earth-400 dark:text-dark-text">نوشته‌های مرتبط</h3>
<div class="grid md:grid-cols-3 gap-6">
<?php foreach ( $related_posts as $post ) : setup_postdata( $post ); ?>
<a href="<?php the_permalink(); ?>" class="group block bg-white dark:bg-dark-card rounded-xl overflow-hidden border border-cream-200/50 dark:border-dark-border/50 hover:shadow-lg transition-all">
<div class="h-40 overflow-hidden">
<?php if ( has_post_thumbnail() ) : ?>
<?php the_post_thumbnail( 'medium', array( 'class' => 'w-full h-full object-cover group-hover:scale-105 transition-transform duration-500' ) ); ?>
<?php endif; ?>
</div>
<div class="p-4">
<h4 class="font-bold text-sm line-clamp-2 group-hover:text-forest-500 dark:group-hover:text-forest-300 transition"><?php the_title(); ?></h4>
<span class="text-xs text-cream-400 dark:text-dark-muted mt-2 block"><?php echo get_the_date('Y/m/d'); ?></span>
</div>
</a>
<?php endforeach; wp_reset_postdata(); ?>
</div>
</div>
<?php
endif;
}
}
?>
</div>
</main>
<?php get_footer(); ?>

15
style.css Normal file
View File

@ -0,0 +1,15 @@
/*
Theme Name: Motayeb - مطیب
Theme URI: https://motayeb.ir
Author: VernaSOft (Kazem Alghasi)
Author URI: https://motayeb.ir
Description: قالب اختصاصی فروشگاهی مطیب برای محصولات ارگانیک و طبیعی - سازگار با ووکامرس
Version: 1.0.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: motayeb
Domain Path: /languages
*/

1464
ui.html Normal file
View File

File diff suppressed because it is too large Load Diff

52
woocommerce/content-product.php Normal file
View File

@ -0,0 +1,52 @@
<?php
/**
* کارت محصول - سازگار با طرح مطیب
*/
defined( 'ABSPATH' ) || exit;
global $product;
// اگر محصول معتبر نبود، رد شو
if ( ! is_a( $product, WC_Product::class ) ) {
return;
}
?>
<div <?php wc_product_class( 'product-card group bg-cream-50 dark:bg-dark-bg rounded-2xl overflow-hidden border border-cream-200/50 dark:border-dark-border/50 hover:shadow-xl transition-all', $product ); ?>>
<!-- لینک عکس -->
<a href="<?php the_permalink(); ?>" class="block relative overflow-hidden">
<?php
// نمایش عکس محصول
woocommerce_show_product_loop_sale_flash();
?>
<img src="<?php echo wp_get_attachment_image_url( $product->get_image_id(), 'medium' ); ?>" alt="<?php echo esc_attr( $product->get_name() ); ?>" class="product-img w-full h-48 md:h-56 object-cover">
<!-- دکمه افزودن به سبد (هاور در دسکتاپ - همیشه در موبایل طبق CSS قبلی) -->
<div class="quick-actions absolute bottom-3 left-3 right-3 flex gap-2">
<?php woocommerce_template_loop_add_to_cart(); ?>
</div>
</a>
<!-- اطلاعات محصول -->
<div class="p-4">
<!-- عنوان -->
<a href="<?php the_permalink(); ?>" class="block font-bold text-sm line-clamp-2 mb-3 group-hover:text-forest-500 dark:group-hover:text-forest-300 transition leading-relaxed">
<?php echo wp_kses_post( $product->get_name() ); ?>
</a>
<!-- ستاره‌ها (اگر فعال بود) -->
<?php if ( $product->get_average_rating() > 0 ) : ?>
<div class="flex items-center gap-1 mb-2">
<span class="text-honey-400 text-xs">★</span>
<span class="text-xs font-medium"><?php echo esc_html( $product->get_average_rating() ); ?></span>
</div>
<?php endif; ?>
<!-- قیمت -->
<div class="flex items-end gap-2">
<span class="font-extrabold text-forest-500 dark:text-forest-300 text-sm md:text-base"><?php echo $product->get_price_html(); ?></span>
</div>
</div>
</div>

243
woocommerce/content-single-product.php Normal file
View File

@ -0,0 +1,243 @@
<?php
/**
* محتوای محصول تکی - بازنویسی شده
*/
defined( 'ABSPATH' ) || exit;
global $product;
if ( ! is_a( $product, WC_Product::class ) ) return;
?>
<div class="py-8 md:py-12">
<div class="grid md:grid-cols-2 gap-6 lg:gap-12 items-start">
<!-- ===== گالری عکس ===== -->
<div class="relative">
<!-- عکس اصلی -->
<div class="relative rounded-2xl overflow-hidden bg-cream-50 dark:bg-dark-bg mb-3 border border-cream-200/50 dark:border-dark-border/50">
<div class="woocommerce-product-gallery woocommerce-product-gallery--with-images woocommerce-product-gallery--columns-4 images">
<figure class="woocommerce-product-gallery__wrapper">
<?php
// گرفتن آی‌دی تصویر شاخص
$attachment_id = $product->get_image_id();
if ( $attachment_id ) {
$full_size = wp_get_attachment_image_src( $attachment_id, 'full' );
$main_img_url = $full_size[0];
$alt_text = get_post_meta( $attachment_id, '_wp_attachment_image_alt', true );
} else {
$full_size = false;
$main_img_url = wc_placeholder_img_src();
$alt_text = 'تصویر محصول';
}
?>
<div data-thumb="<?php echo esc_url( wp_get_attachment_image_url( $attachment_id, 'thumbnail' ) ); ?>" class="woocommerce-product-gallery__image">
<a href="<?php echo esc_url( $main_img_url ); ?>" class="woocommerce-main-image zoom">
<img id="main-product-image"
src="<?php echo esc_url( $main_img_url ); ?>"
alt="<?php echo esc_attr( $alt_text ); ?>"
class="w-full h-[300px] md:h-[450px] lg:h-[500px] object-cover"
data-large_image="<?php echo esc_url( $main_img_url ); ?>"
data-large_image_width="<?php echo $full_size ? $full_size[1] : 800; ?>"
data-large_image_height="<?php echo $full_size ? $full_size[2] : 800; ?>">
</a>
</div>
<!-- گالری اضافه (اگر کاربر تو پنل ووکامرس عکس‌های بیشتری آپلود کرده باشه) -->
<?php
$attachment_ids = $product->get_gallery_image_ids();
if ( $attachment_ids ) {
foreach ( $attachment_ids as $gallery_img_id ) {
$gallery_full = wp_get_attachment_image_src( $gallery_img_id, 'full' );
$gallery_alt = get_post_meta( $gallery_img_id, '_wp_attachment_image_alt', true );
echo '<div data-thumb="' . esc_url( wp_get_attachment_image_url( $gallery_img_id, 'thumbnail' ) ) . '" class="woocommerce-product-gallery__image" style="display:none;">';
echo '<a href="' . esc_url( $gallery_full[0] ) . '">';
echo '<img src="' . esc_url( $gallery_full[0] ) . '" alt="' . esc_attr( $gallery_alt ) . '" class="w-full h-[300px] md:h-[450px] lg:h-[500px] object-cover">';
echo '</a></div>';
}
}
?>
</figure>
</div>
</div>
<!-- تامبنیل‌ها -->
<div class="flex gap-2 overflow-x-auto pb-1">
<!-- تامبنیل عکس اصلی -->
<button onclick="changeProductImage(this, '<?php echo esc_url( $main_img_url ); ?>')" class="gallery-thumb active w-20 h-20 rounded-xl overflow-hidden border-2 border-forest-500 flex-shrink-0">
<img src="<?php echo esc_url( wp_get_attachment_image_url( $attachment_id, 'thumbnail' ) ); ?>" class="w-full h-full object-cover">
</button>
<!-- تامبنیل‌های گالری -->
<?php if ( $attachment_ids ) : ?>
<?php foreach ( $attachment_ids as $gallery_img_id ) :
$gallery_full = wp_get_attachment_image_src( $gallery_img_id, 'full' );
?>
<button onclick="changeProductImage(this, '<?php echo esc_url( $gallery_full[0] ); ?>')" class="gallery-thumb w-20 h-20 rounded-xl overflow-hidden border-2 border-transparent flex-shrink-0 hover:border-forest-300 transition">
<img src="<?php echo esc_url( wp_get_attachment_image_url( $gallery_img_id, 'thumbnail' ) ); ?>" class="w-full h-full object-cover">
</button>
<?php endforeach; ?>
<?php endif; ?>
</div>
</div>
<!-- ===== اطلاعات محصول ===== -->
<div class="lg:sticky lg:top-28">
<!-- دسته بندی -->
<div class="flex items-center gap-2 mb-3 text-xs text-cream-500 dark:text-dark-muted">
<?php echo wc_get_product_category_list( $product->get_id(), ' <span class="w-1 h-1 bg-cream-400 rounded-full"></span> ' ); ?>
</div>
<!-- عنوان -->
<h1 class="text-2xl md:text-3xl font-extrabold mb-3 leading-relaxed"><?php the_title(); ?></h1>
<!-- ستاره‌ها -->
<?php if ( $product->get_review_count() > 0 ) : ?>
<div class="flex items-center gap-2 mb-5">
<div class="star-rating-wrapper flex text-honey-400" style="font-size: 1.1rem; letter-spacing: 2px;">
<?php
$rating = $product->get_average_rating();
$full_stars = floor($rating);
$empty_stars = 5 - $full_stars;
echo str_repeat('★', $full_stars) . str_repeat('☆', $empty_stars);
?>
</div>
<span class="text-xs text-cream-500 dark:text-dark-muted">(<?php echo esc_html($product->get_review_count()); ?> نظر)</span>
</div>
<?php endif; ?>
<!-- موجودی -->
<div class="flex items-center gap-2 mb-5">
<?php if ( $product->is_in_stock() ) : ?>
<span class="w-2 h-2 bg-emerald-500 rounded-full"></span>
<span class="text-sm text-emerald-600 dark:text-emerald-400 font-medium">موجود در انبار</span>
<?php else : ?>
<span class="w-2 h-2 bg-red-500 rounded-full"></span>
<span class="text-sm text-red-500 font-medium">ناموجود</span>
<?php endif; ?>
</div>
<!-- توضیح کوتاه -->
<?php if ( $product->get_short_description() ) : ?>
<div class="text-cream-500 dark:text-dark-muted text-sm leading-7 mb-6 pb-6 border-b border-cream-200 dark:border-dark-border">
<?php echo wp_kses_post( $product->get_short_description() ); ?>
</div>
<?php endif; ?>
<!-- قیمت -->
<div class="flex items-center gap-4 mb-6">
<?php if ( $product->is_on_sale() ) : ?>
<span class="text-3xl font-extrabold text-forest-500 dark:text-forest-300"><?php echo wc_price( $product->get_sale_price() ); ?></span>
<span class="text-lg text-cream-400 dark:text-dark-muted line-through"><?php echo wc_price( $product->get_regular_price() ); ?></span>
<?php else : ?>
<span class="text-3xl font-extrabold text-forest-500 dark:text-forest-300"><?php echo wc_price( $product->get_price() ); ?></span>
<?php endif; ?>
<span class="text-sm text-cream-500 dark:text-dark-muted">تومان</span>
</div>
<!-- شروع فرم خرید -->
<?php if ( $product->is_in_stock() ) : ?>
<form class="cart" action="<?php echo esc_url( apply_filters( 'woocommerce_add_to_cart_form_action', $product->get_permalink() ) ); ?>" method="post" enctype='multipart/form-data'>
<?php wp_nonce_field( 'woocommerce-add-to-cart_' . $product->get_id(), 'woocommerce-add-to-cart-nonce' ); ?>
<?php endif; ?>
<!-- فرم خرید -->
<!-- فرم خرید (دقیقاً مثل طرح اول) -->
<div class="flex items-center gap-4 mb-6">
<!-- اینپوت تعداد سفارشی -->
<div class="flex items-center border-2 border-cream-200 dark:border-dark-border rounded-xl overflow-hidden">
<button type="button" onclick="document.getElementById('motayeb-qty').value = Math.max(1, parseInt(document.getElementById('motayeb-qty').value) - 1)" class="w-10 h-10 flex items-center justify-center hover:bg-cream-100 dark:hover:bg-dark-bg transition">
<iconify-icon icon="lucide:minus" width="16"></iconify-icon>
</button>
<input type="number" id="motayeb-qty" name="quantity" value="1" min="1" max="<?php echo esc_attr( $product->get_max_purchase_quantity() > 0 ? $product->get_max_purchase_quantity() : 9999 ); ?>" class="w-12 h-10 text-center border-x-2 border-cream-200 dark:border-dark-border font-bold text-sm outline-none bg-white dark:bg-dark-card" dir="ltr">
<button type="button" onclick="document.getElementById('motayeb-qty').value = parseInt(document.getElementById('motayeb-qty').value) + 1" class="w-10 h-10 flex items-center justify-center hover:bg-cream-100 dark:hover:bg-dark-bg transition">
<iconify-icon icon="lucide:plus" width="16"></iconify-icon>
</button>
</div>
<!-- دکمه سبز بزرگ -->
<button type="submit" name="add-to-cart" value="<?php echo esc_attr( $product->get_id() ); ?>" class="flex-1 h-10 bg-forest-500 text-white rounded-xl font-bold hover:bg-forest-600 hover:-translate-y-0.5 transition-all shadow-lg shadow-forest-500/25 flex items-center justify-center gap-2">
<iconify-icon icon="lucide:shopping-bag" width="20"></iconify-icon>
<span>افزودن به سبد خرید</span>
</button>
</div>
<!-- تگ فرم مخفی ووکامرس (الزامی برای کار کردن سبد خرید) -->
</form>
<?php if ( ! $product->is_in_stock() ) : ?>
<div class="flex items-center gap-3 p-4 bg-red-50 dark:bg-red-900/20 rounded-2xl border border-red-200 dark:border-red-800 text-red-500 text-sm font-medium">
<iconify-icon icon="lucide:x-circle" width="20"></iconify-icon>
این محصول در حال حاضر ناموجود است.
</div>
<?php endif; ?>
<!-- اطلاعات کالا -->
<div class="grid grid-cols-2 gap-3 mb-6">
<?php if ( $product->get_sku() ) : ?>
<div class="flex items-center gap-3 p-3 bg-cream-50 dark:bg-dark-bg rounded-xl border border-cream-200/50 dark:border-dark-border/50">
<iconify-icon icon="lucide:hash" width="18" class="text-cream-400 flex-shrink-0"></iconify-icon>
<div>
<div class="text-[10px] text-cream-400 dark:text-dark-muted">شناسه</div>
<div class="text-xs font-bold"><?php echo esc_html($product->get_sku()); ?></div>
</div>
</div>
<?php endif; ?>
<div class="flex items-center gap-3 p-3 bg-cream-50 dark:bg-dark-bg rounded-xl border border-cream-200/50 dark:border-dark-border/50">
<iconify-icon icon="lucide:tag" width="18" class="text-cream-400 flex-shrink-0"></iconify-icon>
<div class="min-w-0">
<!-- دسته بندی -->
<div class="mb-4">
<?php
$cats = get_the_terms( $product->get_id(), 'product_cat' );
if ( $cats && ! is_wp_error( $cats ) ) : ?>
<span class="inline-flex items-center gap-1.5 px-3 py-1 bg-forest-50 dark:bg-forest-900/30 text-forest-500 dark:text-forest-300 rounded-full text-xs font-semibold">
<iconify-icon icon="lucide:tag" width="14"></iconify-icon>
<?php echo esc_html( $cats[0]->name ); ?>
</span>
<?php endif; ?>
</div> <div class="text-xs font-bold line-clamp-1"><?php echo wc_get_product_category_list( $product->get_id(), ', ' ); ?></div>
</div>
</div>
</div>
<!-- اعتماد -->
<div class="grid grid-cols-2 gap-3 mt-6">
<div class="flex items-center gap-2.5 p-3 bg-cream-50 dark:bg-dark-bg rounded-xl border border-cream-200/50 dark:border-dark-border/50">
<div class="w-9 h-9 bg-forest-50 dark:bg-forest-900/30 rounded-lg flex items-center justify-center flex-shrink-0">
<iconify-icon icon="lucide:truck" width="16" class="text-forest-500 dark:text-forest-300"></iconify-icon>
</div>
<span class="text-xs font-medium leading-tight">ارسال به سراسر کشور</span>
</div>
<div class="flex items-center gap-2.5 p-3 bg-cream-50 dark:bg-dark-bg rounded-xl border border-cream-200/50 dark:border-dark-border/50">
<div class="w-9 h-9 bg-forest-50 dark:bg-forest-900/30 rounded-lg flex items-center justify-center flex-shrink-0">
<iconify-icon icon="lucide:rotate-ccw" width="16" class="text-forest-500 dark:text-forest-300"></iconify-icon>
</div>
<span class="text-xs font-medium leading-tight">بازگشت ۷ روزه</span>
</div>
<div class="flex items-center gap-2.5 p-3 bg-cream-50 dark:bg-dark-bg rounded-xl border border-cream-200/50 dark:border-dark-border/50">
<div class="w-9 h-9 bg-forest-50 dark:bg-forest-900/30 rounded-lg flex items-center justify-center flex-shrink-0">
<iconify-icon icon="lucide:shield-check" width="16" class="text-forest-500 dark:text-forest-300"></iconify-icon>
</div>
<span class="text-xs font-medium leading-tight">ضمانت اصالت کالا</span>
</div>
<div class="flex items-center gap-2.5 p-3 bg-cream-50 dark:bg-dark-bg rounded-xl border border-cream-200/50 dark:border-dark-border/50">
<div class="w-9 h-9 bg-forest-50 dark:bg-forest-900/30 rounded-lg flex items-center justify-center flex-shrink-0">
<iconify-icon icon="lucide:credit-card" width="16" class="text-forest-500 dark:text-forest-300"></iconify-icon>
</div>
<span class="text-xs font-medium leading-tight">پرداخت امن</span>
</div>
</div>
</div>
</div>
<!-- ===== تب‌ها ===== -->
<div class="mt-16 border-t border-cream-200 dark:border-dark-border pt-8">
<?php woocommerce_output_product_data_tabs(); ?>
</div>
<!-- ===== مرتبط ===== -->
<div class="mt-16">
<h2 class="text-2xl font-extrabold mb-8">محصولات مرتبط</h2>
<div class="grid grid-cols-2 lg:grid-cols-4 gap-4 md:gap-6">
<?php woocommerce_output_related_products(); ?>
</div>
</div>
</div>

51
woocommerce/single-product/review-form.php Normal file
View File

@ -0,0 +1,51 @@
<?php
/**
* فرم ثبت نظر - کاملاً سفارشی (بدون متن 1 of 5 stars)
*/
defined( 'ABSPATH' ) || exit;
if ( ! $comment_form = get_comment_form() ) {
return;
}
?>
<div id="review_form_wrapper">
<div id="respond" class="comment-respond">
<h3 id="replytitle" class="comment-reply-title font-bold text-lg mb-6">ثبت نظر جدید</h3>
<form action="<?php echo esc_url( get_permalink() ); ?>#respond" method="post" id="commentform" class="comment-form space-y-4 bg-cream-50 dark:bg-dark-card rounded-2xl p-5 border border-cream-200/50 dark:border-dark-border/50">
<?php comment_form_fields(); ?>
<!-- فیلد ستاره‌ها (جایگزین سیستم وردپرس) -->
<div class="mb-2">
<label class="text-sm font-bold mb-3 block">امتیاز شما:</label>
<div id="custom-star-rating" class="flex gap-1 text-3xl text-cream-300 dark:text-dark-border cursor-pointer">
<span class="star" data-value="1">★</span>
<span class="star" data-value="2">★</span>
<span class="star" data-value="3">★</span>
<span class="star" data-value="4">★</span>
<span class="star" data-value="5">★</span>
</div>
<input type="hidden" name="rating" id="rating" value="0">
</div>
<!-- فیلدهای متنی (نام، ایمیل، متن نظر) -->
<div class="grid md:grid-cols-2 gap-4">
<div>
<input type="text" name="author" id="author" placeholder="نام و نام خانوادگی *" required class="w-full px-4 py-3 bg-white dark:bg-dark-bg border border-cream-200 dark:border-dark-border rounded-xl text-sm outline-none focus:border-forest-500 transition placeholder:text-cream-400">
</div>
<div>
<input type="email" name="email" id="email" placeholder="ایمیل *" required class="w-full px-4 py-3 bg-white dark:bg-dark-bg border border-cream-200 dark:border-dark-border rounded-xl text-sm outline-none focus:border-forest-500 transition placeholder:text-cream-400 font-inter" dir="ltr">
</div>
</div>
<textarea name="comment" id="comment" rows="4" placeholder="نظر خود را بنویسید... *" required class="w-full px-4 py-3 bg-white dark:bg-dark-bg border border-cream-200 dark:border-dark-border rounded-xl text-sm outline-none focus:border-forest-500 transition placeholder:text-cream-400 resize-none"></textarea>
<!-- فیلدهای مخفی وردپرس -->
<?php do_action( 'comment_form', $comment_form ); ?>
<div class="flex justify-end">
<button type="submit" class="px-8 py-3 bg-forest-500 text-white rounded-2xl font-bold text-sm hover:bg-forest-600 transition">ثبت نظر</button>
</div>
</form>
</div>
</div>

36
woocommerce/single-product/review.php Normal file
View File

@ -0,0 +1,36 @@
<?php
/**
* نمایش تکی نظر - کاملاً سفارشی
*/
defined( 'ABSPATH' ) || exit;
global $comment;
$rating = intval( get_comment_meta( $comment->comment_ID, 'rating', true ) );
?>
<li <?php comment_class(); ?> id="li-comment-<?php comment_ID(); ?>">
<div class="bg-cream-50 dark:bg-dark-card rounded-2xl p-5 border border-cream-200/50 dark:border-dark-border/50">
<div class="flex items-center justify-between mb-3">
<div class="flex items-center gap-3">
<div class="w-10 h-10 bg-forest-100 dark:bg-forest-800 rounded-full flex items-center justify-center font-bold text-sm text-forest-500 dark:text-forest-300">
<?php echo mb_substr( get_comment_author( $comment ), 0, 1 ); ?>
</div>
<div>
<div class="font-bold text-sm text-earth-400 dark:text-dark-text"><?php echo esc_html( get_comment_author( $comment ) ); ?></div>
<div class="text-[10px] text-cream-500 dark:text-dark-muted"><?php echo get_comment_date( 'Y/m/d' ); ?></div>
</div>
</div>
<!-- ستاره‌های تمیز و متنی -->
<?php if ( $rating && wc_review_ratings_enabled() ) : ?>
<div class="flex text-honey-400 text-sm" style="letter-spacing: 2px;">
<?php echo str_repeat('★', $rating) . str_replace('★', '☆', str_repeat('★', 5 - $rating)); ?>
</div>
<?php endif; ?>
</div>
<?php if ( $comment->comment_approved == '0' ) : ?>
<p class="text-xs text-amber-500 mb-2"><?php esc_html_e( 'Your review is awaiting approval', 'woocommerce' ); ?></p>
<?php endif; ?>
<div class="text-sm text-cream-500 dark:text-dark-muted leading-7">
<?php echo wpautop( esc_html( get_comment_text( $comment ) ) ); ?>
</div>
</div>
</li>