Tips Menyembunyikan Menu Seluler di WordPress

Dalam kebanyakan kasus, tema WordPress sudah memiliki gaya yang ditentukan yang memungkinkan mereka mengubah menu navigasi biasa menjadi menu seluler. Lebih mudah jika Anda membutuhkan solusi cepat di luar kotak. Misalnya, Anda memiliki tata letak tradisional untuk komputer desktop dan menu hamburger di perangkat seluler. Namun, jika Anda ingin menyesuaikan lebih lanjut atau bahkan sepenuhnya mengganti menu ponsel Anda yang ada, itu juga memungkinkan. Ada beberapa cara untuk menyembunyikan menu seluler di WordPress, baik dengan plugin atau kode .

Cara menyembunyikan menu seluler di WordPress

Kustomisasi situs web yang lengkap membutuhkan sedikit pengetahuan dan pengalaman. Jika Anda ingin memiliki penyesuaian yang aman tanpa risiko, Anda dapat menggunakan profesional untuk menyesuaikan dan memelihara situs web Anda. Meskipun ada beberapa bagian mudah yang dapat Anda lakukan sendiri, penyesuaian yang lebih serius memang membutuhkan sentuhan profesional. Ketika datang ke menu seluler di WordPress, Anda dapat menggunakan plugin untuk menyederhanakan prosesnya . Atau, jika Anda memiliki pengetahuan pengkodean, Anda dapat membuat perubahan langsung di dalam kode.

Untuk membantu Anda mengubah tampilan menu seluler di situs web Anda, berikut adalah dua cara paling umum untuk menyelesaikannya:

• Sembunyikan menu seluler di WordPress dengan plugin
• Sembunyikan menu seluler dengan kode CSS

Cara menyembunyikan menu seluler di WordPress dengan plugin

Anda mungkin telah menemukan tema WordPress dengan perilaku menu seluler yang menarik, dan ingin menirunya dengan mudah. Metode ini tidak memerlukan pengetahuan pengkodean, jadi lebih nyaman untuk tugas ini. Setelah Anda memasang plugin, Anda akan dapat menghapus menu seluler Anda sepenuhnya di perangkat seluler . Juga, beberapa plugin akan memungkinkan Anda untuk menyesuaikannya secara mendalam. Selain persembunyian dasar, Anda juga dapat menggunakannya untuk menghapus hanya elemen tertentu di menu Anda.

Membuat menu seluler baru

Langkah pertama adalah pergi ke Appearance>Menus . Di sana Anda akan dapat membuat menu baru dengan mengklik opsi "buat menu baru" di bagian atas. Beri nama menu baru Anda dan konfirmasikan ini dengan tombol "Buat Menu" di sudut kanan bawah layar.

Setelah langkah-langkah ini, pemilihan di sisi kiri tidak lagi dapat diklik, dan Anda dapat menambahkan item untuk menu baru Anda. Ketika Anda selesai menambahkan item baru, cukup klik "Simpan Menu" .

Temukan dan instal plugin

Langkah selanjutnya adalah menemukan dan menginstal plugin. Ada banyak plugin yang dapat membantu Anda memanipulasi dan menyesuaikan menu . Beberapa yang paling populer adalah WP Mobile Menu, Max Mega Menu, Responsive Menu, dan lain sebagainya. Demi penjelasan, mari kita instal dan aktifkan Menu WP Mobile.

Setelah selesai, buka Opsi Menu Seluler di sidebar WordPress kiri Anda. Di dalam opsi plugin, Anda sekarang dapat memilih apakah Anda ingin menampilkan menu ponsel baru Anda di kiri atau kanan. Pilih menu yang telah dibuat sebelumnya lalu gulir ke bawah ke "Sembunyikan Menu Tema Asli" . Di sana, Anda dapat memilih untuk menghapus elemen tertentu dari menu asli. Jika Anda mengklik bidang "Temukan Elemen", Anda akan mendapatkan pratinjau langsung dari pilihan yang dapat dipilih. Setelah Anda selesai dengan proses pemilihan, simpan saja perubahannya.

Ganti atau sembunyikan menu

Setelah Anda memilih apa yang akan disembunyikan, kembali saja ke Appearance>Mens . Pilih dari menu tarik-turun menu seluler yang Anda buat sebelumnya dan atur "Lokasi tampilan" -nya. Menu asli Anda sekarang disembunyikan dan diganti dengan menu kustom Anda.

Anda sekarang dapat mengunjungi situs web Anda untuk melihat menu baru Anda beraksi. Plugin sekarang akan menyembunyikan menu seluler tema Anda dan sebagai gantinya menampilkan menu khusus.

Cara menyembunyikan menu dengan kode CSS

Metode lain untuk menyembunyikan menu seluler memerlukan pengetahuan tertentu tentang kode dan praktik CSS . Orang yang sering membuat tema WordPress khusus sudah tahu betapa rumitnya beberapa penyesuaian. Dan, mengingat poin-poin ini, itu bukan metode yang direkomendasikan untuk pemula. Namun demikian…

Temukan nama menu Anda

Langkah pertama adalah menemukan menu yang ingin Anda edit. Mungkin cara termudah adalah dengan menggunakan alat pengembang browser terintegrasi . Buka situs web tempat Anda ingin membuat perubahan dan buka alat pengembang. Jika Anda menggunakan Google Chrome, Anda dapat melakukannya dengan pintasan Ctrl+Shift+I . Di bagian atas layar, Anda akan menemukan opsi Toggle Device Toolbar yang akan menunjukkan kepada Anda bagaimana tampilan situs web Anda di perangkat seluler. Anda bahkan dapat mengubah berbagai jenis dan resolusi.

Sekarang setelah Anda melihat tampilannya di perangkat seluler, pilih tombol seperti panah dan klik menu Anda untuk memeriksanya. Ini akan segera membawa Anda ke bagian kode di mana Anda dapat melihat kelas CSS untuk menu yang diberikan. Artinya, Anda akan melihat nama kelas itu.

Sembunyikan menu Anda dengan baris kode baru

Setelah Anda mendapatkan nama yang tepat, cukup buka Appearance>Customize dan pilih “Additional CSS” . Secara umum, ini biasanya di bagian bawah sidebar kiri. Klik, dan Anda akan diberikan layar berikutnya. Di sana, Anda dapat mengklik di bagian bawah layar untuk memilih tampilan seluler dan, di atasnya, Anda akan memasukkan kode untuk menyembunyikan menu:

Kode: .menu-name {tampilan: tidak ada;}

Terakhir, klik tombol Publish dan selesai. Jika Anda sedikit lebih akrab dengan kode CSS, banyak perubahan ini dapat diselesaikan di dalam file CSS. Namun, Anda harus memperhatikan pertanyaan media. Mereka akan memungkinkan Anda untuk membuat aturan yang berbeda untuk perangkat yang berbeda, sehingga Anda dapat memiliki kontrol lebih besar atas situs web dan perilaku menu Anda.

Jika Anda seorang pemula dalam pengeditan tata letak, opsi plugin mungkin adalah cara terbaik untuk memulai. Jika Anda mulai mengubah kode tanpa tahu persis apa yang Anda lakukan, Anda dapat dengan mudah merusak tampilan situs web Anda. Ada banyak aturan dan properti di CSS yang saling menimpa. Jadi, jika Anda ingin menyembunyikan menu ponsel Anda di WordPress tanpa risiko, gunakan plugin untuk menyelesaikan pekerjaan Anda .