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

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

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

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

از مسیر پیشخوان> المنتور> تنظیمات> ویژگی ها

• کانتینر فلکس باکس (flexbox)

• عناصر تودرتو (Nested Elements)
• فهرست (menu)

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

در بخش تنظیمات فهرست جدید المنتور می توانید آیتم یا آیتم های جدید ایجاد کرده و تنظیم کنید که به صورت بازشو یا “drop down” قرار بگیرند و در زیرمجموعه هر یک از این آیتم ها )مثل تصویر زیر( می توانید کانتینر و ویجت های مجزا برای ساخت یک منوی پیشرفته قرار دهید.

لیست افزونه مگامنو در وردپرس

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

Crocoblock  ( JetMenu )

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

لینک دانلود جت منو

منوی پیشرفته با Premium Addons

با کمک افزونه premium addons منوهای چند سطحی بسازید که با هاور یا کلیک باز شوند یا حتی همیشه باز بمانند

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

نکته جذاب این است که حتی در نسخه رایگان افزونه premium addons هم می توانید از قابلیت این افزونه استفاده کنید.

دانلود نسخه رایگان افزونه premium addons 

دانلود نسخه پرو premium addons

منوی دیجی‌کالا با ElementsKit

این افزونه جانبی المنتوری نیز ویجت مگامنوی حرفه ای ارائه می کند. منوهای افقی، عمودی و پیچیده به آسانی و بدون کدنویسی با element kit قابل پیاده سازی است.

دانلود مستقیم افزونه المنت کیت

منوی چند ستونه با HappyAddons

مگامنوی افزونه Happy Addons جزو ویجت های نسخه پریمیوم این افزونه می باشد. اما با کمک آن می توانید منوی های چن سطحی مانند سایت های بزرگ مثل Dribbble و Adidas و Puma و یا هر سایت جذاب دیگری را به سادگی طراحی کنید.

دانلود افزونه هپی ادانز

منوی بازشو با The Plus

افزونه The Plus Addons for elementor یکی دیگر از افزونه های جانبی المنتوری است که ویجت مگامنو دارد. علاوه بر امکان ساخت منو افقی و عمودی، این ویجت قابلیت ایجاد Indicator را نیز فراهم کرده. اگر بخشی از مگامنو به راهنمای کوتاه یا tooltip نیاز دارد این ویژگی کمک کننده خواهدبود.

دانلود افزونه پلاس المنتور

ساخت مگامنو مشابه دیجی‌کالا با المنتور

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

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

قدم اول: فعالسازی ویژگی ها

گفتیم که برای استفاده از مگامنوی المنتور باید چند ویژگی را در تنظیمات المنتور فعال کنید (فلکس باکس، عناصر تو درتو و فهرست). با فعالسازی این ویژگی ها یک ویجت جدید به ویرایشگر المنتور اضافه می شود که برای ادامه کار به آن احتیاج داریم.

قدم دوم: تنظیمات ویجت مگامنوی المنتور

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

قدم سوم: پیاده سازی زبانه های مگامنو

برای این بخش می توانید از ویجت tabs المنتور پرو استفاده کنید. یک کانتینر بسازید و این ویجت را به زیرمنو اضافه کنید. به تعداد دلخواه زبانه برای هر دسته بندی کالا در وبسایت خود ایجاد کنید. مثل سایت دیجی کالا آیکون برای دسته بندی ها تعیین کنید. به هر زبانه تب می توانید ویجت های دلخواه اضافه کنید.

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

نکات کلیدی در بهینه‌سازی مگامنو برای سئو

• ریسپانسیو و بهینه سازی برای موبایل: مگامنوها اغلب منوهای چند سطحی و پیچیده هستند. بنابراین طراحان سایت را برای طراحی ریسپانسیو المنتور با چالش رو به رو میکند. شاید ترجیح دهید که منوی متفاوتی برای حالت موبایل ایجاد کنید اما دقت کنید که حتما شامل همان لینک ها باشد.
• رعایت ساختار سلسله مراتبی : یکی از جاهایی که مگامنوها بسیار کاربردی هستند؛ سایت های فروشگاهی است. هنگام ایجاد سطوح مختلف منو باید به سلسله مراتب و دسته بندی محصولات توجه کنید و به صورت : دسته مادر> زیر دسته> محصول پیاده سازی کنید.
• انتخاب کلمه کلیدی مناسب برای دسته بندی ها: باتوجه به اینکه لینک های قرار گرفته در هدر شما مهم ترین لینک ها از نظر سئو هستند؛ کلمه کلیدی مناسب و ارزشمند برای دسته بندی های منو انتخاب کنید. ضمنا سعی کنید مفهومی و کوتاه باشند.