طراحی بلاگ در وردپرس با افزونه Blog Designer

اگه می‌خواید نوشته‌های سایتتون مرتب‌تر و جذاب‌تر دیده بشن، افزونه Blog Designer بهتون اجازه می‌ده صفحه بلاگ رو بدون کدنویسی طراحی کنید. این افزونه چند چیدمان آماده داره و می‌تونید نوشته‌ها رو براساس دسته‌بندی، برچسب یا نویسنده نمایش بدید.

البته این افزونه مدت زیادیه به‌روزرسانی نشده و مخزن وردپرس درباره آزمایش‌نشدن اون با نسخه‌های اصلی جدید وردپرس هشدار می‌ده. پس در این آموزش، علاوه بر روش استفاده، توضیح می‌دیم چطور افزونه رو اول روی یک سایت آزمایشی بررسی کنید تا صفحه اصلی سایتتون به مشکل نخوره.

طراحی بلاگ در وردپرس با Blog Designer

صفحه بلاگ جاییه که فهرست نوشته‌های سایتتون نمایش داده می‌شه. ظاهر مرتب این صفحه پیدا کردن مطالب رو برای بازدیدکننده راحت‌تر می‌کنه، ولی به‌تنهایی تضمینی برای افزایش رتبه سایت در گوگل نیست. کیفیت محتوا، سرعت سایت، لینک‌سازی و ابزارهای بررسی سئو سایت هم نقش مهمی دارن.

بعضی از قالب‌های وردپرسی تنظیمات مناسبی برای صفحه بلاگ دارن. اگه قالب سایتتون چنین امکاناتی نداره، می‌تونید از افزونه Blog Designer کمک بگیرید. قبل از نصب افزونه جدید هم بهتره از سایتتون نسخه پشتیبان بگیرید.

آیا افزونه Blog Designer هنوز انتخاب مناسبی هست؟

Blog Designer یک افزونه رایگان برای ساخت چیدمان صفحه بلاگ در وردپرس هست. طبق اطلاعات مخزن وردپرس در زمان بررسی این مقاله، نسخه رایگان افزونه ۱۵ قالب آماده و بیش از ۱۰ هزار نصب فعال داره.

آخرین نسخه ثبت‌شده افزونه ۳.۱.۸ هست که در ۱۲ اوت ۲۰۲۴ منتشر شده. مخزن وردپرس همین‌طور هشدار می‌ده که افزونه با چند نسخه اصلی اخیر وردپرس آزمایش نشده. به همین دلیل، بهتره اون رو مستقیم روی سایت اصلی نصب نکنید و اول سازگاریش رو با نسخه وردپرس، PHP و قالب سایتتون روی یک محیط آزمایشی وردپرس Playground بسنجید.

رابط کاربری افزونه هم در نسخه‌های جدید تغییر کرده. به همین خاطر ممکنه نام یا جای بعضی گزینه‌ها با تصاویر قدیمی این آموزش کمی فرق داشته باشه. هر گزینه‌ای که در پنل شما دیده نمی‌شه، ممکنه به نسخه حرفه‌ای مربوط باشه یا در نسخه فعلی جابه‌جا شده باشه.

مهم‌ترین قابلیت‌هایی که صفحه رسمی افزونه معرفی می‌کنه شامل این موارده:

• ۱۵ چیدمان آماده در نسخه رایگان
• نمایش نوشته‌ها براساس دسته‌بندی، برچسب یا نویسنده
• تنظیم رنگ و ظاهر بخش‌های مختلف نوشته
• چیدمان واکنش‌گرا برای موبایل و تبلت
• امکان استفاده از بلوک گوتنبرگ یا شورت‌کد

نصب افزونه Blog Designer

اول وارد پیشخوان وردپرس بشید و از منوی «افزونه‌ها» روی «افزودن افزونه تازه» کلیک کنید. عبارت Blog Designer رو در کادر جست‌وجو بنویسید، افزونه رو پیدا کنید و بعد از بررسی نام سازنده و جزئیاتش، روی «هم‌اکنون نصب نمایید» و سپس «فعال نمایید» کلیک کنید.

اگه قبلاً افزونه‌ای نصب نکردید، راهنمای نصب افزونه در وردپرس همه مراحل رو ساده‌تر توضیح می‌ده.

بعد از فعال‌سازی، منوی مربوط به Blog Designer به پیشخوان اضافه می‌شه. چون رابط افزونه در نسخه‌های جدید تغییر کرده، نام دقیق زیرمنوها رو با نسخه‌ای که روی سایتتون نصب شده تطبیق بدید. اگه مسیرهای تصاویر این مقاله با پنل شما یکی نیست، از گزینه‌های فعلی پنل خودتون استفاده کنید و تنظیم ناشناخته‌ای رو بدون بررسی تغییر ندید.

ساخت صفحه بلاگ با بلوک گوتنبرگ

گوتنبرگ همون ویرایشگر بلوکی وردپرسه که هر بخش صفحه رو به‌شکل یک بلوک جدا نشون می‌ده. برای ساخت صفحه بلاگ، از منوی «برگه‌ها» روی «افزودن برگه تازه» کلیک کنید و یک عنوان مثل «بلاگ» برای برگه بنویسید.

حالا روی دکمه افزودن بلوک با علامت «+» کلیک کنید و عبارت Blog Designer رو جست‌وجو کنید. اگه بلوک اختصاصی افزونه در نسخه نصب‌شده در دسترس باشه، اون رو به برگه اضافه کنید. تنظیمات چیدمان، تعداد نوشته‌ها و فیلترهای موردنیاز رو از پنل کناری ویرایشگر مشخص کنید. باید به صفحه تنظیمات افزونه برگردید. که در ادامه بهش میپردازیم.

در پایان، پیش‌نمایش برگه رو ببینید. ظاهر صفحه رو هم در دسکتاپ و هم در موبایل بررسی کنید و وقتی از نتیجه مطمئن شدید، برگه رو منتشر کنید.

ساخت صفحه بلاگ با شورت‌کد

شورت‌کد یک کد کوتاه داخل کروشه هست که خروجی افزونه رو در یک برگه نمایش می‌ده. اگه نمی‌خواید از بلوک اختصاصی استفاده کنید یا بلوک افزونه در ویرایشگر دیده نمی‌شه، یک برگه تازه بسازید و بلوک «کد کوتاه» رو به اون اضافه کنید.

شورت‌کد زیر رو داخل بلوک قرار بدید:

[wp_blog_designer]

بعد برگه رو پیش‌نمایش کنید. اگه چیزی نمایش داده نمی‌شه، مطمئن بشید افزونه فعاله، نوشته منتشرشده دارید و فیلتر دسته‌بندی یا نویسنده طوری تنظیم نشده که همه نوشته‌ها رو کنار بذاره.

تنظیم ظاهر صفحه بلاگ

اسم و جای گزینه‌های زیر ممکنه در نسخه فعلی افزونه تغییر کرده باشه. این بخش معنی گزینه‌ها رو توضیح می‌ده تا وقتی مورد مشابهی رو در پنل دیدید، بدونید چه کاری انجام می‌ده.

تنظیمات عمومی

• Select Blog Layout: چیدمان ظاهری نوشته‌ها رو انتخاب می‌کنه.
• Select Page for Blog: برگه‌ای رو مشخص می‌کنه که قراره بلاگ در اون نمایش داده بشه.
• Number of Posts to Display: تعداد نوشته‌های هر صفحه رو تعیین می‌کنه.
• Select Post Categories: مشخص می‌کنه نوشته‌های کدوم دسته‌ها نمایش داده بشن.
• Select Post Tags: نوشته‌ها رو براساس برچسب فیلتر می‌کنه.
• Select Post Authors: بهتون اجازه می‌ده نوشته‌های نویسنده‌های مشخصی رو نمایش بدید.
• Display Settings: جزئیات قابل‌نمایش مثل تاریخ، نویسنده یا تصویر شاخص رو کنترل می‌کنه؛ گزینه‌های دقیق این قسمت به نسخه افزونه بستگی دارن.

تنظیمات چیدمان و رنگ

• Main Container Class Name: برای وارد کردن کلاس CSS دلخواه کاربرد داره. CSS همون کدی هست که ظاهر بخش‌های سایت رو تغییر می‌ده. اگه با CSS آشنا نیستید، این کادر رو خالی بذارید.
• Blog Posts Template Color: رنگ اصلی قالب نوشته‌ها رو مشخص می‌کنه.
• Choose Link Color: رنگ لینک‌ها رو تغییر می‌ده.
• Choose Link Hover Color: رنگ لینک رو وقتی نشانگر ماوس روی اون قرار می‌گیره مشخص می‌کنه.

تنظیمات عنوان نوشته

• Post Title Color: رنگ عنوان نوشته‌ها رو تعیین می‌کنه.
• Post Title Background Color: رنگ پس‌زمینه عنوان رو تغییر می‌ده.
• Font Size: اندازه نوشته عنوان رو مشخص می‌کنه.

بعضی تنظیمات پیشرفته ممکنه فقط در نسخه حرفه‌ای فعال باشن. قبل از خرید، صفحه رسمی محصول و تفاوت نسخه رایگان و حرفه‌ای رو بررسی کنید؛ چون امکانات و قیمت می‌تونن تغییر کنن.

تنظیمات محتوای نوشته

• For Each Article in a Feed, Show: مشخص می‌کنه متن کامل نوشته دیده بشه یا فقط خلاصه اون.
• Post Content Length: تعداد کلمه‌های خلاصه هر نوشته رو تعیین می‌کنه.
• Display HTML Tags with Summary: تعیین می‌کنه کدهای HTML داخل خلاصه نگه داشته بشن یا نه. اگه با این گزینه آشنا نیستید، بهتره حالت پیش‌فرض رو تغییر ندید.
• Post Content Color: رنگ متن خلاصه نوشته‌ها رو عوض می‌کنه.
• Read More Settings: متن و ظاهر لینک «ادامه مطلب» رو تنظیم می‌کنه.
• Typography Settings: تنظیمات ظاهر نوشته، مثل اندازه و نوع فونت، رو در اختیارتون می‌ذاره.
• Media Settings: نمایش تصویر شاخص و رسانه‌های مربوط به نوشته رو کنترل می‌کنه.

تنظیمات اشتراک‌گذاری

• Social Share: دکمه‌های اشتراک‌گذاری نوشته‌ها رو فعال یا غیرفعال می‌کنه.
• Shape of Social Icon: شکل آیکون‌های شبکه‌های اجتماعی رو مشخص می‌کنه.
• Social Share Links Settings: شبکه‌های اجتماعی قابل‌نمایش رو انتخاب می‌کنه.

بعد از ذخیره تنظیمات، صفحه بلاگ رو دوباره باز کنید و نتیجه رو ببینید. اگه از شورت‌کد استفاده کردید، مطمئن بشید [wp_blog_designer] داخل بلوک «کد کوتاه» قرار گرفته و برگه هم منتشر شده.

نکات مهم قبل از انتشار صفحه بلاگ

• افزونه رو اول روی سایت آزمایشی بررسی کنید؛ چون صفحه مخزن درباره سازگاری اون با نسخه‌های جدید وردپرس هشدار می‌ده.
• صفحه بلاگ رو در موبایل، تبلت و دسکتاپ ببینید تا عنوان‌ها و تصاویر از کادر بیرون نزنن.
• تعداد نوشته‌های هر صفحه رو خیلی زیاد نکنید تا صفحه سنگین نشه.
• تصاویر شاخص نوشته‌ها رو هم‌اندازه و کم‌حجم انتخاب کنید.
• بعد از تغییر چیدمان، لینک نوشته‌ها و دکمه «ادامه مطلب» رو آزمایش کنید.
• برای بهتر شدن نتیجه سئو، فقط به ظاهر صفحه تکیه نکنید. مطالب قدیمی سایت رو به‌روزرسانی کنید و کیفیت محتوا رو هم جدی بگیرید.

جمع‌بندی

Blog Designer هنوز برای ساخت یک صفحه بلاگ ساده بدون کدنویسی قابل‌استفاده هست، ولی فاصله طولانی از آخرین به‌روزرسانی باعث می‌شه آزمایش اون قبل از استفاده روی سایت اصلی ضروری باشه. اگه افزونه با قالب یا نسخه وردپرس شما سازگار نبود، بهتره از امکانات خود قالب یا یکی از افزونه‌های ویرایش صفحه وردپرس برای طراحی صفحه بلاگ کمک بگیرید.

تیم تولید محتوا

ما در تیم تولید محتوای میهن وردپرس در تلاش هستیم تا بهترین مقالات آموزشی در زمینه وردپرس و کسب‌و‌کارهای اینترنتی را تهیه کنیم. صحت محتوای این صفحه توسط رضا راد بررسی خواهد شد.