Cara Membuat Navigasi Menu dengan Elementor

Dua Cara Membuat Header/Navigasi di Elementor

Ada dua pendekatan: menggunakan Nav Menu widget (Elementor Pro) atau menggunakan header bawaan tema WordPress yang dikustomisasi. Artikel ini membahas keduanya.

Cara 1: Nav Menu Widget (Elementor Pro)

1. Buat menu terlebih dahulu di WordPress Admin → Appearance → Menus
2. Di editor Elementor, drag widget Nav Menu ke canvas
3. Di Content → Menu, pilih menu yang sudah dibuat
4. Sesuaikan tampilan di tab Style: warna, tipografi, spacing, efek hover
5. Di tab Responsive, atur tampilan hamburger menu untuk mobile

Cara 2: Header Builder (Elementor Pro)

1. Buka Elementor → Theme Builder → Header
2. Klik Add New → pilih template atau mulai dari scratch
3. Desain header dengan drag-and-drop
4. Klik Publish → atur kondisi tampil (seluruh website / halaman tertentu)

Cara 3: Tanpa Elementor Pro (Alternatif)

Jika menggunakan Elementor Free, gunakan plugin ElementsKit Lite atau Happy Addons yang menyediakan Nav Menu widget gratis.

Tips Navigasi yang Baik

• Maksimal 5-7 item menu utama agar tidak overwhelming
• Gunakan sticky header agar menu selalu terlihat saat scroll
• Beri efek active state untuk menunjukkan halaman yang sedang dibuka
• Pastikan hamburger menu mobile mudah diklik (min. 44x44px)