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

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

آموزش ایجاد سایدبار شناور در المنتور پرو

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

ما میتوانیم با قرار دادن سایدبار چسبان در سایت این مشکل را رفع کنیم تا هر کاربری وارد سایت می شود مطالب مهم را در این سایدبار نمایش دهیم که این موارد میتواند تبلیغات ، فهرست مطالب و یا مطالب و صفحات مهم دقیقا همانند سایت ما المنتورسایت قرار داده شود .

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

قدم اول : ایجاد طرح کلی

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

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

قدم دوم: اضافه کردن محتویات سایدبار

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

قدم سوم: فعالسازی چسبندگی

مهم ترین بخش این آموزش همین مرحله می باشد. در این مرحله کانتینر یا بخش داخلی که میخواهید حالت شناور داشته باشد را انتخاب کنید. در تب پیشرفته، قسمت موشن افکت، بخش چسبندگی (sticky) به صورت پیش فرض روی هیچ تنظیم شده، برای سایدبار شناور ما روی بالا قرار میدهیم.

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

قدم چهارم : تنظیمات سایدبار شناور

زمانی که چسبندگی روی حالت بالا یا پایین تنظیم می شود. آیتم هایی برای تنظیمات حالت شناور یا Sticky ظاهر می شوند.

توضیحات تنظیمات حالت شناور

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

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

Anchor offset: اگر لینکی که کاربر روی آن کلیک میکند زیر این سایدبار شناور قرار بگیرد با مقداردهی به این گزینه میتوانید این فاصله را کنترل کنید و مانع از پنهان شدن هدف لینک زیر بخش چسبان شوید.

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

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

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