🧩 آموزش جلسه ششم از فصل دوم طراحی سایت سایتساز شو ۱۱۰:
طراحی صفحه بایگانی مقالات یا محصولات
ساخت صفحه بایگانی یکی از بخشهای مهم طراحی سایت است؛ چون کاربران از طریق این صفحه میتونن راحتتر به محتوا یا محصولات شما دسترسی پیدا کنن. این صفحه هم از نظر تجربه کاربری مهمه، هم برای سئو و امکان دسترسی به محتوا.
🧱 ساختار صفحه بایگانی باید چطور باشه؟
در حالت پایه، یک صفحه بایگانی شامل این بخشهاست:
۱. تیتر اصلی صفحه (مثل: «همه مقالات» یا «فروشگاه ما»)
۲. فیلتر یا دستهبندیها (مثلاً بر اساس موضوع مقاله یا دسته محصول)
۳. نمایش لیستی یا گریدی از آیتمها
۴. تصویر، عنوان و توضیح خلاصه برای هر آیتم
۵. دکمه مطالعه بیشتر / مشاهده محصول
۶. صفحهبندی (pagination)
🔧 روش ساخت در وردپرس
روش اول: استفاده از قالبساز وردپرس
اگر قالب شما از ابزار قالبساز (Theme Builder) پشتیبانی میکنه، میتونید بایگانی اختصاصی بسازید:
- وارد بخش نمایش > ویرایش قالب بشید
- یک قالب جدید برای “بایگانی” بسازید
- از بلوکهای زیر استفاده کنید:
- Loop: برای نمایش لیستی مقالات یا محصولات
- Post Title، Post Excerpt، Post Featured Image
- Pagination
روش دوم: استفاده از صفحهسازها (مانند Elementor)
- یک قالب بایگانی بسازید
- از ویجت Loop استفاده کنید
- چیدمان دلخواه خودتون رو طراحی کنید
- فیلتر یا دستهبندی هم میتونید اضافه کنید (با افزونههای مکمل)
💡 نکات حرفهای برای طراحی بهتر
- حتماً عنوان سئو و متا دیسکریپشن اختصاصی برای هر دستهبندی تنظیم کنید.
- اگه محصولات دارید، دستهبندیها و فیلتر برند، قیمت، و ویژگیها خیلی کمک میکنن.
- در نمایش گریدی، تناسب تصویر و عنوان مهمه. حواستون به طراحی باشه.
- از ساختار HTML مناسب استفاده کنید (مثل استفاده درست از `<article>` یا `<section>` برای هر آیتم).
🧩 برای طراحان حرفهای: استفاده از HTML سفارشی
اگر میخواید خودتون فرم صفحه بایگانی رو بنویسید، یک نمونه ساده HTML:
<section class=”archive”>
<h2>همه مقالات</h2>
<div class=”archive-grid”>
<article>
<img src=”image.jpg” alt=”عنوان مقاله”>
<h3>عنوان مقاله</h3>
<p>توضیح کوتاه مقاله…</p>
<a href=”#”>مطالعه بیشتر</a>
</article>
<!– ادامه مقالات –>
</div>
</section>
📌 نتیجهگیری
ساخت یک صفحه بایگانی مرتب و حرفهای، باعث میشه کاربران راحتتر تو سایت شما بچرخن و گوگل هم بهتر ساختار محتوای شما رو بشناسه. چه برای وبلاگ باشه چه فروشگاه، طراحی بایگانی رو جدی بگیرید!





دیدگاهتان را بنویسید