قالب پست وبلاگ (Blog post template)
قبل از شروع: پستهای نمونه
حداقل یک پست منتشرشده برای پیشنمایش لازم است. اگر برای حلقههای پرسوجو ۳ پست با تصویر شاخص ساختید، آمادهاید.
در غیر این صورت:
- Posts > Add New
- عنوان، محتوا در block editor، Featured image
- Publish
روی صفحه اصلی شبکه پستها را میبینید. با کلیک، قالب پیشفرض وردپرس (بسیار ساده) نمایش داده میشود. بیایید Single Template مناسب بسازیم.
Single Template چیست؟
در مقدمه قالبها انواع Template Type را دیدید. Single چیدمان هر پست/صفحه وبلاگ را کنترل میکند.
برای وبلاگ طراحی را از محتوا جدا میکنیم:
- طراحی (چیدمان، استایل) = قالب Bricks
- محتوا (متن، تصاویر پست) = block editor وردپرس
بعداً فقط قالب را عوض میکنید — بدون کپی مجدد محتوا.
ساخت قالب
- Bricks > Templates
- Add New — عنوان: «Blog Post»
- Edit with Bricks
نوع و شرایط
- Settings (چرخدنده) → Template Settings
- Template Type:
Single - Template Conditions → Add Condition → Post type: Posts
قالب روی همه پستهای وبلاگ اعمال میشود.
تست
قالب را Save کنید. یک پست آزمایشی در فرانتاند باز کنید — صفحه خالی. یعنی قالب اعمال شده اما هنوز المانی ندارید.
ساخت با Wireframe
- Templates (پوشه) → Source: Wireframes
- فیلتر Template Type:
Single - «Article 01» (یا مشابه) → Insert
وقتی برای import کلاسهای سراسری، Theme Styles و color palette پرسید، Yes بزنید.
آنچه import میشود
علاوه بر چیدمان ممکن است Global Classes، Theme Styles و Color palette هم اضافه شوند. برای wireframe طبیعی است. اگر سایت را minimal میخواهید، wireframe درج نکنید یا import داراییها را رد کنید.
Post Content الزامیاست
بدون المان Post Content متن block editor در فرانتاند نمایش داده نمیشود. پس از insert wireframe در ساختار Post Content را تأیید کنید (بخش عنصر Post Content).
Wireframe چیدمان کامل پست را درج میکند.
بررسی قالب
Wireframe را جابهجا کنید، بشکنید، دوباره بچینید — برای یادگیری عالی است.
پنل ساختار
Sectionها با Heading، Text، Image و غیره.
آکولادهای مجعد
{post_title}، {featured_image}، {post_date} — برچسبهای Dynamic Data؛ همانهایی که در Query Loop دیدید.
درک Context
در Query Loop (صفحه اصلی): context هر کارت پست متفاوت است — کارت ۱ = پست ۱، کارت ۲ = پست ۲.
در Single Template: context همان پستی است که بازدیدکننده میبیند. {post_title} عنوان همان پست است.
یک قالب، پستهای بینهایت — هر کدام محتوای خود.
المانهای کلیدی
| المان | نقش |
|---|---|
Heading + {post_title} |
عنوان پست |
Image + {featured_image} |
تصویر شاخص |
| Post Content | محتوای block editor |
| Meta | {author_name}، {post_date}، {post_terms_category} |
Post Content element
محتوای block editor را رندر میکند.
چرا محتوا در وردپرس بماند؟
- قابلیت حمل محتوا — با عوض کردن تم، محتوا سالم میماند
- مناسب مشتری — کاربران غیرفنی editor را میشناسند
- سازگاری افزونه — SEO، فهرست مطالب و غیره محتوا را آنجا انتظار دارند
- تفکیک نگرانی — طراحی در Bricks، محتوا در وردپرس
فرانتاند
پست آزمایشی را باز کنید — قالب + Dynamic Data محتوای همان پست.
پست دیگر — همان قالب، محتوای متفاوت.
سفارشیسازی
- Bricks > Templates → «Blog Post» → Edit with Bricks
- رنگ، فاصله، فونت را تغییر دهید
- Save
همه پستها خودکار بهروز میشوند.
تمرین
رنگ Heading را عوض کنید. چند پست مختلف را ببینید. پست جدید در وردپرس بسازید — خودکار از قالب استفاده میکند.
آنچه یاد گرفتید
- ساخت Single Template و Conditions
- Wireframe برای یادگیری سریع
- Context در Dynamic Data
- Post Content و تفکیک طراحی/محتوا
مسیر بعدی: اصول واکنشگرایی (Responsive basics)