آموزش استفاده از Mega Menu

[محمدحسین میری 3,094]

با سلام و خسته نباشید خدمت دوستان

یک آموزش از طریقه کار با Mega Menu که برای بعضی از دوستان کمی مشکل بود تهیه کردم امیدوارم این آموزش به آنها کمکی بکند.

تقدیم به همه ی جومینــــ ا یی های گل

آموزش استفاده از Mega Menu :

در آخر این آموزش ما همچین منو ای با مگا منو خواهیم ساخت.

مقدمه :

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

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

نحوه ظاهری آن و امکانات آن بسیار آدم را شگفت زده می کند.

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

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

نحوه کار

گام اول :

به تنظیمات منو ها بروید

یک بخش را به عنوان والدین انتخاب کنید.

سه بخش که میخواهید زیر گروه آن بخش انتخاب شده باشند بسازید.

ما 3 بخش child item 1 | child item 2 | child item 3 را میسازیم

بعد منو سایت خود را مشاهده کنید که باید به شکل زیر باشد :

گام دوم :

به منو والدین بروید.

به بخش "" parameters (megamenu extended) "" بروید.

در بخش ستون ها (columns) عدد 3 را وارد کنید. به منظور تعداد ستون ها در منو

می توانید توضیحاتی را به برای منو وارد کنید که زیر عنوان منو به نمایش در میاد.

ذخیره کنید و به وبسایت بازگردید و نتیجه کارتون را مشاهده کنید که وقتی موس را روی منو والدین ببرید باید 3 منو که بصورت 3 ستون کنار هم قرار گرفته اند را ببینید.

مانند زیر :

گام سوم :

به منو ها »»یکی از منو های زیر شاخه ای که ساختید بروید.( به عنوان مثال child item 1).

به بخش parameters (پارامترها) ی آن بروید.

به بخش "" parameters (megamenu extended) "" بروید.

گزینه "" group"" (گروه) را روی "YES" (بلی) تنظیم کنید.

از بخش ""Submenu Content"" گزینه ی "Modules" را انتخاب کنید.

حال اگر ماژول به عنوان مثال لاگین را از همون تب کشویی انتخاب کنید ماژول لاگین در یکی از بخش های منوهایی که انتخاب کردید ظاهر خواهد شد و وقتی موس را روی گزینه والدین آن ببرید ماژول به نمایش در خواهد آمد. مانند :

اضافه کردن ماژول HTML سفارشی به بخش child item 2 :

اضافه کردن ماژول html سفارشی روش آن کمی با بخش قبل متفاوت است.

به

افزونه ها > مدیریت ماژول ها > جدید

بروید.

یک ماژول HTML دستی بسازید و یک فایل ویدویی درون آن قرار دهید. ( به عنوان مثال من از پلاگین JPlayer استفاده و یک ویدو را درون ماژول قرار دادم.)

یک موقعیت برای آن برگزینید. به عنوان مثال من utube را انتخاب کردم.

ذخیره کنید و به منوها بازگردید.

به منو child item 2 بازگردید.

به بخش parameters (پارامترها) ی آن بروید.

به بخش "" parameters (megamenu extended) "" بروید.

گزینه "" group"" (گروه) را روی "YES" (بلی) تنظیم کنید

از بخش ""Submenu Content"" گزینه ی "Modules positions" را انتخاب کنید.

حال از بخش " select positions " موقعیتی که برای ماژول HTML دستی انتخاب کردید برگزینید.

ذخیره کنید و به منو سایت خود نگاه کنید. زمانی که موس را روی منو Child item 2 ببریم می توانیم فیلم مورد نظر را ببینیم.

حال شما با این دو روش می توانید ماژول های مختلفی را در مگا منو به نمایش در بیاوردید.

در تصویر زیر ما تمام کارهایی که در آموزش گفته شد + یک ماژول دستی دیگه آماده ساخته شده است.

سایت اصلی سازنده آموزش :

http://www.ostraining.com

دانلود آموزش بصورت pdf

حجم : 461 kb

http://www.jmdownload.ir/download.php?filename=13467341121.zip

امیدوارم این آموزش به درد شما بخورد.

ارادتمند : سیدمحمدحسین میری