WordPress'te Mobil Menüyü Gizleme İpuçları

Çoğu durumda, WordPress temaları, normal bir gezinme menüsünü bir mobil menüye dönüştürmelerine olanak tanıyan tanımlanmış stiller zaten içerir. Kutudan çıkar çıkmaz hızlı bir çözüme ihtiyacınız varsa kullanışlıdır. Örneğin, masaüstü bilgisayarlar için geleneksel bir düzeniniz ve mobil cihazlarda bir hamburger menünüz var. Ancak, mevcut mobil menünüzü daha fazla özelleştirmek veya hatta tamamen değiştirmek istiyorsanız, bu da mümkündür. Eklentiler veya kod ile WordPress'te bir mobil menüyü gizlemenin birkaç yolu vardır .

WordPress'te bir mobil menü nasıl gizlenir

Eksiksiz web sitesi özelleştirmesi biraz bilgi ve deneyim gerektirir. Risk almadan güvenli bir kişiselleştirmeye sahip olmak istiyorsanız, web sitenizi özelleştirmek ve sürdürmek için profesyonelleri kullanabilirsiniz. Kendi başınıza yapabileceğiniz bazı kolay parçalar olsa da, daha ciddi özelleştirmeler profesyonel bir dokunuş gerektirir. WordPress'te mobil menü söz konusu olduğunda, işlemi basitleştirmek için eklentileri kullanabilirsiniz . Veya kodlama bilginiz varsa doğrudan kodun içinde değişiklikler oluşturabilirsiniz.

Web sitenizde mobil menünün görünme şeklini değiştirmenize yardımcı olmak için, onu tamamlamanın en yaygın iki yolu şunlardır:

• Eklenti ile WordPress'te bir mobil menüyü gizleyin
• CSS koduyla mobil menüyü gizle

Bir eklenti ile WordPress'te bir mobil menü nasıl gizlenir

Muhtemelen ilginç bir mobil menü davranışına sahip bir WordPress teması buldunuz ve onu kolayca kopyalamak istiyorsunuz. Bu yöntem kodlama bilgisi gerektirmez, bu nedenle bu görev için daha uygundur. Bir eklenti yükledikten sonra, mobil cihazlarda mobil menünüzü tamamen kaldırabileceksiniz . Ayrıca, bazı eklentiler onu derinlemesine özelleştirmenize izin verir. Temel gizlemenin yanı sıra, menünüzdeki yalnızca belirli öğeleri kaldırmak için de kullanabilirsiniz.

Yeni bir mobil menü oluşturma

İlk adım, Görünüm> Menüler'e gitmektir. Burada üst kısımdaki “yeni menü oluştur” seçeneğine tıklayarak yeni bir menü oluşturabileceksiniz. Yeni menünüze bir isim verin ve ekranın sağ alt köşesindeki “Menü Oluştur” butonu ile bunu onaylayın.

Bu adımlardan sonra sol taraftaki seçim artık tıklanamaz hale gelecektir ve yeni menünüz için öğeler ekleyebilirsiniz. Yeni öğeler eklemeyi tamamladığınızda, “Menüyü Kaydet”e tıklamanız yeterlidir.

Bir eklenti bulun ve yükleyin

Bir sonraki adım, bir eklenti bulmak ve kurmaktır. Menüleri değiştirmenize ve özelleştirmenize yardımcı olabilecek çok sayıda eklenti vardır . En popüler olanlardan bazıları WP Mobil Menü, Max Mega Menü, Duyarlı Menü vb.'dir. Açıklama olsun diye WP Mobile Menu kurup aktif edelim.

İşiniz bittiğinde, sol WordPress kenar çubuğunuzdaki Mobil Menü Seçenekleri'ne gidin. Eklenti seçeneklerinin içinde, artık yeni mobil menünüzü solda mı yoksa sağda mı görüntülemek istediğinizi seçebilirsiniz. Önceden oluşturulmuş menüyü seçin ve ardından “Orijinal Tema Menüsünü Gizle” seçeneğine gidin . Burada, orijinal menüden belirli öğeleri kaldırmayı seçebilirsiniz. “Öğe Bul” alanına tıklarsanız, aralarından seçim yapabileceğiniz seçimlerin canlı bir önizlemesini alırsınız. Seçim işlemini tamamladıktan sonra, değişiklikleri kaydetmeniz yeterlidir.

Menüyü değiştir veya gizle

Neyi gizleyeceğinizi seçtikten sonra Görünüm>Menüler'e geri dönün. Bir açılır menüden daha önce oluşturduğunuz mobil menünüzü seçin ve "Görüntüleme konumu"nu ayarlayın. Orijinal menünüz artık gizlendi ve özel menünüzle değiştirildi.

Artık yeni menünüzü çalışırken görmek için web sitenizi ziyaret edebilirsiniz. Eklenti artık temanızın mobil menüsünü gizleyecek ve bunun yerine özel bir menü gösterecek.

CSS kodu ile menü nasıl gizlenir

Mobil menüyü gizlemenin başka bir yöntemi, belirli bir CSS kodu ve uygulamaları bilgisi gerektirir . Genellikle özel WordPress temaları oluşturan kişiler, bazı özelleştirmelerin ne kadar karmaşık olabileceğini zaten biliyorlar. Ve bu noktalar göz önüne alındığında, yeni başlayanlar için tam olarak önerilen bir yöntem değildir. Yine de…

Menü adınızı bulun

İlk adım, düzenlemek istediğiniz menüyü bulmaktır. Muhtemelen en kolay yol, entegre tarayıcı geliştirici araçlarını kullanmaktır . Değişiklik yapmak istediğiniz web sitenize gidin ve geliştirici araçlarını açın. Google Chrome kullanıyorsanız bunu Ctrl+Shift+I kısayoluyla yapabilirsiniz. Ekranın üst kısmında, web sitenizin mobil cihazlarda nasıl göründüğünü size gösterecek olan Cihaz Araç Çubuğunu Değiştir seçeneğini bulacaksınız. Hatta farklı türleri ve çözünürlükleri değiştirebilirsiniz.

Artık mobil cihazlarda nasıl görüntülendiğini gördüğünüze göre, ok benzeri düğmeyi seçin ve incelemek için menünüzü tıklayın. Sizi hemen kodun belirli bir menü için CSS sınıfını görebileceğiniz kısmına yönlendirecektir. Yani, o sınıf adını göreceksiniz.

Menünüzü yeni bir kod satırıyla gizleyin

Uygun adı aldıktan sonra, Görünüm>Özelleştir'e gidin ve “Ek CSS” öğesini seçin. Genel olarak, bu genellikle sol kenar çubuğunun altındadır. Tıklayın ve bir sonraki ekran size verilecektir. Orada, mobil görünümü seçmek için ekranın alt kısmına tıklayabilirsiniz ve bunun üzerine menüyü gizlemek için kodu gireceksiniz:

Kod: .menu-adı {ekran: yok;}

Son olarak, Yayınla düğmesine tıklayın ve bitirdiniz. CSS koduna biraz daha aşinaysanız, bu değişikliklerin çoğu CSS dosyası içinde tamamlanabilir. Ancak, medya sorgularına dikkat etmeniz gerekecek. Farklı cihazlar için farklı kurallar oluşturmanıza izin verecekler, böylece web siteleriniz ve menü davranışlarınız üzerinde daha fazla kontrol sahibi olabilirsiniz.

Düzen düzenlemeye yeni başlıyorsanız, eklenti seçeneği muhtemelen başlamanın en iyi yoludur. Tam olarak ne yaptığınızı bilmeden kodu değiştirmeye başlarsanız, web sitenizin görünümünü kolayca bozabilirsiniz. CSS'de birbirinin üzerine yazan çok sayıda kural ve özellik vardır. Bu nedenle, WordPress'te mobil menünüzü risk almadan gizlemek istiyorsanız, işi sizin yerinize tamamlamak için eklentileri kullanın .