ترفند: آموزش ایجاد سایدبار شناور با استفاده از المنتور

Share

اشتراک گذاری در telegram
اشتراک گذاری در whatsapp
اشتراک گذاری در facebook
اشتراک گذاری در twitter
اشتراک گذاری در linkedin
اشتراک گذاری در email
اشتراک گذاری در print
سایدبار شناور با المنتور

بعد از طراحی سایدبار، یکی از ویژگی هایی که شاید کاربران به آن نیاز داشته باشند، سایدبار شناور یا چسبان می باشد. ما در این آموزش قصد داریم تا با استفاده از افزونه جانبی Elementor Extras بخش سایدبار را به صورت شناور طراحی کنیم.

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

طراحی سایدبار شناور (چسبان) با استفاده از المنتور

در مرحله اول ابتدا به تنظیمات افزونه Elementor Extras رفته و گزینه Sticky Elements یا المنت های شناور را روشن کنید.

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

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

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

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

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

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

خب حالا باید به تنظیمات بخش داخلی بریم و در تب پیشرفته، در تنظیمات افزونه Elementor Extras گزینه شناور را روشن کنیم.

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

بعد از روشن کردن گزینه شناور، تنظیمات را به شکل زیر وارد کنید.

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

معرفی فیلد های مختلف

ماندن

مادر: فقط در ستون اصلی که قرار دادرد شناور می شود.

بدنه برگه: از بالا تا انتهای صفحه شناور می شود. با روشن بودن این گزینه ممکن سایدبار به زیر فوتر برود.

غیز چسبنده

موبایل و تبلت: با قرار دادن روی این گزینه، سایدبار در موبایل و تبلت شناور نخواهد بود.

فقط موبایل: با قرار دادن روی این گزینه، سایدبار فقط در موبایل شناور نخواهد بود.

افست

افست بالا: فاصله حالت چسبنده از سربرگ هنگام اسکرول

افست پایین: فاصله حالت چسبنده از پایین هنگام رسیدن به فوتر

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

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

 

در نهایت می توانید نمونه طراحی شده با استفاده از افزونه المنتور و افزونه جانبی Elementor Extras را مشاهده کنید.

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

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

دانلود سایدبار شناور

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

امتیاز دهید

اشتراک گذاری

اشتراک گذاری در telegram
اشتراک گذاری در whatsapp
اشتراک گذاری در facebook
اشتراک گذاری در twitter
اشتراک گذاری در linkedin
اشتراک گذاری در email

آخرین مقالات

آخرین محصولات

آخرین محصولات

برچسب ها

لینک کوتاه

https://elementorfa.ir/?p=17720

نظرات ارزشمند خود را به اشتراک بگذارید

بیست + پانزده =

نیاز به کمک دارید؟ پیام دهید
  • بازگشت به کتابخانه