Cara Menambahkan Menu Mega ke WordPress (+5 Plugin Terbaik)

Diterbitkan: 2022-08-18

Menu memainkan peran penting dalam desain dan fungsionalitas situs web Anda. Mereka membantu pengunjung menavigasi di antara halaman Anda dan dapat meningkatkan kegunaan secara keseluruhan. Namun, ketika Anda memiliki banyak konten, mencari cara untuk menampilkannya tanpa terlihat ramai atau kacau bisa menjadi tantangan.

Di situlah menu mega masuk. Menu mega WordPress dapat memberikan situs web Anda tampilan yang lebih profesional dan membantu orang menemukan konten yang mereka cari dengan lebih mudah. Plus, ada beberapa metode yang dapat Anda gunakan untuk menambahkan satu ke situs web Anda.

Dalam posting ini, kami akan menjelaskan apa itu menu mega dan manfaat menggunakannya di WordPress. Kemudian kami akan memandu Anda melalui opsi Anda untuk membuatnya dan menjelajahi lima opsi plugin menu mega terbaik.

Apa itu menu mega di WordPress?

Menu WordPress Anda adalah struktur yang Anda gunakan untuk mengatur dan menampilkan halaman situs web Anda. Biasanya di bagian atas situs — meskipun bisa juga di samping atau ditampilkan dengan cara unik lainnya.

Untuk mengakses sistem menu bawaan, Anda dapat memulai dengan masuk ke situs WordPress Anda. Kemudian, dari dasbor admin Anda, navigasikan ke Appearance → Menus .

membuat menu di WordPress

Secara default, WordPress menggunakan menu standar, yang menampilkan daftar halaman, terkadang dengan dropdown satu kolom. Tidak ada informasi atau konten tambahan seperti gambar, deskripsi, dll. — ini hanya serangkaian daftar. Ini biasanya cukup sederhana dan lugas, tetapi membatasi Anda dalam hal jumlah halaman atau volume atau informasi yang dapat Anda sertakan. Berikut ini contoh dari WooCommerce:

Situs web WooCommerce dengan menu dropdown standar

Menu mega adalah jenis menu tarik-turun yang memungkinkan pengguna mengakses konten dalam jumlah besar di satu tempat. Menu mega sering digunakan di situs web eCommerce dan menjadi semakin populer di jenis lain juga. Anda dapat melihat contoh di situs Nalgene, yang menampilkan foto produk, bilah geser, dan konten lainnya dalam gaya horizontal:

contoh menu mega di situs Nalgene

Perbedaan utama adalah bahwa menu mega biasanya memiliki beberapa kolom konten, sedangkan menu drop-down tradisional hanya memiliki satu kolom. Ini memungkinkan menu yang jauh lebih kuat dan komprehensif, yang dapat sangat membantu di situs web dengan banyak informasi.

Mengapa menggunakan menu mega di WordPress?

Salah satu manfaat menggunakan menu mega adalah dapat mengurangi jumlah klik yang diperlukan untuk menavigasi ke bagian konten tertentu. Ini bagus untuk pengunjung yang mencari sesuatu yang spesifik di situs web Anda, tetapi juga meningkatkan pengalaman pengguna untuk pengunjung pertama kali dengan membantu mereka menjelajahi situs Anda secara lebih efisien.

Menu mega juga dapat digunakan untuk meningkatkan tampilan dan nuansa situs web Anda dan bahkan mempromosikan konten tertentu atau mendorong tindakan yang Anda inginkan agar dilakukan pengunjung. Plus, mereka sangat dapat dikustomisasi — sehingga mereka dapat memainkan sisa merek Anda untuk memberikan pengalaman yang mulus dan menarik secara visual.

Cara membuat menu mega WordPress

Ada beberapa cara berbeda untuk membuat menu mega di WordPress. Salah satu opsi adalah melakukannya secara manual, dengan menambahkan kode khusus. Opsi lainnya (lebih cepat dan lebih mudah) adalah menggunakan plugin. Mari kita lihat cara menambahkan menu mega ke WordPress menggunakan kedua metode ini.

Membuat menu mega secara manual (tanpa plugin)

Jika Anda merasa nyaman bekerja dengan file situs Anda, ini bisa menjadi pilihan yang baik untuk membuat sesuatu yang sangat unik.

Sebelum melakukan ini, penting untuk mencadangkan situs WordPress Anda. Anda mungkin juga mempertimbangkan untuk membuat situs pementasan untuk membangun dan menguji menu mega Anda sebelum meluncurkannya secara langsung. Ini akan membantu Anda menghindari masalah apa pun yang merusak fungsionalitas di situs langsung Anda.

Pertama, telusuri PenampilanMenu di dasbor WordPress Anda dan beri nama menu Anda.

membuat menu baru di WordPress

Klik tombol Buat Menu . Seret dan jatuhkan halaman yang ingin Anda sertakan dalam menu mega, beri indentasi sebagai submenu jika perlu.

menambahkan halaman ke menu mega

Setelah selesai, Anda dapat memilih Simpan Menu .

Selanjutnya, navigasikan ke File Manager cPanel Anda atau gunakan klien File Transfer Protocol (FTP) untuk terhubung ke file situs web Anda. Temukan stylesheet tema Anda dengan membuka / wp-content → /themes → /your-theme-or-child-theme → /style.css . Di bagian bawah, tambahkan baris kode berikut:

 .main-navigation ul:hover li ul, .main-navigation ul:hover li ul li ul { display: inherit; }

Ini akan membuat item sub-menu Anda muncul ketika seseorang mengarahkan kursor ke item tingkat atas. Sekarang, kami akan menyesuaikan kode untuk membuatnya sedikit lebih menarik secara visual, memastikan bahwa setiap item sub-level ditampilkan dalam lebar penuh, dengan bagian item muncul di samping satu sama lain. Tambahkan kode ini:

 .main-navigation { position: relative; } .main-navigation li { position: static; } .main-navigation ul li:hover ul { display: inherit; position: absolute; left: 0; right: 0; width: 100%; } .main-navigation ul li:hover ul li ul { display: inherit; position: relative; left: 0; } .main-navigation ul li:hover ul li { float: left; position: static; display: block; padding-top: 1em; } .main-navigation ul li:hover ul li ul li { float: none; padding-top: 0; }

Anda kemudian dapat bermain dengan gaya agar terlihat seperti yang Anda inginkan, sesuai dengan merek Anda dan seluruh situs Anda. Misalnya, Anda mungkin ingin mengganti warna latar belakang menu mega Anda atau menebalkan item tertentu. Anda mungkin juga ingin menyesuaikan jarak kolom atau menambahkan elemen tambahan seperti foto. Jika Anda seorang pengembang atau memiliki tingkat pengalaman kode, Anda dapat membuat menu mega agar terlihat seperti yang Anda inginkan!

Ingin panduan yang lebih mendalam? Tuts+ menawarkan panduan lengkap.

Opsi lain untuk membuat menu mega tanpa plugin adalah dengan memeriksa opsi bawaan tema Anda. Beberapa, seperti tema Hestia, menyertakan opsi menu mega secara default. Ini tidak selalu terjadi.

Membuat menu mega dengan plugin WordPress

Jika Anda tidak nyaman mengedit file situs Anda atau tema Anda tidak menawarkan opsi menu mega bawaan, metode lain yang dapat Anda gunakan untuk membuat menu mega di WordPress adalah dengan plugin. Ada banyak pilihan yang tersedia, yang akan kita bahas di bagian selanjutnya.

Meskipun ini adalah opsi yang lebih aman daripada membuatnya secara manual, Anda tetap harus mencadangkan situs WordPress Anda sebelum membuat perubahan apa pun.

Fitur dan fungsionalitas spesifik dari plugin akan bervariasi tergantung pada alat yang Anda putuskan untuk digunakan. Tapi secara keseluruhan, konsepnya akan sama.

Kami akan menggunakan Max Mega Menu sebagai contoh. Untuk memulai, Anda dapat menginstal dan mengaktifkan plugin di situs WordPress Anda.

Selanjutnya, Anda harus mengaktifkan fungsi mega menu dengan menavigasi ke AppearanceMenus . Anda dapat memilih lokasi yang diinginkan untuk menu Anda, lalu klik kotak di sebelah Aktifkan.

membuat menu mega dengan plugin

Simpan perubahan Anda setelah selesai. Untuk menyesuaikan tampilan dan pengaturan mega menu Anda, Anda dapat pergi ke Mega MenuMenu Themes .

menyesuaikan tampilan menu mega

Di sini, Anda akan menemukan berbagai opsi untuk menata menu. Anda dapat memodifikasi jenis menu serta tampilan dan fungsionalitasnya.

Lima plugin mega menu WordPress terbaik

Jika Anda memutuskan ingin menggunakan plugin WordPress mega menu, ada banyak opsi untuk dipilih. Saat Anda menelitinya, penting untuk mempertimbangkan fitur spesifik yang Anda cari serta anggaran Anda. Dengan mengingat hal itu, mari kita lihat lima plugin mega menu WordPress terbaik.

1. Menu Mega Maks

Beranda plugin Max Mega Menu

Max Mega Menu adalah plugin yang sangat populer yang memungkinkan Anda dengan mudah menambahkan menu berkualitas tinggi yang dapat disesuaikan ke situs WordPress Anda. Ini termasuk pembuat drag-and-drop yang mudah digunakan. Ini juga mendukung beberapa menu mega untuk berbagai lokasi di situs Anda.

Fitur utama Menu Max Mega:

  • Beberapa lokasi menu yang dapat dikonfigurasi secara individual
  • Pembuat tata letak kisi
  • Pilihan menu hover dan transisi
  • Pembuat drag-and-drop
  • Kode pendek
  • Ikon item menu
  • Kotak pencarian
  • logo menu

Kelebihan Menu Max Mega:

  • Ada opsi gratis dan premium yang tersedia.
  • Ringan, dengan kode bersih.
  • Ini termasuk dukungan untuk WooCommerce dan Unduhan Digital Mudah.
  • Anda dapat menempatkan menu mega di beberapa lokasi.
  • Widget memungkinkan Anda menambahkan peta, formulir kontak, dan banyak lagi.
  • Anda juga dapat membuat menu mega dari awal atau menggunakan menu yang ada.
  • Navigasi keyboard membuat aksesibilitas lebih baik.

Kontra dari Max Mega Menu:

  • Opsi penyesuaian lanjutan hanya tersedia dengan lisensi pro.
  • Tidak ada uji coba gratis untuk paket premium.

Kemudahan penggunaan :

Max Mega Menu sangat mudah digunakan. Secara otomatis mengubah menu yang ada menjadi menu mega. Ini memiliki antarmuka yang ramah pengguna yang mudah dinavigasi. Lisensi pro juga mencakup pembaruan dan dukungan prioritas.

Harga :

Max Mega Menu menawarkan versi gratis dengan opsi penyesuaian terbatas. Paket Pro dengan fitur-fitur canggih mulai dari $29 untuk satu lisensi situs. Ini juga termasuk satu tahun dukungan.

2. QuadMenu

Beranda plugin QuadMenu

QuadMenu adalah plugin mega menu populer lainnya yang mudah digunakan terlepas dari tingkat pengalaman Anda. Alat fleksibel mencakup pembuat drag-and-drop intuitif dan berbagai pilihan gaya dan penyesuaian untuk membangun menu dan submenu untuk WordPress.

Fitur utama QuadMenu :

  • Pembuat drag-and-drop
  • Beberapa lokasi menu
  • Menu di luar kanvas, lengket, dan vertikal
  • Opsi untuk menyelaraskan tautan
  • Menu tarik-turun mengambang
  • Font Ikon mengagumkan dan Google Font
  • Animasi tarik-turun
  • Berbagai filter
  • Tampilkan widget

Kelebihan QuadMenu:

  • Ada versi gratis dan premium.
  • Ini cocok untuk pemula dan pengembang.
  • Ini mendukung tema anak.
  • Ada integrasi menu otomatis dan manual.
  • Ini intuitif dan mudah digunakan.
  • Ada menu tab dan carousel yang tersedia dengan versi pro.

Kekurangan QuadMenu:

  • Opsi penataan gaya lanjutan memerlukan lisensi pro.
  • Ada opsi pratinjau langsung yang terbatas.

Kemudahan penggunaan :

QuadMenu cocok untuk pemula dan pengembang. Pembuat drag-and-drop membuat pembuatan dan penyesuaian menu mega Anda cepat dan mudah.

Harga:

QuadMenu memiliki versi gratis. Lisensi Pro tersedia mulai dari $30 untuk satu situs.

3. UberMenu

Beranda plugin UberMenu

Jika Anda mencari pembuat menu mega premium, UberMenu layak untuk dicoba. Alat canggih yang kaya fitur ini menggunakan sistem kisi canggih yang memungkinkan Anda dengan cepat membuat menu mega yang tampak profesional.

Fitur utama UberMenu :

  • Sistem grid yang unik
  • Lebih dari 50 pengaturan gaya
  • Pembuatan item dinamis
  • Submenu berdasarkan postingan, kategori, dan lainnya
  • Opsi untuk menambahkan tab dalam menu
  • Menu yang mendukung sentuhan
  • Transisi CSS3 tarik-turun
  • Beberapa pemicu menu (arahkan kursor, arahkan kursor, dan klik)
  • Berbagai menu lokasi
  • Tata letak yang fleksibel

Kelebihan UberMenu :

  • Ini banyak digunakan dan dinilai tinggi di antara pemilik situs WordPress.
  • Ada opsi untuk menambahkan HTML khusus, kode pendek, dan widget.
  • Ini menggunakan antarmuka WordPress Customizer asli.
  • Ada tema menu tak terbatas.

Kekurangan UberMenu :

  • Hanya ada versi premium yang tersedia.
  • Tergantung pada tema Anda, ini mungkin bukan pilihan terbaik jika Anda tidak memiliki keterampilan pemrograman CSS/PHP.

Kemudahan penggunaan :

Menggunakan UberMenu kemungkinan akan sangat mudah bagi pengguna WordPress berpengalaman karena antarmuka dibangun di atas Customizer asli. Anda dapat melihat pratinjau menu secara real-time saat Anda membuatnya. Namun, untuk pemula WordPress, ini mungkin lebih sulit dinavigasi daripada antarmuka pembangun drag-and-drop yang intuitif.

Harga :

Lisensi UberMenu untuk satu situs berharga $26. Ini termasuk enam bulan dukungan pengembang.

4. ElementsKit

Halaman plugin ElementsKit

Jika Anda terbiasa dengan dan menggunakan pembuat halaman Elementor, ElementsKit adalah plugin menu mega yang sangat baik untuk dipertimbangkan. Alat ini mencakup pustaka modul khusus yang luas, yang menampilkan pembuat header dan footer.

Fitur utama ElementsKit :

  • Antarmuka konten langsung
  • Pustaka modul khusus
  • Pembuat header dan footer
  • Pengguliran paralaks
  • Lebih dari 200 templat halaman yang telah dirancang sebelumnya
  • Widget penghitung waktu mundur
  • Animasi tarik-turun
  • Menu di luar kanvas, lengket, dan vertikal
  • Font Ikon mengagumkan
  • Tema terang dan gelap
  • Dua tata letak menu seluler
  • CSS khusus

Kelebihan ElementsKit :

  • Ini sepenuhnya terintegrasi dengan pembuat halaman Elementor.
  • Ini termasuk fungsionalitas drag and drop.
  • Ini pemula dan ramah pengguna.
  • Ini memiliki penyesuaian untuk ikon dan warna teks lencana.
  • Ini memiliki fitur WooCommerce bawaan.
  • Ini menawarkan opsi menu mega tingkat lanjut.

Kekurangan ElementsKit :

  • Ini tidak ideal kecuali Anda menggunakan pembuat halaman Elementor.
  • Ini bisa luar biasa jika Anda hanya mencari alat pembuat menu mega.

Kemudahan penggunaan :

ElementKits adalah alat yang mudah dan serbaguna. Jika Anda tidak terbiasa dengan Elementor, antarmuka mungkin perlu membiasakan diri. Meskipun, jika Anda sudah menggunakan plugin pembuat halaman, Anda mungkin akan memahami pengaya ini dalam waktu singkat.

Harga :

ElementsKit menawarkan versi gratis. Lisensi premium mulai dari $39 per tahun untuk satu situs.

5. Menu Mega WP

Beranda plugin WP Mega Menu

Jika Anda mencari alat freemium yang sederhana dan mudah untuk membuat menu mega di WordPress, WP Mega Menu adalah pilihan lain yang solid. Plugin ini mudah digunakan dan menyediakan semua fitur dan fungsi dasar yang diperlukan untuk membangun menu mega berkualitas untuk berbagai situs. Untuk alat gratis, itu juga dilengkapi dengan serangkaian opsi yang mengesankan untuk penyesuaian dan gaya.

Fitur utama Menu WP Mega :

  • Navigasi intuitif
  • Antarmuka seret dan lepas
  • Pilihan untuk membuat dan menyimpan tema menu
  • Logo, bilah pencarian, dan gambar latar belakang
  • Google Font dan Ikon Font Keren
  • Ikon sosial
  • Pelabelan menu

Kelebihan Menu WP Mega :

  • Ini benar-benar gratis untuk diunduh dan digunakan, dengan peningkatan pro tersedia.
  • Mudah dinavigasi dan digunakan.
  • Ini memiliki fitur yang hanya disertakan oleh plugin lain dalam versi premium.
  • Ini memiliki opsi untuk membuat dan menyimpan tema menu untuk digunakan di beberapa situs web.

Kekurangan dari WP Mega Menu :

  • Ini tidak memiliki alat yang dirancang untuk pengembang dibandingkan dengan opsi plugin lainnya.
  • Tidak ada opsi lengket atau di luar kanvas dengan versi gratis.

Kemudahan penggunaan :

WP Mega Menu adalah plugin ramah pemula dengan banyak opsi. Muncul dengan antarmuka intuitif yang mudah dimengerti dan dinavigasi.

Harga :

WP Mega Menu gratis. Tetapi juga menawarkan paket Premium mulai dari $29 per tahun untuk satu lisensi.

Perbandingan plugin mega menu teratas untuk WordPress

Menu Mega Maks QuadMenu UberMenu ElemenKit WP Mega Menu
Seret dan jatuhkan Ya Ya Tidak Ya Ya
Ikon Ya Ya Dengan ekstensi Ya Ya
Widget Ya Ya Ya Ya Ya
Lengket Premium Ya Dengan ekstensi Premium Tidak
Vertikal Premium Ya Ya Ya Premium
Di Luar Kanvas Ya Ya Tidak Ya Tidak
Google Font/Font Luar Biasa Premium Ya Ya Ya Ya
Transisi/Animasi Ya Ya Ya Premium Premium
Harga Gratis; $29 per tahun Gratis; $30 untuk satu situs $26 per tahun Gratis; $39 per tahun Gratis; $29 per tahun

Pertanyaan yang sering diajukan (FAQ) tentang menu mega

Pada titik ini, semoga, Anda memiliki pemahaman yang kuat tentang cara membuat dan menambahkan menu mega di WordPress. Tapi mari luangkan waktu sejenak untuk menyelesaikan dengan beberapa Pertanyaan yang Sering Diajukan (FAQ).

Bisakah saya menambahkan gambar dan ikon ke menu mega WordPress?

Ya, Anda dapat menambahkan gambar dan ikon ke menu mega WordPress. Beberapa plugin dilengkapi dengan dukungan bawaan untuk ini. Atau, Anda juga dapat menambahkan gambar dan ikon dengan mengedit kode situs web Anda.

Bisakah saya menambahkan menu mega ke sidebar WordPress saya?

Ya, Anda dapat menambahkan menu mega ke sidebar WordPress Anda. Ada beberapa plugin berbeda yang dapat Anda gunakan untuk menambahkan menu mega ke sidebar Anda. Sebagian besar plugin yang memungkinkan Anda menampilkan menu sebagai widget juga memungkinkan Anda menambahkannya ke sidebar.

Mulai sesuaikan menu WordPress Anda

Menu memainkan peran penting dalam desain dan fungsionalitas situs web Anda karena dapat digunakan untuk meningkatkan tampilan dan nuansa situs mana pun. Jadi, jika Anda memiliki situs web WordPress besar dengan banyak konten dan halaman, Anda mungkin ingin mempertimbangkan untuk menambahkan menu mega.

Seperti yang telah kita bahas dalam posting ini, ada tiga metode utama yang dapat Anda gunakan untuk membuat menu mega di WordPress. Salah satunya adalah menggunakan opsi tema Anda untuk menambahkan menu mega. Yang kedua adalah mengkode satu secara manual. Jika keduanya tidak memungkinkan, atau jika Anda hanya ingin menghemat waktu, Anda dapat mencoba plugin mega menu seperti Max Mega Menu, QuadMenu, atau ElementsKit.

Apakah Anda ingin lebih meningkatkan kinerja situs WordPress Anda? Selain menyediakan pencadangan otomatis yang mudah dan fitur keamanan WordPress lainnya, Jetpack dapat membantu meningkatkan kecepatan dan UX situs Anda!