روشهای مختلفی برای ساخت سایدبار شناور چسبنده Floating Sticky sidebar در المنتور وردپرس وجود دارد، اما مشکل وقتی آغاز میشود که ارتفاع سایدبار از ارتفاع صفحه نمایش بیشتر باشد.
در این حالت شکل درست این است که سایدبار در هنگام اسکرول به پایین ابتدا همگام با بخش اصلی نوشته به صورت شناور به پایین اسکرول شود و سپس وقتی انتهای سایدبار نمایان شد ، دیگر به صورت چسبیده و ساکن دیده شود.
کلاً این قضیه برای این است که در صورت چسبنده نبودن سایدبار، هنگامی که متن اصلی طولانی میباشد، پس از اسکرول به پایین و به انتهای ساید بار رسیدن ، در کنار متن اصلی در ادامه قسمت خالی سفیدی باقی میماند که از لحاظ طراحی جالب نیست.
با ما همراه باشید تا با نصب افزونه JetSticky For Elementor و تنظیمات مربوط به آن این مشکل المنتور را برطرف کنید.
فهرست
نصب افزونه JetSticky For Elementor برای ساخت سایدبار چسبنده
ابتدا مطمئن شوید که المنتور خود را به آخرین نسخه آپدیت کرده اید ، سپس افزونه JetSticky For Elementor را نصب و آن را فعال نمایید.
JetSticky افزونه ای است که اجازه می دهد تا بخش ها و ستون های ساخته شده با المنتور را چسبناک و شناور کرده تا هنگام بالا و پایین رفتن صفحه ، آنها همیشه در معرض دید شما قرار دهد.
این پلاگین برای ایجاد سایدبار ، هدر و بلوک های چسبنده مناسب است و علاوه بر چسبنده کردن بخش ها، به ستون های المنتور نیز میتواند خاصیت چسبندگی بدهد که در نسخه اصلی المنتور همچنین قابلیتی وجود ندارد.
نحوه کارکرد افزونه ساخت سایدبار چسبنده شناور در المنتور
افزودن خاصیت چسبندگی به یک بخش در المنتور
- به صفحه ویرایشگر المنتور بروید
- گزینه ویرایش بخش را برای یکی از بخش ها یا سایدباری که می خواهید خاصیت چسبندگی را به آنها اعمال کنید ، کلیک کنید.
- تنظیمات پیشرفته را باز کرده و در آنجا گزینه Sticky Section را در بلوک Jet Sticky فعال کنید.
پس از آن به بسیاری از تنظیمات دسترسی خواهید داشت که امکان تغییر شکل بخش را هنگام پیمایش صفحه به سمت بالا یا پایین فراهم می کند.
ویژگی های اصلی برای اثر بخش مهم:
- قابلیت Sticky Section Visibility – بسته به نیاز شما باعث می شود تا این قسمت در دسکتاپ ، تبلت یا موبایل چسبناک باشد.
- Z-index – فرصتی را برای افزودن عمق به محتوا فراهم می کند و باعث می شود بخش همیشه در بالا یا پشت برخی از عناصر در صفحه نشان داده شود.
- استایل های بخش چسبنده – شامل چندین تنظیم سبک برای بخش چسبنده است که به شما امکان تغییر مقادیر عرض بخش ، فاصله گذاری، نوع پس زمینه و غیره را می دهد.
- مدت زمان انتقال – امکان تغییر زمان انتقال بخش را فراهم می کند.
ساخت ستون سایدبار چسبنده شناور در المنتور
برای استفاده از گزینه چسبندگی برای ستون و سایدبار باید:
- به صفحه ویرایشگر المنتور بروید ؛
- گزینه ویرایش ستون را برای یکی از ستونهایی که می خواهید جلوه چسبنده شناور را روی آن اعمال کنید ، کلیک کنید.
- تنظیمات پیشرفته را باز کنید و در در بلوک Jet Sticky گزینه Sticky Column را فعال کنید.
پس از فعال شدن ، قادر خواهید بود مقادیر فاصله بالا و پایین را تغییر دهید و انتخاب کنید که این اثر فقط روی نسخه دسکتاپ، تبلت یا تلفن همراه نمایش داده شود.
اگر احیاناً پس از نصب و تنظیمات افزونه که در بالا ذکر شد با مشکلی در این زمینه برخورد کردید ، احتمال دارد که از تداخل با افزونه یا تنظیمات دیگری در المنتور صفحه مدنظر باشد.
برای رفع آن یک صفحه قالب جدید در المنتور ایجاد نموده و ابتدا چسبنده بودن بخش مدنظر خود را راه اندازی و تست نمایید.
سپس سایر اجزای صفحه را با المنتور مرحله به مرحله اضافه کنید تا بخشی که تداخل ایجاد کرده مشخص گردد.
امیدواریم که این مطلب که توسط تیم طراحی سایت تهران وب سئو ایجاد شده است، برای شما مفید واقع شود و کمک کند تا ظاهر زیباتر و حرفه ای تری برای سایت خود ایجاد کنید.
یک دیدگاه
واقعا مطلب مفیدی بود.