Katlanabilir bir kenar çubuğu menüsü, web sitenizin tasarımını temiz ve düzenli tutarken önemli bağlantılara ve içeriğe kolay erişim sağlamanın harika bir yoludur.
Bu özellik, kullanıcıların menüyü genişletmesine ve daraltmasına olanak tanıyarak tarama deneyimleri üzerinde kontrol sahibi olmalarını sağlar. Büyük web siteleri, e-ticaret mağazaları veya daha karmaşık bir düzene sahip herhangi bir site için mükemmeldir.
Bu makalede, WordPress’te nasıl kolayca katlanabilir bir kenar çubuğu menüsü oluşturacağınızı göstereceğiz.
Katlanabilir Kenar Çubuğu Menüsü Nedir? (Ve Ne Zaman Kullanılmalı)
En kullanıcı dostu menüler, ziyaretçilerin ihtiyaç duyduğu tüm bağlantılara kolay erişim sağlar. Ancak bu, çok sayıda sayfası veya daha karmaşık bir düzeni olan WordPress web siteleri için zor olabilir.
Amazon gibi tonlarca ürün kategorisi ve alt kategorisi olan büyük bir e-ticaret mağazasını düşünün.
Her bir ürün kategorisini standart bir menüde görüntülemek iyi bir fikir olmayacaktır. Müşterilerin ilgilendikleri kategoriyi bulmak için muhtemelen menüde gezinmeleri gerekecektir.
Katlanabilir menüler bu noktada devreye girer. Bu menüler içeriği ‘ebeveyn-çocuk’ yaklaşımıyla düzenler. Yani ziyaretçi katlanabilir menüdeki bir üst öğeye tıklarsa, bu üst öğenin tüm alt içeriklerini görüntülemek için genişleyecektir.
Bunun bir örneği, mobil sitesi için katlanabilir bir menü kullanan Guardian haber kuruluşudur.
Katlanabilir kenar çubuğu menüleri bazen genişletilebilir menüler olarak da adlandırılır. Bunun nedeni, bir ziyaretçi üzerlerine tıkladığında farklı bölümlerinin genişlemesidir.
Varsayılan olarak, katlanabilir menüler ziyaretçilerden çok fazla içerik ve karmaşıklığı gizler. Bu, WordPress blogunuzdaki uzun bir kategori ve alt kategori listesinde gezinmekten çok daha kullanıcı dostudur.
Bununla birlikte, WordPress sitenizde nasıl kolayca katlanabilir bir kenar çubuğu menüsü oluşturabileceğinize bir göz atalım.
Video Eğitimi
Yazılı talimatları tercih ediyorsanız, okumaya devam edin.
WordPress’te Katlanabilir Kenar Çubuğu Menüsü Nasıl Oluşturulur
Bellows Accordion Menu eklentisini kullanarak WordPress’te katlanabilir bir kenar çubuğu menüsü oluşturabilirsiniz.
Bellows Akordeon Menü, kenar çubuğunuz da dahil olmak üzere herhangi bir sayfaya, gönderiye veya widget alanına katlanabilir menünüzü yerleştirmek için kullanışlı bir kısa kod sağlar.
Öncelikle Bellows Akordeon Menü eklentisini yüklemeniz ve etkinleştirmeniz gerekir. Yardıma ihtiyacınız varsa, lütfen bir WordPress eklentisinin nasıl kurulacağına ilişkin başlangıç kılavuzumuza bakın.
Yasal Uyarı: Eklentinin WordPress’in son üç sürümü ile güncellenmediğini unutmayın. Ancak, web sitemizde gerçek zamanlı olarak test ettik ve sorunsuz çalışıyor. Ayrıntılar için güncel olmayan WordPress eklentilerinin kullanımına ilişkin kılavuzumuza bakın.
Etkinleştirmenin ardından WordPress kontrol panelinizdeki Görünüm ” Menüler sayfasını ziyaret edin.
Başlamak için, ‘Menü Adı’ alanına menünüz için bir ad yazın. Site ziyaretçilerinizin bu adı görmeyeceğini unutmayın, çünkü bu yalnızca sizin referansınız içindir.
Daha sonra ‘Menü Oluştur’ düğmesine tıklayabilirsiniz.
Ardından, daraltılabilir kenar çubuğu menüsüne eklemek istediğiniz sayfaları seçin. Varsayılan olarak, WordPress yalnızca en son sayfalarınızı görüntüler.
Web sitenizin tüm sayfalarının bir listesini görmek istiyorsanız, ‘Tümünü Görüntüle’ sekmesine tıklayın.
Alternatif olarak, ‘Tümünü Seç’ seçeneğine tıklayabilirsiniz. Bu, tüm sayfalarınızı daraltılabilir menüye ekleyecektir.
Seçiminizden memnun olduğunuzda ‘Menüye Ekle’ düğmesine tıklayın. Ayrıca yazıları ve blog kategorilerini seçebilir veya özel bağlantılar ekleyebilirsiniz. Daha fazla ayrıntı için lütfen WordPress’te navigasyon menüsü ekleme kılavuzumuza bakın.
Tüm farklı web sayfalarınızı menüye ekledikten sonra, bunları sürükleyip bırakarak taşıyabilirsiniz. Bu, bu sayfaların daraltılabilir menünüzde görünme sırasını değiştirecektir.
Katlanabilir menüler tamamen ebeveyn-çocuk ilişkileri ile ilgilidir.
Bir ziyaretçi daraltılabilir menünüzdeki bir üst öğeye tıkladığında, tüm alt içeriği ortaya çıkarmak için genişleyecektir.
Bu ilişkiyi oluşturmak için, çocuğunuzun tüm sayfalarını ebeveynlerinin altına yerleştirmek üzere sürükle ve bırak özelliğini kullanmanız yeterlidir.
Ardından, her bir çocuğu tutun ve biraz sağa sürükleyin. Daha sonra bu sayfayı serbest bırakabilirsiniz. Bu, öğeyi girintili hale getirecek ve bir alt sayfaya dönüştürecektir.
İşiniz bittiğinde ‘Menüyü Kaydet’ düğmesine tıklamayı unutmayın.
Şimdi, bu katlanabilir menüyü WordPress kenar çubuğuna eklemek istiyoruz. Bunu yapmak için Bellows Accordion’un otomatik olarak oluşturduğu bazı kısa kodları kullanacağız.
Kısa kodu almak için WordPress panosundan Görünüm ” Körüklü Menü sayfasına gidin. Zaten seçili değilse, ‘Tümünü Göster’ sekmesini seçtiğinizden emin olun.
Şimdi tüm kodu vurgulaması gereken Kısa Kod kutusuna tıklayabilirsiniz. Şimdi, Command + c veya Ctrl + c klavye kısayolunu kullanarak bu kodu kopyalayın.
Bir sonraki adım bu kısa kodu bir widget’a yapıştırmaktır, bu nedenle yönetici alanından Görünüm ” Widget ‘lar sayfasına gidin.
Bu, mevcut temanızdaki tüm widget alanlarını gösterecektir. Gördüğünüz seçenekler değişebilir, ancak modern WordPress temalarının çoğunda bir kenar çubuğu bulunur.
Kenar çubuğu alanını bulduğunuzda, bir tıklama yapın. Bu bölüm şimdi genişleyecektir.
Bir blok eklemek için + simgesine tıklayın ve ‘Kısa kod’ yazmaya başlayın. Görüntülendiğinde, ‘Kısa kod’ bloğunu seçin.
Şimdi, daraltılabilir menü kısa kodunuzu bu bloğa yapıştırın. Menünüzü yayınlamak için ekranınızın üst kısmındaki ‘Güncelle’ düğmesine tıklamanız gerekir.
Artık sitenizi ziyaret ettiğinizde yeni bir katlanabilir kenar çubuğu menüsü görmelisiniz.
Bellows Accordion eklentisi, bu varsayılan menüyü özelleştirmeyi de son derece kolay hale getiriyor. Örneğin, sitenizin markasını daha iyi yansıtmak için renk düzenini değiştirebilirsiniz.
Varsayılan menüde değişiklik yapmak istiyorsanız, WordPress panonuzdaki Görünüm ” Körüklü Menü sayfasına gitmeniz yeterlidir.
Bu menü, katlanabilir menünüzü özelleştirmek için ihtiyacınız olan tüm ayarlara sahiptir. Keşfedilecek çok sayıda ayar vardır. Ancak, Ana Yapılandırma ” Temel Yapılandırma bölümüne giderek başlamak isteyebilirsiniz.
Burada, birkaç farklı menü rengi arasında geçiş yapabilirsiniz. Ayrıca ‘Akordeon Katlama’ ayarlarını kullanarak ziyaretçilerin aynı anda birden fazla alt menüyü genişletip genişletemeyeceğini de seçebilirsiniz.
Menünün hizalamasını ve genişliğini değiştirmek için ‘Düzen ve Konum’ sekmesine tıklayın.
Değişikliklerinizi gerçek zamanlı olarak önizlemeyi tercih ediyorsanız, WordPress Özelleştirici’de katlanabilir kenar çubuğu menüsünü düzenleyebilirsiniz.
Bunu yapmak için, yönetici alanından Görünüm ” Özelleştir sayfasına gidin ve sol sütundan ‘Körükler’ sekmesini seçin.
Burada, kenar çubuğunuz için birçok farklı ayar bulacaksınız. Bunlar arasında genişliğini, hizalamasını ve katlanabilir kenar çubuğu menünüzün rengini değiştirmek yer alıyor.
Bonus: Maksimum Sonuç Almak için WordPress Kenar Çubuğu Hileleri
Katlanabilir bir kenar çubuğu menüsü oluşturduktan sonra, kenar çubuğunuzun yardımıyla daha fazla potansiyel müşteri oluşturmak için diğer bazı ipuçlarını kullanabilirsiniz.
Örneğin, kenar çubuğu widget ‘ınızı yapışkan hale getirerek kullanıcı aşağı kaydırsa bile sayfada görünür olmasını sağlayabilirsiniz.
Bunun dışında, e-posta listenizi oluşturmak için kenar çubuğunuza bir iletişim formu veya e-posta kayıt formu ekleyebilirsiniz. Bunu yapmak için piyasadaki en iyi iletişim formu eklentisi olan WPForms‘u kullanabilirsiniz.
Basitçe bir form oluşturmanız ve ardından blok menüsündeki WPForms bloğunu kullanarak bunu kenar çubuğunuza eklemeniz gerekecektir.
Daha fazla ayrıntı için WordPress’te iletişim formu oluşturma eğitimimize bakabilirsiniz.
Ayrıca, en popüler gönderilerinizi kenar çubuğunda görüntüleyebilir, resimler ekleyebilir, sosyal medya simgelerini gösterebilir ve sosyal kanıt görüntüleyebilirsiniz. Bu, kullanıcıları sitenizi daha fazla keşfetmeye teşvik edecek ve dönüşümlerinizi artıracaktır.
Daha fazla ipucu için, maksimum sonuç almak için en iyi WordPress kenar çubuğu hileleri listemize bakabilirsiniz.
Bu makalenin WordPress’te katlanabilir kenar çubuğu menüsünün nasıl oluşturulacağını öğrenmenize yardımcı olduğunu umuyoruz. WordPress site tasarımınızı düzenlemeye ilişkin daha fazla ipucu için WordPress başlığınızı nasıl özelleştireceğinize ve siteniz için en kullanışlı WordPress widget’larına ilişkin kılavuzlarımıza da göz atabilirsiniz.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Syed Balkhi
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Mrteesurez
Thanks for this guide, if I understand you correctly, that means the plugin will generate a shortcode that can be placed at anywhere in the site even inside a post ?
WPBeginner Comments
While you could try using the shortcode in other locations, even if it works it may or may not display in a useful way.
Jiří Vaněk
For websites that have many categories, this is the perfect option to make the sidebar clear. I now have about 15 categories on the site and am thinking about something similar to the accordion as well. Thanks for the inspiration.
Tamie
Thank you for this. How can you adjust the spacing between the subcategories? I have a lot of categories and having what looks like a double line space in between make the menus very long.
WPBeginner Support
It would depend on your specific theme for the settings required. You would want to start by checking with the support for your specific theme. Otherwise, you could use Inspect Element to find what needs to be modified. We have a guide below that shows how to use Inspect Element to help with this:
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Yönetici