Salah satu element terpenting pada website adalah Menu. Menu navigasi memudahkan pengunjung untuk menemukan apa yang dicari dari website anda. Elementor sudah menyediakan widget untuk menangani masalah ini yaitu widget Nav Menu. Dengan widget ini anda bisa menyisipkan navigasi menu kedalam website anda. Tentu saja tidak hanya memasukkan menu, anda bisa melakukan kustomisasi tampilan menu sesuai kebutuhan website anda. Mari kita bahas apa saja yang bisa kita lakukan pada pengaturan widget ini.
Content
Layout
- Menu: Tentukan menu yang akan digunakan dalam website
- Layout: Tentukan tampilan list item menu
- Alignment: Atur posisi list item menu
- Pointer: Pilih tampilan penunjuk item menu
- Animation: Tentukan animasi penunjuk item menu
- Submenu Indicator: Tentukan icon item submenu
Mobile Dropdown
- Breakpoint: Tentukan pada ukuran layar seperti apa menu Mobile Dropdown akan ditampilkan
- Full Width: Aktifkan untuk menampilkan dropdown menu dengan lebar memenuhi layar
- Text Align: Tentukan posisi teks item menu Mobile Dropdown
- Toggle Button: Tentukan button untuk menampilkan item menu Mobile Dropdown
- Normal: Tentukan tampilan icon toggle button ketika mode normal
- Hover: Tentukan tampilan icon toggle button ketika hover
- Active: Tentukan tampilan icon toggle button ketika aktif
- Icon: Tentukan icon toggle button
- Toggle Align: Atur posisi icon toggle button
Style
Main Menu
- Typography: Atur tipografi teks menu
- Normal: Tentukan tampilan menu ketika mode normal
- Hover: Tentukan tampilan menu ketika hover
- Active: Tentukan tampilan menu ketika aktif
- Text Color: Pilih warna teks menu
- Divider: Aktifkan atau nonaktifkan pemisah antar item menu
- Pointer Width: Atur lebar penunjuk item menu
- Horizontal Padding: Atur padding horizontal menu
- Vertical Padding: Atur padding vertical menu
- Space Between: Tentukan jarak antar item menu
Dropdown
- Normal: Tentukan tampilan dropdown menu ketika mode normal
- Hover: Tentukan tampilan dropdown menu ketika hover
- Active: Tentukan tampilan dropdown menu ketika aktif
- Text Color: Pilih warna teks dropdown menu
- Background Color: Atur warna background dropdown menu
- Typography: Atur tipografi teks dropdown menu
- Border Type: Pilih tipe border dropdown menu
- Border Radius: Tentukan ukuran sudut border
- Box Shadow: Beri efek bayangan untuk dropdown menu
- Horizontal Padding: Atur padding horizontal dropdown menu
- Vertical Padding: Atur padding vertical dropdown menu
Divider
- Border Type: Tentukan tipe border pemisah antar item dropdown menu
- Distance: Atur jarak antara pemisah dan item dropdown menu
Toggle Button
- Normal: Tentukan tampilan toggle button ketika mode normal
- Hover: Tentukan tampilan toggle button ketika hover
- Color: Atur warna toggle button
- Background Color: Pilih warna background toggle button
- Size: Atur ukuran toggle button
- Border Width: Tentukan lebar border toggle button
- Border Radius: Atur ukuran sudut border toggle button