طراحی قالب پست وبلاگ با المنتور

ساخت قالب پست وبلاگ با المنتور
به اشتراک گذاری بر روی twitter
به اشتراک گذاری بر روی facebook
به اشتراک گذاری بر روی telegram
به اشتراک گذاری بر روی whatsapp
به اشتراک گذاری بر روی email

چکیده مقاله

همانطور که در مطالب قبلی مشاهده کردید توانستیم با المنتور هدر و فوترهای زیبایی را ایجاد کنیم. شما همچنین نسخه المنتور پرو می توانید یک قالب پست وبلاگ ایجاد کنید و نوشته های وبلاگ را با یک طراحی جدیدتر به نمایش بگذارید. با ما همراه باشید تا نحوه انجام این کار را به شما نشان دهیم.

ساختن قالب پست وبلاگ با المنتور چه مزیت های دارد؟

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

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

طراحی قالب پست وبلاگ با المنتور

1- یک قالب المنتور جدید ایجاد کنید

به مسیر المنتور – Elementor > قالب ها – Templates بروید و روی افزودن جدید – Add New کلیک نمایید. سپس در قسمت نوع قالب Single را انتخاب کنید و در قسمت نوع پست نوشته را انتخاب نمایید و در کادر آخر یک نام برای قالب خود وارد کرده و روی دکمه ایجاد قالب کلیک نمایید.

ساخت قالب پست وبلاگ با المنتور

در مرحله بعد المنتور از شما سوال می پرسید که آیا می خواهید از قالب های از پیش طراحی شده استفاده نمایید.
حالا شما می توانید از دو طریق عمل کنید و آن هم یا از قالب های آماده استفاده کنید و یا اینکه خودتان یک قالب طراحی کنید. ما در این اموزش قصد داریم تا قالب رو خودمان ایجاد کنیم اما در صورتی که می خواهید از قالب آماده استفاده کنید قالب مورد نظر خود را انتخاب کرده و روی گزینه درج- insert کلیک نمایید.

قالب نوشته وبلاگ المنتور
سپس قبل از اجرای آن یک پیش نمایش از پست های خود را مشاهده نمایید برای اینکار روی آیکون چشم در گوشه سمت راست پانل کلیک نموده و گزینه تنظیمات – Settings را انتخاب نمایید.

تنظیمات قالب پست وبلاگ المنتور

در تنظیمات پیش نمایش “Preview Dynamic Content as” را روی نوشته – post بگذارید و در قسمت بعدی یکی از پست های خود را انتخاب نمایید.

پیش نمایش پست وبلاگ

اما قبل از اینکه به نحوه ساخت قالب پست وبلاگ بپردازیم. نگاهی گذرا به ساختار یک قالب نوشته بیاندازیم.

a: بخش هدر
b: بخش بدنه پست
C: بخش نظرات

قسمت های مختلف یک قالب پست وبلاگ
ما در اینجا این سه بخش اساسی را ایجاد می کنیم تا برای شما گیج کننده نباشد اما شما می توانید موارد دیگری مانند مطالب مرتبط و … را به صفحه نوشته اضافه نمایید.

2-ساخت بخش هدر پست های وبلاگ

بخش هدر شامل عناصر مختلفی است که مهمترین آن ها عبارتند است از:
عنوان پست
کادر نویسنده – تصویر و درباره نویسنده
خلاصه پست – تاریخ انتشار و دسته بندی
تصویر شاخص پست
اضافه کردن هرکدام از این بخش ها بسیار ساده است. برای شروع یک بخش جدید – section ایجاد کنید.

ایجاد یک بخش جدید در المنتور

تنظیمات بخش عرض محتوا را به حالت جعبه ای – Boxed و عرض محتوا را به 960 پیکسل مثل تصویر زیر تغییر بدهید. در صورتی هم که خواستید رنگ پس زمینه را تغییر بدهید می توانید به بخش استایل – Style رفته و در آنجا آن را سفارشی سازی کنید.

تنظیمات طرح بندی المنتور

قرار دادن عنوان پست در المنتور

در مرحله نخست عنوان پست را به قالب پست وبلاگ خود اضافه می کنیم به این منظور از میان ابزارک ها، عنوان پست – post Title را انتخاب کرده و آن را به صفحه بکشید.

Post title settings

تنظیمات آن را هم به صورت زیر در آورید :
تب محتوا – Content: چیدمان در حالت راست
تب استایل – Style tab: رنگ متن سیاه
تب استایل – Style: تایپو گرافی: سایز – 65px ، وزن فونت – 600( برای فونت های مختلف متغییر خواهد بود)
در مرحله بعد یک جدا کننده ساده اضافه می کنیم تا مقداری فاصله بین عنوان و سایر قسمت ها وجود داشته باشد.

جدا کننده برای ساخت پست وبلاگ المنتور

تنظیمات جدا کننده را به حالت زیر تنظیم کنید.
تب محتوا : استایل یک پارچه ، عرض 5px، چیدمان راست
تب استایل: رنگ سیاه ، وزن فونت 10px T ، فاصله 15px

تنظیمات جدا کننده المنتور

قرار دادن اطلاعات نویسنده، توضیحات و تصویر شاخص

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

اضافه کردن ستون در المنتور

تنظیمات ستون را در بخش طرح بندی > ساختار روی حالت 33.66 قرار بدهید.

تنظیمات قالب پست وبلاگ

اولین ستون سمت چپ جای است که ما در آن کادر نویسنده رو قرار می دهیم. برای اینکار ابزارک محتوای به نام Author Box را پیدا کرده و آن را به اولین ستون کشیده و رها کنید.

جعبه نویسنده المنتور

تنظیمات این بخش را به شکل زیر در آورید.

 

تنظیمات جعبه نویسده المنتور

برای متای پست، از یک ابزارک به نام Post Info استفاده خواهیم کرد. آن را انتخاب کرده و در زیر کادر نویسنده قرار بدید.

 

اطلاعات پست در المنتور

تنظیمات این بخش را هم به صورت زیر در آورید.

 

تنظیمات توضیحات پست در المنتور

در قسمت آخر باید یک تصویر شاخص اضافه کنیم برای اینکار ابزارک Featured Image را پیدا کرده و آن را در ستون بعدی قرار بدهید.

 

تصویر شاخص در المنتور

تنظیمات این بخش را هم به حالت زیر تنظیم کنید.

 

تنظیمات تصویر شاخص در المنتور

البته شما با توجه به تصویر شاخصی که برای پست های خود استفاده می نمایید می توانید اندازه های تصویر را تغییر بدهید.
در آخر کار بخش هدر به صورت زیر در خواهد آمد.

صفحه نوشته ساخته شده با المنتور

مرحله ساختن بخش بدنه پست

برای نمایش نوشته های پست باید از ابزارکی به نام Post Content استفاده نماییم. به این منظور این ابزارک را در پایین تصویر شاخص قرار بدهید.

ابزارک اطلاعات پست در المنتور

در صورت نیاز می توانید تنظیمات تایپوگرافی متن را تغییر بدهید و با تنظیم مواردی مانند فونت، اندازه ، وضوح و … خوانایی متن را افزایش دهید. شما همچنین می توانید در صورت نیاز دکمه های اشتراک گذاری را در بالای محتوای پست قرار بدهید به این منظور یک ستون جدید در بالای محتوای پست ایجاد کنید و آن را به دو بخش تبدیل نمایید.
• در ستون سمت راست ابزارک Share Buttons را قرار بدهید.
• در ستون سمت چپ هم ابزارک جدا کننده را قرار بدهید.
تنظیمات این بخش به صورت زیر است.

و در پایان این بخش به شکل زیر در خواهد آمد.

 

دکمه های اشتراک گذاری در المنتور

ساختن بخش نظرات وردپرس

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

a: جدا کننده

b: دکمه های اشتراک گذاری

c: جدا کننده

d: نظرات

 

Comments section

برای اینکار تنظیمات دکمه های اشتراک به صورت زیر می باشند.

برای اضافه کردن نظرات هم ابزارک Post Comments را به پایین جداکننده دوم اضافه نمایید.

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

طراحی قالب پست وبلاگ با المنتور

حالا که فرایند طراحی ما به پایان رسید وقتش رسیده که آن را ذخیره نماییم و به وردپرس بگوییم که برای چه پست های از این قالب استفاده نمایید.

فعال کردن صفحه نوشته در سایت

ابتدا روی دکمه انتشار – PUBLISH در گوشه سمت راست کلیک نمایید. پس از آن المنتور از شما می خواهید شرایط نمایش قالب جدید را تعیین نمایید. نگران نباشید همه این شرایط در چند ثانیه تعیین می شود. همچین می توانید از دکمه ADD CONDITION برای تعیین شرایط استفاده نمایید.

اضافه کردن شرایط برای پست وبلاگ المنتور

در صورتی که می خواهید قالب جدید شما به صورت کامل جایگزین قالب پیش فرض شود مراحل زیر را دنبال کنید.

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

 

تنظیمات همه پست ها

• در اینجا نحوه اختصاص دادن به دسته بندی خاص نمایش داده شده است.

اختصاص پست به یک دسته بندی خاص در المنتور

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

شرایط ترکیبی برای المنتور

با این امکان شما می توانید برای نیازهای مختلفی قالب های متنوعی ایجاد کنید. پس از تعیین همه شرایط روی دکمه SAVE&CLOSE کلیک نمایید. تا قالب شما براساس شرایطی که تعیین کردید فعال شود.

 

به اشتراک گذاری بر روی facebook
به اشتراک گذاری بر روی google
به اشتراک گذاری بر روی twitter
به اشتراک گذاری بر روی linkedin
به اشتراک گذاری بر روی telegram
به اشتراک گذاری بر روی whatsapp
به اشتراک گذاری بر روی email
به اشتراک گذاری بر روی print

دریافت مقالات ناب

مقالات شبیه مقالات بالا رو هر هفته میفرستیم به ایمیلتون

9 دیدگاه

  1. بابک

    سلام . مرسی بابت پست خوبتون. دوست عزیز من پست رو ندارم. چجوری باید اضافه کنم؟ المنتورم پرو هم هست. ورژن ۲.۳.۱ هست. فقط برگه هست و ۴۰۴

    1. مصطفی کردزنگنه

      باید المنتور پرو رد هم نصب کنید تا بتونیم صفحات ۴۰۴ و آرشیو محصول طراحی کنید

  2. محسن

    سلام من صفحه نوشته رو طراحی کردم ، ولی موقع نمایش ساید بار پیش فرض رو بهم نشون میده ، قالب من ژویپیتر هست
    المنتور هم نسخه پرو دارم
    در واقع میخوام بدون سایدبار و تامام عرزض باشه صفحه نوشته ها

  3. هاشم زاده

    دمت گرم عالی بود

    1. مصطفی کردزنگنه

      خواهش میکنم کانال یوتیوب رو دنبال کنین

  4. علی

    آقا دمتون گرم
    آموزشهاتون عالی هست
    ممنون از زحمات شما

    1. مصطفی کردزنگنه

      خواهش میکنم ممنون از دیدگاه تون و حمایتی که می کنین کانال یوتیوب رو برای دیدن آموز شهای ویدیویی دنبال کنین

  5. امیر

    سلام بعد از ایجاد قالب ، باید چیکارکنیم تا همه نوشته ها با این قالب ایجاد بشن؟

    1. مصطفی کردزنگنه

      باید قالبی که درست کردید رو روی کل نوشته ها اعمال کنین توی بخش تم بیلدر توی ویدیو های آموزشی المنتور توضیح دادم

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

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

× پشتیبانی آنلاین