طراحی سربرگ چسبنده با المنتور

Share

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

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

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

مواردی که در ادامه یاد میگیریم:

  • ایجاد سربرگ شفاف
  • انیمیشن های انتقال با استفاده از CSS
  • تغییر ارتفاع سربرگ هنگام اسکرول

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

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

 

سربرگ چسبان با المنتور

مرحله 2: در این مرحله طراحی سربرگ را انجام داده و طبق آموزش، شرایط نمایش را تنظیم کنید.

بخوانید : چگونه یک سربرگ سفارشی با المنتور بسازیم ؟

مرحله 3: روی بخش اصلی راست کلیک کرده و به تب پیشرفته بروید.

 

سربرگ چسبان با المنتور

 

تب پیشرفته

موشن افکت

شناور: برای چسبان بودن سربرگ یکی از گزینه های بالا و پایین را انتخاب کنید.

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

افست: تنظیم تعداد پیکسل هایی قبل از چسبان شدن سربرگ.

افکت افست: تنظیم تعداد پیکسل هایی قبل از نمیاش انیمیشن اسکرول

توجه : افکت افست فقط زمانی که از CSS سفارشی استفاده کرده باشید نمایش داده می شود.

CSS سفارشی

در زیر نمونه ای از پس زمینه، سربرگ شفاف و ارتفاع با انیمیشن را مشاهده می کنید. می توانید کد CSS زیر را در تب پیشرفته وارد کنید.

selector.elementor-sticky--effects{ background-color: rgba(133,130,255,0.5) !important }

selector{ transition: background-color 4s ease !important; }

selector.elementor-sticky--effects >.elementor-container{ min-height: 80px; }

selector > .elementor-container{ transition: min-height 1s ease !important; }
}

سربرگ چسبان با المنتور

 

امتیاز دهید

اشتراک گذاری

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

آخرین مقالات

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

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

برچسب ها

لینک کوتاه

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

Avatar
کیوان در 7:26 ب.ظ

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

پاسخ
المنتور فارسی
المنتور فارسی در 7:27 ب.ظ

با سلام
هیچ موردی رو نشون نمیده یا فقط سربرگ رو نشون نمیده؟

پاسخ

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

9 + 1 =

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