Bagaimana cara menambahkan menu panel slide di template WordPress

Wordpress


Apakah Anda ingin menambahkan panel menu slide ke situs WordPress Anda?

Menambahkan menu responsif memudahkan pengguna untuk menavigasi situs web Anda saat menggunakan perangkat seluler. Saat mereka mengetuk ikon menu Anda, panel menu meluncur melintasi layar menggunakan animasi yang bagus.

Pada artikel ini, kami akan menunjukkan cara menambahkan menu panel slide di tema WordPress tanpa menulis kode.

Bagaimana cara menambahkan menu panel slide di template WordPress

Mengapa menambahkan menu panel slide di tema WordPress?

Menu yang dirancang dengan baik membantu pengunjung Anda menemukan jalan di sekitar situs WordPress Anda. Banyak pengunjung Anda akan menggunakan perangkat seluler, jadi penting untuk melihat pratinjau versi seluler situs WordPress Anda untuk melihat tampilan menu navigasi Anda di layar yang lebih kecil.

Untungnya, banyak tema WordPress memiliki gaya bawaan yang secara otomatis menampilkan menu ramah seluler saat dilihat di layar kecil.

Namun, Anda mungkin ingin menyesuaikan navigasi seluler Anda lebih jauh dan menambahkan menu layar penuh responsif atau menu panel slide animasi.

Dengan mengingat hal itu, mari kita lihat cara menambahkan menu panel slide di tema WordPress.

Bagaimana cara menambahkan menu panel slide di template WordPress

Hal pertama yang perlu Anda lakukan adalah menginstal dan mengaktifkan plugin Responsive Menu. Untuk detail lebih lanjut, lihat panduan langkah demi langkah kami tentang cara menginstal plugin WordPress.

Ada versi premium dari Menu Responsif dengan tema tambahan dan fitur tambahan seperti logika kondisional, tetapi untuk tutorial ini, kami akan menggunakan plugin gratis.

Setelah aktivasi, pergi ke trek Menu responsif » Menu Halaman Setelah Anda sampai di sana, Anda perlu mengklik tombol “Buat Menu Baru” di bagian atas halaman.

Buat menu responsif baru

Anda kemudian akan melihat empat tema yang dapat Anda gunakan untuk menu responsif baru Anda. Tema tambahan tersedia untuk dibeli.

Untuk tutorial ini, kita akan menggunakan tema yang dipilih secara otomatis. Kemudian Anda dapat mengklik tombol “Selanjutnya”.

Pilih tema untuk menu responsif Anda

Ini akan membawa Anda ke halaman pengaturan menu. Di sini Anda dapat memasukkan nama untuk menu responsif Anda dan kemudian memilih menu WordPress mana yang ingin Anda tampilkan di panel.

Demi tutorial ini, kami memilih menu ‘Navigasi’. Jika Anda perlu membuat menu baru, Anda dapat mempelajari caranya dengan mengikuti panduan kami tentang cara menambahkan menu navigasi di WordPress.

Beri nama menu dan tautkan ke menu WordPress yang ingin Anda gunakan

Anda juga dapat menyembunyikan menu biasa yang disertakan dengan tema WordPress Anda sehingga pengguna Anda hanya melihat menu panel slide baru. Caranya dengan memasukkan kode CSS di kolom “Sembunyikan Menu Tema”.

Kode yang perlu Anda masukkan di sini bervariasi dari satu tema ke tema lainnya dan Anda dapat mempelajari lebih detail dengan mengeklik tautan “Pelajari lebih lanjut”.

Pengguna dengan versi Pro memiliki beberapa pengaturan tambahan. Misalnya, pengguna Pro dapat memilih perangkat dan halaman mana yang akan menampilkan menu.

Ketika Anda puas dengan pengaturan, Anda harus mengklik tombol “Buat Menu” di bagian bawah halaman. Ini akan membawa Anda ke halaman di mana Anda dapat menyelesaikan penyesuaian menu Anda.

Anda akan melihat pratinjau situs web Anda di sisi kanan halaman, dan ada tombol di bagian bawah untuk beralih antara tampilan ponsel, tablet, dan desktop. Anda juga akan menemukan opsi penyesuaian di sisi kiri.

Sekarang Anda dapat menyesuaikan menu responsif Anda

Perhatikan bahwa teks ditampilkan di atas menu. Ini adalah teks judul menu dan sebaris teks yang disebut plugin “Konten Ekstra”.

Anda dapat mengedit atau menyembunyikan teks dengan mengklik “Menu Seluler” dan kemudian “Wadah” di menu di sisi kiri layar.

Sesuaikan atau sembunyikan teks yang ditampilkan di bagian atas menu Anda

Anda dapat mengetik apa pun yang Anda suka di bidang “Teks Judul”, seperti “Menu Utama” atau “Navigasi”. Jika Anda tidak ingin judul ditampilkan, cukup geser tombol “Judul” ke posisi mati.

Setelah itu, Anda harus pergi ke pengaturan “Konten tambahan”. Anda dapat menonaktifkan pengaturan ini atau mengetik konten alternatif. Pada gambar di bawah, Anda akan melihat bahwa sakelar telah dimatikan, sehingga kata-kata “Tambahkan lebih banyak konten di sini …” sekarang disembunyikan.

Sesuaikan atau sembunyikan konten tambahan untuk menu Anda

Setelah Anda puas dengan pengaturan menu, pastikan Anda mengklik tombol “Perbarui” di bagian bawah halaman untuk menyimpan pengaturan Anda.

Plugin Menu Responsif hadir dengan banyak opsi lain yang memungkinkan Anda mengubah perilaku dan tampilan menu panel geser. Anda dapat memeriksa opsi ini di halaman pengaturan plugin dan menyesuaikannya jika diperlukan.

Anda sekarang dapat mengunjungi situs web kami untuk melihat menu beraksi. Berikut tampilannya di situs pengujian kami. Perhatikan bahwa jika halaman saat ini ada di menu, itu akan disorot dengan bilah warna.

Animasi menu panel geser di WordPress

Kami harap tutorial ini akan membantu Anda mempelajari cara menambahkan menu panel slide di tema WordPress. Anda mungkin juga ingin mempelajari cara melacak pengunjung ke situs WordPress Anda, atau lihat daftar plugin penting kami untuk mengembangkan situs Anda.

Jika Anda menyukai artikel ini, silakan berlangganan saluran YouTube kami untuk tutorial video WordPress. Anda juga dapat menemukan kami di Indonesia Dan Facebook

Posting Cara Menambahkan Menu Panel Slide di Tema WordPress muncul pertama kali di WPBeginner.





Source link

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *