WordPress Gezinme Menüsünüzü Ayarlamanın 12 Olağanüstü Yolu
WordPress Navigasyon menüsünü ayarlamanın yollarını bulmak çevrimiçi yaygın bir taleptir. Bu anlaşılabilir çünkü navigasyon herhangi bir web sitesinin merkezi unsurlarından biridir. Ziyaretçilere tur yapmaya rehberlik eder ve kullanıcının deneyimine ve kullanıcı misafirperverliğine (veya eksikliklerine) genel olarak çok katkıda bulunur. Kendi WordPress sitenizdeki Gezinme menüsünü ayarlamanın yollarını arıyorsanız, doğru yere geldiniz. Bu yazıda, sitenizin navigasyonunu içerik, tasarım ve pozisyon açısından nasıl değiştirebileceğinizin çeşitli yollarını tartışacağız. Sonunda, tam olarak istediğiniz gibi olmanızı ve ziyaretçilerinize ihtiyacınız olmanızı istiyoruz.
Bu konuda birlikte gezinmeye hazır (evet, oyunun bir kavanozuna bir dolar koydum mu)? O zaman gidelim. WordPress Yönetici Gösterge Tablosu’na menüyü nasıl ekleyip yapılandırır ve yapılandırır Önce WordPress’in doğuştan gelen işlevleri hakkında konuşalım. CMS, görünüm> menü altındaki gezinme menüsü ile ilgili tümü kontrol etmenizi sağlar.
1. Sitenizden bu bölüme ilk geldiğinizde, yukarıdaki gibi boş hissedebilirsiniz. Öyleyse, ilk iş sıranız, menünüzün adını en üstte girmektir. Bundan sonra Menü Oluştur düğmesini tıklayın. 2. Menü öğesini ekle yaptığınızda, soldaki seçenek kullanılabilir olacaktır. Burada yeni oluşturulan menüye öğe ekleyebilirsiniz. Örneğin, sayfaların altında, WordPress Navigasyon menünüzde görüntülemek istediğiniz sayfa adının yanındaki kutuyu işaretleyin. All’a tıklayın veya aşağıda aradığınız sayfayı bulamıyorsanız arayın. Doğru sayfayı bulduğunuzda ve kutuyu kontrol ettiğinizde (aynı anda birkaç seçenek mümkündür), alttaki menüye ekle tuşuna basın.
Seçiminiz sağda görünecektir. Gönderi ve kategoriler aynı şekilde, yalnızca diğer içerik türleri için. Özel bağlantılar biraz farklıdır çünkü URL’yi ve ayrıca menüye eklemeden önce bağlantının metnini (Navigasyon menüsünde görünecek etiket) girmeniz gerekir. Ancak bunun yanı sıra farklı değil. Not: Navigasyon menünüzden insanları harici URL’lere göndermek için seçenekler eklemek istiyorsanız, özel URL seçenekleri iyi bir çözümdür. WordPress ayrıca ana sayfa seçeneği için otomatik olarak kullanır. 3. Menü öğesini ve etiketi ayarlayın Menü öğesini ekledikten sonra ayarlama zamanı. Yapabileceğiniz ilk şey siparişi değiştirmek. Bunun için, farenizle öğeyi istediğiniz sıraya sürükleyip bırakın. Ayrıca sağa taşıyabilir ve birisi imleci ebeveynlerine yönlendirdiğinde görünecek bir alt menü öğesi yapabilirsiniz. Küçük bir ok sembolüne tıkladığınızda, ek seçenekler açarlar. İlk olarak, menü etiketini (sitedeki menüde görünecek metin) istediğiniz her şeye değiştirme imkanı vardır. WordPress ayrıca orijinal başlığı da görüntüler, bu nedenle hangi sayfanın kafası karışmazsınız. İkincisi, menü öğesinin konumunda daha önce de tıklama yoluyla aynı değişikliği yapmanızı sağlayan bir bağlantı bulursunuz. Ayrıca, burada daha fazla seçenek sunabilirsiniz. 4. Ekranın üst kısmındaki ekran seçeneğinden yararlanın, tek bir tıklamayla açılabilecek ekran seçeneğini bulabilirsiniz. Burada, WordPress Navigasyon menü öğenizi ayarlamak için ek seçeneklere erişebilirsiniz. Bazıları oldukça teknik, ama yine de tamamlanması için bundan bahsetmeliyiz. En üstte, sitenizde etiket ve diğer içerik veya taksonomi türü ekleme olasılığı olan menü öğeleri eklemek için daha fazla seçeneği etkinleştirebilirsiniz.
Alt adımlarda menü öğeniz için ek bir ayar vardır: Hedef Bağlantı – Bu etkinken, tıklandığında yeni bir sekmede açmak için tek bir menü öğesi ayarlayabilirsiniz. Bu, üçüncü taraf bağlantıları için çok kullanışlıdır.
Başlık özniteliği – Buradaki metin, birisi imleci menü bağlantısına yönlendirdiğinde tarayıcıda bir araç ipucu olarak görünür.
CSS Sınıfı – Özel bir stil uygulamak için menü öğesine özel bir CSS sınıfı eklemenizi sağlar. Aşağıda daha fazla bilgi.
Bağlantı İlişkisi (XFN) – Bağladığınız siteyle ilişkinizi göstermek için harici bağlantıya ekleyebileceğiniz özel bir özellik. Detaylar burada.
Açıklama – Ziyaretçileriniz için menü öğesinin bir açıklamasını eklemenizi sağlar, bu da temanız onu destekliyorsa görünecektir. Hepsi açık mı? O zaman bu menüyü kaldıralım.
5. Meninizi yayınlayın Seçiminizden memnun kaldığınızda ve menünüzü doldurun, yayınlama zamanı. Bunu yapmak için iki seçeneğiniz var: Bunlardan biri menü ayarlarının altındaki ekran konumunu seçmektir.
Kutuyu kontrol ederek konumu seçin (buradaki seçenek temanıza bağlıdır ve bazıları daha önce seçilmiş olabilir) ve büyük bir mavide menü kaydet düğmesini tıklayın. Tamamlandı. Ya da, konumun üst kısmının altında, temanızdaki menü konumlarının bir listesini de buldunuz.
Burada, açılır listeden belirli bir konuma ayarlamak istediğinizi seçin ve alttaki değişikliğe basın. Ya yeni menünüzün sitenize itilmesine neden olur.
Bu arada, sitenizdeki herhangi bir widget alanına altbilgi gibi herhangi bir menüyü de ekleyebilirsiniz. Bunun için, sadece görünüm> widget’ları açın, Gezinme Menüsü widget’ını kullanılabilir widget alanına sürükleyin ve istenen menüyü açığa çıkarın. Kaydet ve bitmişsin. WordPress Navigasyon menüsünü ayarlamanın devam eden yolu sorun değil, gezinme menüsünü ayarlamak için tüm orijinal WordPress yöntemi bu. Bununla birlikte, renkleri değiştirme, diğer tasarım yönlerini veya menü konumları gibi daha sofistike değişiklikler yapmak istiyorsanız ne olur? Şimdi konuşacağımız şey bu. Aşağıdaki örnek için yirmi yirmi temayı kullanacağız, bu nedenle kod örneği her zaman birbirine tema için geçerli değildir. Ancak, mevcut tema işaretlemenizle nasıl çalışmasını nasıl sağlayacağınızı da göstereceğiz. Buna ek olarak, bunu yalnızca masaüstü ekranında görüntüleriz (değilse, yazı çok uzun olacaktır). Menünün mobil cihazlarda da iyi görünmesi için duyarlı tasarımınıza dikkat etmeyi unutmayın! 1. Doğru CSS Seçmenlerini Bulun WordPress Navigasyon Menüsünü İhtiyaçlarınıza göre tam olarak değiştirmek istiyorsanız, küçük bir CSS (veya alternatif olarak WordPress sayfa üreticisi olarak) boşa harcamanıza gerek yok. Bunun için, Standart NAVPress menüsünün, Denizci Olmayan HTML listesi olarak oluşturulduğunu anlayın. WordPress menüsünden tipik HTML çıkışı şöyle görünüyor: Yukarıda, menünüzü düzenlemek için aşağıdaki CSS seçmenlerini sunar: Menü Konteyneri: #Site-Header. Primary-menu-wrapper
Menü Listesi Öğeleri: #Site-Header UL. Primary-Menu
Navigasyon Öğesi: #Site-Header. Primary-menu li Navigasyon Öğesi Bağlantısı: #Site-Header. Primary-Menu Li A
Alt menü listesi öğeleri: #site-başlık. Primary-menu li ul
Açılır alt menü öğesi: #site-header. Primary-menu li li
Sub-menu bağlantısı #site-başlık. Birincil-menu li li a-redes aşağı: #site-başlık. Primary-menu li l a
Belirtildiği gibi, bu bir temadan diğerine biraz değişir. Yaptığınız şey için doğru seçmenleri bulmak için bir tarayıcı geliştiricisi kullanın. Temel olarak, değiştirmek istediğiniz öğeyi sağlayın ve öğeyi inceleyin.
Bu, HTML menü yapınızı ve CSS seçmenlerini ve buna uygulanan stili görebileceğiniz bir geliştirici aracı açacaktır.
Bu bilgi, değiştirmenize veya geçiş yapmanıza izin verecektir (birçok değişiklik yaparsanız, çocuk temasını kullanın). Açıkçası şimdiye kadar? Ardından, WordPress Navigasyon menüsünü bu şekilde nasıl ayarlayabileceğinize dair bazı örnekleri tartışalım. 2. Menü Rengi Değiştir Menünün rengini değiştirin ve menü öğeleri en kolay değişikliklerden biridir. Burada birkaç seçeneğiniz var. Onları tek tek tartışalım. İlk menünün arka planını değiştirmek menünün arka planıdır. Birçok temada, gezinme menüsü başlığın bir parçasıdır, bu nedenle arka planını değiştirmek için başlığın rengini şöyle değiştireceksiniz: #site-header {arka plan: #ced0ce; } İşte sonuçlar: Bununla birlikte, bu her zaman gerçekleşmez, bazı temaların bağımsız navigasyon bıçakları vardır. Burada, menü sarma öğesini hedefleyerek menünün arka plan rengini ayarlayabilirsiniz.
Bu işaretlemenin görünümüdür:. Navigasyon-Top {arka plan: #ced0ce; } Hangi öğe temanıza bağlı olarak doğrudur, bu yüzden geliştiriciden yararlanın. Arka plan rengini değiştirdiğinizde yazı tipi renkleriyle oynamak, büyük olasılıkla yazı tipiyle eşleşmez. Bu nedenle, her şeyin birbirine uymasını sağlamak için de nasıl değişiklik yapacağınızı öğrenmeniz önemlidir. Genel olarak, WordPress navigasyon menüsü, liste öğeleri (HTML’de LI) içeren (HTML’de LI) (HTML’de LI) olan Söz konusu listelerden (HTML’de LI) oluştuğundan, aşağıdaki işaretleme ile hedefleyebilirsiniz: #site-header. Birincil- menü li A {renk: #000; } Yukarıdaki kodun aşağıdaki etkisi vardır:
Aynı işaretleme ayrıca sahte sınıf kullanmanıza izin verir: Birisi yönlendirdiğinde menü öğelerine efekt eklemek için havada: #site-header. Primary-menu li A: Hover {Metin-Decoration: Underline gibi bir fare ile zirveye çıkın noktalı;} Bunu yaparken de görmek isteyebilirsiniz: Active ,: link ve: ziyaret.W3Schools başlamak için iyi bir yer.Son olarak, menü öğesine özel bir sınıf ayarlamak ve gerektiğinde bunları tek tek hedeflemek için WordPress menü ayarlarında yukarıda belirtilen işlevselliği kullanabilirsiniz. Şimdi aşağıdaki işaretlemeyi kullandığınızda:. CD2653! Önemli;} Bu efekti alırsınız: 3. Menü Konumunu Değiştir WordPress menüsünü ayarlamanın en yaygın çevrimiçi yollarından biri, gezinme menüsünü taşımak veya konumunu değiştirmektir. Ek menünün konumu sitenizde bulunur, önce kaydetmeniz gerekir. Bu, function’unuzda olur.PHP temanız Register_nav_menu (bir menü için) veya register_nav_menus (aynı anda birden fazla menü konumu yapmak için). Bu nedenle, Site menünüz hakkında daha fazla bilgi edinmek istiyorsanız, ilk adım, fragman gibi bir şey için fragman.php dosyanızı (parent) kontrol etmektir. İşlev yirmitwenty_menus () {$ locations = array (‘birincil’ => __ (‘masaüstü yatay menü’, ‘yirmiTwenty’), ‘genişletilmiş’ => __ (‘masaüstü genişletilmiş menü’, ‘yirmiTwenty’), ‘mobil’ = > __ (‘Mobil Menü’, ‘YirmiTwenty’), ‘Footer’ => __ (‘Altbilgi Menüsü’, ‘Twentytwenty’), ‘Social’ => __ (‘Sosyal Menü’, ‘Twentytwenty’),); Register_nav_menus ($ konumlar); } Add_action (‘init’, ‘Twentytwenty_Menus’); Bu size WordPress şablon dosyasındaki menü için kullanılan adı ve arkada olduğunu söyler (daha önce yönetme konumları altında gördüğümüz işlevdeki uygun etikete dikkat edin). Menü adını bildikten sonra, a) tema dosyanızdaki konumu bulabilir ve b) Gezinme menüsünü istediğiniz yere taşıyın. Her ikisi için, WordPress’e kayıtlı gezinme menüsü içeriğini görüntülemek için bir yer söyleyen WP_NAV_MENU işlevine ihtiyacınız var. Örneğin, varsayılan olarak yirmi yirmide ana menünün ne görüntülenmesini zaten biliyoruz. Header.php’deki uygun işaretleme şöyle görünüyor: Şimdi menüyü site-başlık öğesinin altına taşımak için dosyayı değiştirin (tekrar, lütfen çocuk temasını kullanın), şöyle bir şey elde ederiz: Tabii ki, bu da küçük bir stil gerektirir. WP_NAV_MENU Resmi belgelerde bulabileceğiniz çıktıyı değiştirmek için daha fazla seçenek. Tabii ki, işlevi sadece mevcut işaretlemeyi taşımakla kalmaz, istediğiniz yere kaydetmek için de kullanabilirsiniz. Yapışkan bir menü oluşturun WordPress Navigation menüsü genellikle sitenin üst kısmındadır ve aşağı kaydırdığınızda kaybolur. Yapışkan bir menü ile aşağı hareket etseniz bile yukarıda kalır.
