Web Sitenizin Başlığına Bir WordPress Widget'ı Nasıl Eklenir (2 Yol)


Web sitenizin başlık alanına bir WordPress widget'ı eklemek ister misiniz?

Widget'lar, temanızın belirli bölümlerine kolayca içerik blokları eklemenize olanak tanır, ancak her tema bir başlık widget alanı içermez.

Bu makalede, web sitenizin başlığına nasıl kolayca bir WordPress widget'ı ekleyeceğinizi göstereceğiz.

How to add a WordPress widget to your website header (2 ways)

WordPress Sitenize Neden Başlık Widget'ı Eklemelisiniz?

Web sitenizin başlığı, ziyaretçilerinizin WordPress web sitenizi ziyaret ederken göreceği ilk şeylerden biridir. Başlığınıza bir WordPress widget'ı ekleyerek, okuyucunun dikkatini çekmeye yardımcı olmak için bu alanı optimize edebilirsiniz.

Çoğu web sitesi başlığı, ziyaretçilerin sitenizde gezinmesine yardımcı olmak için özel bir logo ve bir gezinme menüsü içerir.

Ayrıca faydalı içerik, başlık reklamları, sınırlı süreli teklifler, tek satırlık formlar ve daha fazlasını öne çıkarmak için bu alanın üstüne veya altına bir başlık widget'ı ekleyebilirsiniz.

Burada, WPBeginner'da, doğrudan gezinme menüsünün altında bir üstbilgi harekete geçirici mesajımız var.

Header CTA example

Çoğu WordPress temasının kenar çubuğunda ve sitenin alt bilgi alanlarında widget'a hazır alanları vardır, ancak her tema üstbilgiye widget'a hazır alanlar eklemez.

Ama önce, mevcut temanızda web sitenizin başlığına nasıl bir WordPress widget'ı ekleyeceğinize bir göz atalım. Doğrudan kullanmak istediğiniz yönteme atlamak için aşağıdaki hızlı bağlantıları kullanın.

  • WordPress tema ayarlarına bir WordPress başlık widget'ı ekleyin
  • WordPress'e kod ekleyerek bir WordPress başlık widget'ı ekleyin

En iyi WordPress temalarının çoğu, beğeninize göre özelleştirebileceğiniz bir başlık widget alanı içerir.

İlk olarak, mevcut WordPress temanızın başlıkta bir WordPress widget alanını destekleyip desteklemediğini görmek isteyeceksiniz.

Bunu, WordPress tema özelleştiricisine veya WordPress yönetici panelinizin widget alanına giderek bulabilirsiniz. Bunu yapmak için Görünüm » Özelleştir'e gidin ve başlığı düzenleme seçeneği olup olmadığına bakın.

Bu örnekte, ücretsiz Astra temasının 'Başlık Oluşturucu' adlı bir seçeneği vardır. Astra'da bu özelliği nasıl kullanacağınızı size göstereceğiz, ancak bunun kullandığınız temaya bağlı olarak farklı görüneceğini unutmayın.

Astra header builder

Bunu tıklarsanız, başlığınızı düzenlemek ve widget eklemek için sizi bir ekrana getirir.

Ekranın alt kısmında, başlığın üstündeki ve altındaki alanlarla birlikte başlığı tamamen özelleştirebilirsiniz. Boş alanlardan birinin üzerine gelin ve 'Artı' simgesini tıklayın.

Click plus icon

Bu, 'Widget 1'i seçebileceğiniz bir açılır menü getirir.

Aralarından seçim yapabileceğiniz ek seçenekler vardır, ancak başlık widget'ını hazır hale getirmek için 'Widget' seçeneklerinden birini seçmeniz gerekir.

Select widget 1 option

Başlığınıza bir widget alanı eklemek için, başlık özelleştirici bölümündeki 'Widget 1' kutusunu tıklayın.

Bu, bir widget ekleme seçeneğini getirir.

Click widget 1 box

Ardından, soldaki menüde 'Artı' blok ekle simgesini tıklayın.

Bu, başlığınıza eklemek için bir widget seçebileceğiniz bir açılır pencere açar.

Click plus icon and select widget

Başlığınızı özelleştirmeye devam edebilir ve istediğiniz kadar widget ekleyebilirsiniz.

İşiniz bittiğinde, değişikliklerinizi kaydetmek için 'Yayınla' düğmesini tıkladığınızdan emin olun.

Publish header widget changes

Artık eklediğiniz widget veya widget'larla başlık alanınızı görüntüleyebilirsiniz.

Header widget example

Astra'yı kullanmıyor musunuz?

Temanızın zaten bir WordPress başlık widget'ına sahip olup olmadığını görmenin başka bir yolu, WordPress yönetici panelinizdeki Görünüm » Widget'lara gitmektir.

Ardından, 'Başlık' veya benzeri bir etiketli bir widget bölümü olup olmadığına bakın.

Go to widgets section for header widget

Varsa, widget'lar menüsünü getirmek için 'Artı' blok ekle simgesini tıklamanız yeterlidir.

Ardından üzerine tıklayarak istediğiniz widget'ı ekleyebilirsiniz.

Header widget section

Başlık widget alanında yaptığınız değişiklikleri kaydetmek için 'Güncelle' düğmesini tıkladığınızdan emin olun.

WordPress temanızın başlığında şu anda bir WordPress widget alanı yoksa, WordPress'e kod ekleyerek manuel olarak eklemeniz gerekir.

Bunu daha önce yapmadıysanız, WordPress'te kodu nasıl kopyalayıp yapıştıracağınızla ilgili kılavuzumuza bakın.

Ardından, aşağıdaki kod parçacığını function.php dosyanıza, siteye özel bir eklentide veya bir kod parçacıkları eklentisi kullanarak ekleyebilirsiniz.

 function wpb_widgets_init() { register_sidebar( array( 'name' => 'Custom Header Widget Area', 'id' => 'custom-header-widget', 'before_widget' => '
', 'after_widget' => '
', 'önce_başlık' => '

', 'after_title' => '

', ) ); } add_action('widgets_init', 'wpb_widgets_init');

Bu kod, temanız için yeni bir kenar çubuğu veya widget'a hazır bir alan kaydeder.

Görünüm » Widget'lara giderseniz, 'Custom Header Widget Alanı' etiketli yeni bir widget alanı göreceksiniz.

Custom header widget area

Artık bu yeni alana widget'larınızı ekleyebilirsiniz. Daha fazla ayrıntı için WordPress'te widget ekleme ve kullanma kılavuzumuza bakın.

Ancak, başlık widget'ınız henüz web sitenizde canlı olarak görüntülenmeyecektir. Bunu nasıl yapacağınızı size daha sonra göstereceğiz.

WordPress'te Özel Başlık Widget'ınızı Görüntüleme

Başlık widget alanını oluşturduğunuza göre, WordPress'e bunu web sitenizde nerede görüntüleyeceğini söylemeniz gerekir.

Bunu yapmak için temanızın header.php dosyasını düzenlemeniz gerekir. Ardından, widget'ın görüntülenmesini istediğiniz yere aşağıdaki kodu eklemeniz gerekir.

Bu kod, daha önce oluşturduğunuz widget alanını web sitenizin başlık alanına ekleyecektir.

Artık başlık widget alanınızı canlı olarak görmek için WordPress blogunuzu ziyaret edebilirsiniz.

Header widget live

WordPress Başlık Widget Alanınızı CSS Kullanarak Stillendirin

Temanıza bağlı olarak, başlık pencere öğesi alanının ve içindeki her bir pencere öğesinin nasıl görüntüleneceğini kontrol etmek için WordPress'e CSS eklemeniz de gerekebilir. CSS bilmiyorsan onun yerine CSS Hero gibi bir eklenti kullanabilirsin.

Daha fazla bilgi edinmek için WordPress sitenize özel CSS'yi nasıl kolayca ekleyeceğiniz konusunda kılavuzumuza bakın.

Ardından, WordPress yönetici panelinizde Görünüm » Özelleştir'e gidin.

Bu, WordPress tema özelleştirici panelini getirir. 'Ek CSS' sekmesine tıklamanız gerekiyor.

WordPress customizer additional CSS

Bu, doğrudan temanıza ek CSS eklemenize ve değişiklikleri gerçek zamanlı olarak görmenize olanak tanır.

Başlamanıza yardımcı olacak bazı örnek CSS kodları:

 div#header-widget-alan { genişlik: %100; arka plan rengi: #f7f7f7; kenarlık-alt:1px düz #eeeeee; metin hizalama: merkez; dolgu: 20 piksel; } h2.chw-title { margin-top: 0px; metin hizalama: sola; metin dönüştürme: büyük harf; yazı tipi boyutu: küçük; arka plan rengi: #feffce; genişlik: 130 piksel; dolgu: 5 piksel; }

CSS kodunu 'Ek CSS' kutusuna eklemeniz yeterlidir.

Add CSS code and publish

CSS'nizi eklemeyi bitirdikten sonra, değişikliklerinizi kaydetmek için 'Yayınla' düğmesini tıkladığınızdan emin olun.

Özel başlık widget'ının canlı CSS değişiklikleriyle nasıl göründüğü aşağıda açıklanmıştır.

Header widget example after CSS

Bu makalenin, web sitenizin başlığına bir WordPress widget'ını nasıl ekleyeceğinizi öğrenmenize yardımcı olacağını umuyoruz. Ayrıca, en iyi WordPress barındırma hizmetinin nasıl seçileceğine ilişkin kılavuzumuzu ve küçük işletmeler için en iyi canlı sohbet yazılımı konusunda uzman seçimlerimizi görmek isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi Twitter ve Facebook'ta da bulabilirsiniz.

Açıklama: İçeriğimiz okuyucu desteklidir. Bu, bağlantılarımızdan bazılarına tıklarsanız bir komisyon kazanabileceğimiz anlamına gelir. WPBeginner'ın nasıl finanse edildiğini, neden önemli olduğunu ve bizi nasıl destekleyebileceğinizi görün.

Editör Kadrosu Hakkında

WPBeginner'daki Editoryal Personel, Syed Balkhi tarafından yönetilen bir WordPress uzman ekibidir. Dünya çapında 1,3 milyondan fazla okuyucu tarafından güvenilmektedir.

Artık kendi web sitenizi oluşturabilirsiniz. Bugün başlayın… WooCommerce ve WordPress için çok çeşitli eklentiler, uzantılar ve temalar ile EYEWP.COM'dan edinebilirsiniz.

web sitesi oluştur

Geç kalma. EYEWP.COM'u şimdi ziyaret edin!!

WooCommerce Abonelikleri

Müşterilerin ürünlerinize veya hizmetlerinize abone olmasına ve haftalık, aylık veya yıllık olarak ödeme yapmasına izin verin.

Şimdi sahip ol

WooCommerce Rezervasyonları

Müşterilerin sitenizden ayrılmadan randevu almasına, rezervasyon yapmasına veya ekipman kiralamasına izin verin.

Şimdi sahip ol

WooCommerce Google Analytics Pro

WooCommerce sitenize gelişmiş etkinlik takibi ve gelişmiş e-ticaret takibi ekleyin.

Şimdi sahip ol

WooCommerce Abonelik İndirmeleri

Mağazanızda listelenen indirilebilir ürünler aracılığıyla abonelerinize ek indirmeler sunun.

Şimdi sahip ol

WooCommerce Abonelikleri için Geliştirici

Mevcut Kullanıcılar için Fiyat Güncellemesi, İptal Gecikmesi, Otomatik Yenileme Hatırlatıcısı gibi WooCommerce Abonelikleri için ek özellikler.

Şimdi sahip ol

WooCommerce Abonelikleri için Tüm Ürünler

WooCommerce Abonelikleri için bu güçlü eklenti ile mevcut ürünlerinizi abonelikle sunun.

Şimdi sahip ol

WooCommerce Üyelikleri

İçeriğe/ürünlere erişim denetimi ve üye indirimleri ile üyelik derneğinizi, çevrimiçi derginizi, e-öğrenme sitelerinizi ve daha fazlasını güçlendirin.

Şimdi sahip ol

WooCommerce Zapier

WooCommerce mağazanızı bugün 4000'den fazla bulut uygulaması ve hizmetiyle entegre edin. 11.000'den fazla kullanıcı tarafından güvenildi.

Şimdi sahip ol

WooCommerce Ürün Eklentileri

Ürünleriniz için hediye paketleri, özel mesajlar veya diğer özel seçenekler gibi eklentiler sunun.

Şimdi sahip ol

Copyright statement: Unless otherwise noted, this article is Collected from the Internet, please keep the source of the article when reprinting.

Check Also

Divi's Theme Builder ile Özel Global Başlık Nasıl Oluşturulur

Artık Tema Oluşturucu burada olduğuna göre, web sitenizi A'dan Z'ye kurmanıza yardımcı olacak yeni eğitimlere dalmak için sabırsızlanıyoruz. Buna Divi'nin yerleşik seçeneğini kullanarak özel başlıklar oluşturma da dahildir. Bu eğitimde Divi's Theme Builder'ı kullanarak global bir başlık oluşturmaya odaklanacağız. Bu sayfaya veya gönderiye farklı bir başlık atamadıysanız, web sitenizin her yerinde genel bir başlık görünecektir.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir