ویجت off-canvas در المنتور

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

نحوه کار کرد قابلیت off-canvas را میتوانید در سایت بوت استرپ ببنید

موارد استفاده از ویجت off-canvas

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

نحوه استفاده از ویجت off-canvas در المنتور

نکته: جهت استفاده از ویجت off canvas در المنتورپرو باید حتما ویژگی کانتینر فلکس باکس را در تنظیمات المنتور فعال کنید (که البته به صورت پیش فرض در نسخه های جدید فعال است).

• در قدم اول باید ویجت زیر را در ویرایشگر المنتور قرار دهید.

با اضافه کردن off-canvas به ویرایشگر المنتور مشاهده می کنید که به صورت اتوماتیک یک کانتینر ساخته می شود . می توانید آیتم های دلخواه جهت قرارگیری در داخل پنجره را در بخش مشخص شده در تصویر زیر اضافه کنید.

زمانی که editing mode فعال است؛ علاوه بر آیتم های داخل پنجره این امکان وجود دارد که تنظیمات خود off-canvas را نیز سفارشی کنید. موقعیت افقی و عمودی پنجره، عرض و ارتفاع، استایل پنجره و همچنین تنظیمات نحوه بسته شدن و اجرای انیمیشن در هنگام ورود و خروج از جمله تنظیماتی است که در این بخش وجود دارد.

• زمانی که کار طراحی پنجره off-canvas تمام شد، میتوانید دکمه editing mode را خاموش کنید تا پنجره بسته شود.

• حالا باید از هر ویجتی که می تواند لینک داشته باشد برای فعالسازی off-canvas استفاده کنید. مثلا ما در اینجا از یک دکمه استفاده می کنیم. در تنظیمات ویجت بخش پیوند باید روی برچسب های پویا کلیک کرده و از منویی که باز می شود off-canvas را انتخاب کنید.

• در مرحله بعد با کلیک روی قسمت مشخص شده در تصویر می توانید نام پنجره off-canvas و عملی که قصد دارید با کلیک روی دکمه روی پنجره انجام شود را انتخاب کنید.

در لیست کشویی روبروی عمل گزینه open off-canvas باعث باز شدن پنجره، close off-canvas و off-canvas toggle  باعث تغییر وضعیت باز و بسته بودن پنجره می شود. در لیست کشویی دومی باید نام off-canvas مورد نظر خود را انتخاب کنید، اگر چندین پنجره در صفحه داشته باشید به صورت خودکار از off-canvas1نامگذاری می شود. البته نام ویجت در تنظیمات قابل تغییر است.

• در این مرحله کار طراحی و فعالسازی off-canvas به پایان رسیده و با کلیک روی دکمه پنجره باز می شود.