Cara Membuat Menu Responsif Fullscreen di WordPress
|Cara Membuat Menu Responsif Fullscreen di WordPress – Mungkin Anda pernah mengunjungi beberapa situs populer yang mempunyai menu responsif fullscreen, menu ini muncul di situs dengan ikon garis-garis atau yang dikenal dengan menu hamburger. Ketika pengguna mengklik atau icon tersebut, overlay fullscreen yang berisi menu situs muncul dengan efek slide atau efek keren lainnya.
Jika Anda ingin membuat menu seperti tersebut di situs WordPress Anda, maka pada artikel kali ini, saya akan menunjukkan cara untuk menambahkan menu responsif fullscreen di WordPress dengan mudah yaitu menggunakan plugin.
Menambahkan Menu Responsive Fullscreen
Hal pertama yang perlu Anda lakukan adalah menginstal dan mengaktifkan plugin DC Fullscreen Responsif Menu. Setelah plugin Anda aktifkan, silahkan masu ke menu Appearance » DC Fullscreen Menu untuk melakukan pengaturan plugin seperti gambar dibawah ini.
Pilih menu yang ingin Anda jadikan fullscreen dari menu daftar drop-down di Menu List seperti gambar diatas. Jika Anda belum membuat belum menu navigasi, Silahkan buat terlebih menu untuk situs Anda.
Setelah itu, Anda harus memilih arah efek slide-in untuk menu fullscreen. Anda dapat memilih efek slide muncul dari atas, kanan, kiri, bawah, atau juga tanpa effect.
DC Fullscreen menu Responsif juga mempunyai pengaturan tampilan warna background dan warna teks. Pilih kombinasi warna sesuai dengan situs Anda atau pilih sesuai selera sehingga cocok dengan situs WordPress Anda. Selain itu Anda juga dapat memilih Google Font untuk teks menu. Cukup masukkan nama font, dan plugin akan otomatis menyesuaikan sesuai dengan pilihan Anda tersebut.
Jangan lupa untuk menghilangkan kotak centang di samping opsi “Tiny Link to Author”. Jika dibiarkan tetap di centang, itu akan menambahkan link menuju ke website si pembuat plugin pada semua halaman Anda.
Terakhir, klik pada tombol Submit untuk menyimpan pengaturan. Sekarang Anda dapat mengunjungi situs web Anda untuk melihat menu tersebut terpasang dengan baik. Coba juga untuk merubah ukuran browser ke berbagai ukuran perangkat untuk melihat bagaimana menu terlihat pada ukuran layar yang berbeda.
Saya harap artikel ini membantu Anda menambahkan menu responsif fullscreen ke situs WordPress Anda. Silahkan di coba dan semoga bermanfaat. 🙂
Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Facebook+.
Daftar isi Tutorial WordPress Terlengkap GratisRegister Now: TOP 10 Hosting
Dapatkan Hosting Murah dengan Kualitas Terbaik. For Serious Blogger! View Deals
Sebelumnya saya mau nanya tentang ini om.
“Om centerklik saya mau tanya tentang menu navigasi untuk versi mobile. Sebelumnya mohon maaf kalo saya salah tebak ya. Stelah saya perhatikan thema centerklik.com ini seperti tema point dari mythemeshop mungkin iya atau enggak saya kurang tau. Tapi saya yakin pasti om centerklik tau tema point dari mythemeshop. Nah di tema itu (point) menu navigasi versi mobile nya kan kalo di klik buka nya dari samping (sebutannya apa saya kurang tau, yg jelas pas diklik keluar menunya dari kiri). Trus saya mau rubah agar menu versi mobile nya pas di klik keluar menunya dia turun kebawah (dropdown) kaya menu di centerklik.com gimana ya cara ngubahnya ? Boleh dikasih tau, atau di centerklik ada tutorialnya ?
Sebelumnya terimakasih banyak. Jika berkesempatan tolong dijwab ya om.”