آیلین وب

دوستان عزیز، برای حمایت از ما حتما به ما رای بدهید​

با آموزش قدم به قدم ساخت سایدبار در المنتور در خدمت شما عزیزان هستم و میخوام که در این مقاله بهتون آموزش بدم که چطور با المنتور سایدبار طراحی کنید، چون در برخی از قالب ها سایدبار وجود ندارد و یا می خواهید یک سایدبار برای نوشته درست کنید میتوانید از این آموزش استفاده کنید و همچنین در دوره آموزش المنتور من این بخش رو برای شما نگفتم. 🤦‍♂️

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

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

elementor sidebar aylinweb 1 - آموزش قدم به قدم ساخت سایدبار در المنتور
طراحی بخش ستون کناری در افزونه المنتور

در ویرایشگر المنتور، روی دکمه + کلیک کنید (با پس زمینه قرمز در وسط صفحه نمایان است) و در قسمت ساختار، گزینه 6 از ردیف اول را انتخاب کنید. یعنی میخواهیم که ساید بار در سمت چپ صفحه باشد.

elementor sidebar aylinweb 2 - آموزش قدم به قدم ساخت سایدبار در المنتور
قرار گرفتن ستون کناری در صفحه

با این کار صفحه ما به 2 قسمت تشکیل می شود که یک ستون 70% از صفحه رو تشکیل داره و یک ستون هم 30%، در ستون 70% باید محتویات نوشته ها قرار بگیرد و در سمت چپ هم که 30% از صفحه رو گرفته، همون ستون کاری یا سایدبار قرار میگیرد. (یعنی ما باید ساید بار رو در سمت چپ طراحی بکنیم).

elementor sidebar aylinweb contents - آموزش قدم به قدم ساخت سایدبار در المنتور
بخش محتویات نوشته های المنتور

از لیست ابزارک های بالا برای ساخت بخش محتوای نوشته استفاده کنید.(ما در زیر این بخش رو از قبل طراح کردیم و جزء آموزش در این جلسه نیست پس شما هم میتوانید از این ویدجت ها کمک بگیرید و مثل تصویر زیر بخش محتوای خودتون رو طراحی کنید).

elementor sidebar aylinweb 4 - آموزش قدم به قدم ساخت سایدبار در المنتور
ساخت بخش محتوا در کنار ستون کناری

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

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

elementor sidebar aylinweb 8 - آموزش قدم به قدم ساخت سایدبار در المنتور
قرار دادن بخش پست ها در المنتور

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

elementor sidebar aylinweb 5 - آموزش قدم به قدم ساخت سایدبار در المنتور
تنظیمات پست ها در المنتور

بعد از انجام دادن تنظیمات باید بخش پست ها در سایدبار به شکل زیر باشد.

elementor sidebar aylinweb 9 - آموزش قدم به قدم ساخت سایدبار در المنتور
نمایش پست های جدید در المنتور

خب دوستان این ابزاک تموم شد و در ادامه میخواهیم تا شبکه های اجتماعی رو به سایدبار اضافه کنیم. برای این کار باید به بخش ابزارک ها یا ویدجت ها برید و دکمه های اشتراک گذاری را انتخاب و به سایدبار اضافه کنید یعنی زیر پست ها.

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

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

elementor sidebar aylinweb 10 - آموزش قدم به قدم ساخت سایدبار در المنتور
سفارشی سازی بخش ستون کناری در المنتور

بعد از اینکه ساید بار رو سفارشی و شخصی سازی کردید همانند تصویر زیر، باید صفحه رو ذخیره کنیم.

elementor sidebar aylinweb 11 - آموزش قدم به قدم ساخت سایدبار در المنتور
تصویر نهایی ساخت سایدبار در المنتور

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

3 دیدگاه دربارهٔ «آموزش قدم به قدم ساخت سایدبار در المنتور»

  1. سلام من یه ساید بار مثل سایت شرکت بنز میخوام درست کنم چطور باید اونطور طراحی کنم با کمک چه افزونه ای؟

  2. با سلام
    من دو ستون کنار هم دارم ک معمولا مواردی ک تو یکی نمایش داده میشه کمتر یا بیشتر از ستون کنارشه و اون ستونی ک موارد کمتر داره کش میاد و ی فضای خالی ایجاد میکنه ک خوشایند نیس
    چطور میتونم ستون کناریم رو ب نحوی تنظیم کنم ک فقط ب اندازه محتویاتش ارتفاع داشته باشه؟

دیدگاه‌ خود را بنویسید

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

پیشنهاد میکنیم این مقالات را هم بخوانید
ساخت بخش دانلود به ازای دریافت ایمیل یا موبایل با المنتور + ویدئوی آموزشی

ساخت بخش دانلود به ازای

با یک مقاله و آموزش بسیار مفید و اختصاصی از تیم آیلین

ارسال لینک دانلود به ایمیل در وردپرس با افزونه subscribe & download + ویدئوی آموزشی

ارسال لینک دانلود به ایمیل

با معرفی افزونه subscribe & download با ما همراه باشید،  یا همان ارسال

قالب Astra Pro : قالب

قالب Astra Pro | قالب آسترا مخصوص افزونه المنتور بعد از مدتها

ساخت استایل منوی اپلیکیشن موبایل با المنتور

ساخت استایل منوی اپلیکیشن موبایل

در این مقاله بسیار مفید می خوام که نحوه ساخت یک استایل

مطالب داغ
اسکرول به بالا
طراحی انواع سایت
طراحی انواع سایت با قیمت بسیار ارزان!