Ana İçeriğe Geç

WordPress blog başlığına bir widget eklemek nasıl

Divi: Kullanılacak en kolay WordPress teması

Divi: Tüm zamanların en iyi WordPress teması!

daha fazla 600.000 indirmeler, Divi, dünyanın en popüler WordPress teması. Tamamen, kullanımı kolay ve 62 ücretsiz şablonlardan daha fazlasını sunuyor. [Önerilen]

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

Widget'lar, WordPress temanızın belirlenmiş bölümlerine kolayca içerik blokları eklemenizi sağlar.

Bu eğiticide, web sitenizin başlığına nasıl kolayca WordPress widget'ı ekleneceğini göstereceğiz.

not: Bu bir orta seviye öğreticidir. Kod eklemeniz gerekecek WordPress temanızın dosyaları ve bazı CSS’lerde ustalaş.

Ancak herhangi bir değişiklik yapmadan önce yedekleme blogunuza için 5 WordPress eklentileri veya Bir WordPress tema nasıl kurulur et Kaç eklentileri WordPress yüklemeniz gerekir.

O zaman neden burada olduğumuza dönelim.

Başlığa neden ve ne zaman bir widget eklemeniz gerekiyor?

Widget'lar, WordPress temanızdaki belirlenmiş bir alana kolayca içerik blokları eklemenizi sağlar. Bu belirlenmiş alanlara " sidebars "Veya alanları" widget'ları'.

Başlıktaki bir widget alanı, reklamları, en son makaleleri veya ne istersen görüntülemek için kullanılabilir.

Bu etki alanı, tüm popüler web sitelerinde gerçekten önemli bilgiler göstermek için kullanılır.

Çok keşfetmek WordPress'e yükledikten sonra özel widget'lar ekleme

WordPress kafasında bölge widgetisee

Genellikle, WordPress temaları içeriğin yanına veya altbilgi alanına kenar çubukları ekler. Çok az sayıda WordPress teması, içeriğin üstüne veya başlığın üstüne widget alanları ekler.

Biz de keşfetmek için tavsiye Fransızca MailChimp öğretici: Bir haber bülteni oluşturmak için tam bir rehber

Bu yüzden bu derste size WordPress web sitenizin başlığına nasıl bir widget alanı ekleneceğini göstereceğiz.

Adım 1: Bir widget alanı oluşturma

Öncelikle, özel bir widget alanı oluşturmamız gerekiyor. Bu adım, "içinde özel bir widget alanı görmenizi sağlar Görünüm> Widget'lar WordPress panonuzda.

Bu kodu dosyaya eklemeniz gerekecek functions.php Temanın.

işlevi bpc_widgets_init () {register_sidebar (array ('name' => 'Özel Başlık Alanı Widget', 'id' => 'özel başlık-widget', 'before_widget' => '<div class = "chw-widget"> ',' after_widget '=>' </ div> ',' before_title '=>' <h2 class = "chw-title"> ',' after_title '=>' </ h2> ',)); } add_action ('widgets_init', 'bpc_widgets_init');

Bu kod, WordPress temanızda yeni bir kenar çubuğu veya widget alanı kaydeder.

WordPress'i hiç yerel olarak yüklemediyseniz, XAMPP ile bir PC üzerinde yerel WordPress nasıl yüklenir / Windows

Gidebilirsin " Görünüm> Widget'lar Ve "ile işaretlenmiş yeni bir widget alanı göreceksiniz Özel Üstbilgi Widget Alanı '.

yeni WordPress widget bölgesi

Elementor ile web sitenizi kolayca oluşturun

Elementor, profesyonel bir görünüme sahip herhangi bir web sitesi tasarımını kolayca oluşturmanıza olanak sağlar. Kendin yapabileceğin için pahalı ödemeyi kes. [Ücretsiz]

Devam edin ve bu yeni oluşturulan alana bir metin widget'ı ekleyin ve kaydedin.

Ayrıca deneyin widget ekleme rehberimiz.

Adım 2: Widget'ınızı başlıkta gösterin

Web sitenizi ziyaret ederseniz, az önce eklediğiniz metin widget'ini göremezsiniz.

Çünkü size bölgelerinin nasıl görüntüleneceğini henüz göstermedik. özel aletler WordPress.

Bu adımda yapacağımız şey budur.

İşte sizin için de bir listesi Blogunuzun kazancını artırmak için 5 Kritik WordPress eklentileri

Dosyayı düzenlemeniz gerekecek header.php WordPress temanıza ekleyin ve widget'ları görüntülemek istediğiniz yere bu kodu ekleyin.

<? Php if (is_active_sidebar ( 'özel-başlık-Widget')):?> <Div id = "header-widget alanı" class = "CHW-widget alan widget alan" rol = "tamamlayıcı"> <? pHP dynamic_sidebar ( 'özel-başlık-eklendi'); ?> </ Div> <Php endif; ?>

Değişikliklerinizi kaydetmeyi unutmayın.

Daha sonra web sitenizi ziyaret edebilirsiniz ve başlıkta metin widget'ini göreceksiniz.

site demo en tête

Sonuç mutlaka en çekici olmayacak. Bu yüzden CSS'e ihtiyacınız olacak, böylece doğru şekilde görüntüleyebileceksiniz.

3 Adım: CSS başlıklarınıza stil katın

WordPress temanıza bağlı olarak, başlık ve widget alanının nasıl görüntülendiğini kontrol etmek için CSS kodu eklemeniz gerekir.

Bunu yapmanın en kolay yollarından biri CSS Kahramanını kullanmaktır. Bu, bir WordPress temasının CSS'sini değiştirmek için sezgisel bir kullanıcı arayüzü kullanmanıza izin verir.

Bunu keşfetmenizi de öneriyoruz Yellow Pencil WordPress eklentisi ile neler yapabilirsiniz?

Eklenti kullanmak istemiyorsanız, ziyaret ederek WordPress temanıza özel CSS ekleyebilirsiniz. " Görünüm »Kişiselleştir WordPress temasını özelleştirmek için.

Ayrıca bizim makalemizi okuyun. Blog trafiğini iyileştirmek için 10 WordPress eklentileri

En iyi WordPress temalarını ve eklentilerini mi arıyorsunuz?

Envato'daki en iyi eklentileri ve WordPress temalarını indirin ve web sitenizi kolayca oluşturun. 49.720.000 indirme işleminden daha fazla. [ÖZEL]

Bu, WordPress Özelleştirici arayüzünü görüntülemenizi sağlar. «Sekmesine tıklamanız gerekecek« Ek CSS '.

ek css WorDPress

«Sekmesi ek CSS İçinde " Customizer Sağdaki önizlemedeki değişiklikleri izlerken özel CSS'nizi eklemenizi sağlar.

Bu eğitici yazının özündeki nedenlerden dolayı, bu alanı afiş reklamlarını görüntülemek için tek bir widget veya özel bir menü widget'ı eklemek için kullanacağınızı varsayıyoruz.

İşte başlamanıza yardımcı olacak bir CSS örneği:

div # başlık-eklendi alan {genişliği: 100%; Arka plan renkli: #f7f7f7; Çerçeve-alt Katı #eeeeee 1px; text-align: center; } H2.chw başlıktaki {kenar üstü: 0px; text-align: left; Metin-dönüşümü: büyük harf; yazı tipi boyutu: küçük; Arka plan renkli: #feffce; en: 130px; dolgu: 5px; }

İşte özel widget'ımızın Yirmi Onyedi tema başlığında nasıl görüneceği.

demo teması yirmi on yedi wordpress

Ayrıca bazı premium WordPress eklentilerini keşfedin

Modern bir görünüm kazandırmak ve blogunuzun veya web sitenizin rahatlığını artırmak için diğer WordPress eklentilerini kullanabilirsiniz.

Size, bu konuda yardımcı olacak bazı premium WordPress eklentileri sunuyoruz.

1. Smart4y Araç İpucu

Smart4y Tooltip, Javascript kitaplığına bağımlı olmadan modern araç ipuçları oluşturmaya adanmış esnek bir WordPress eklentisidir. Tamamen duyarlı ve HTML içeriği eklemek için yeteneği sunuyor.

Smart4y Tooltip Responsive WordPress Plugin

WYSIWYG editörü, herhangi bir kod girmek zorunda kalmadan her ipucunu görsel olarak oluşturmanıza izin verir, ancak istekliysanız her zaman yapabilirsiniz.

Ayrıca bizim keşfetmek Blogunuzdaki makaleleri değerlendirmek için 10 WordPress eklentileri

Diğer özellikleri: Oluşturucu sayfa desteğiOldukça duyarlı bir düzen, tüm araç ipuçları için genel parametreler belirleyebilme veya her araç ipucu için belirli parametreler tanımlayabilme, önceden tanımlanmış görsel efektler için destek, yeniden boyutlandırılmış pencerede araç ipucunun konumunu hesaplar. ayrıntılı belgeler, vb ...

İndir | Demo | Web hosting

2. Yaslandı

WordPress Justified eklentisi, küçük resimlerinizi Flickr'da olduğu gibi jQuery kullanarak haklı bir ızgarada düzenleyen, duyarlı bir galeri eklentisidir.

WordPress-Fotoğrafçılar için Justified eklentisi,

Galerilerinizi rakiplerinizden ayıran özellikler getiriyor!

Başlıca özellikleri: duyarlı düzen, özel köprü efektleri, otomatik ızgara yeniden hizalama, bir kısa kod editörü, görünüm etamamen özelleştirilebilir, p desteğigörüntüleyenler ve diğerleri

Indir | gösteri | Web hosting

3. E-postaları Planla

Adından da anlaşılacağı gibi bu WordPress eklentisi web sitenizde yayın e-posta planlamanıza olanak sağlar. WordPress eklentisi "Blog Yazımı Takip Et" eklentilerinin uzantısına dayanır. E-postaları Planla Blog Postamı Takip Et wordpress eklentisi

Artık e-postalarınızın yayınlanmasını saat, gün veya hafta bazında planlayabilirsiniz.

Çevrimiçi Mağazanızı kolayca oluşturun

WordPress'te fiziksel ve dijital ürünlerinizi satmak için ücretsiz WooCommerce, en iyi e-ticaret eklentilerini indirin. [Önerilen]

Ayrıca bizim makalemizi okuyun. Web sitenizdeki haritaları kullanmak için 10 WordPress eklentileri

Her bildirim için her e-posta yerine tüm bildirimler için birleştirilmiş e-posta gönderme olanağı sunar ve ayrıca e-postalarınızın alınmasını daha sindirilebilir hale getirmek için farklı e-postalar için farklı e-posta şablonları tanımlamanıza olanak tanır .

Indir | gösteri |Web hosting

Önerilen Kaynaklar

Web sitenizi oluştururken ve yönetirken size eşlik edecek diğer önerilen kaynakları keşfedin.

Sonuç

İşte bu! Hepsi bu ders için, umarım WordPress temanızın başlığına bir widget alanı eklemenize yardımcı olur. Tereddüt etmeyin En sevdiğiniz sosyal ağlarda arkadaşlarınızla paylaşın.

Bununla birlikte, ayrıca bize danışabilirsiniz kaynakların bulunduğuİnternet siteleri oluşturma projelerinizi yürütmek için daha fazla elemana ihtiyacınız varsa, WordPress blog oluşturma.

Öneriniz veya yorumunuz varsa, bunları bölümümüzde bırakın. Yorumlar.

...

Bu makale yorumları 8 içeriyor

  1. Selam! "İndir" ve "E-tablolar" ın yanındaki tıklanabilir düğmeler dahil olmak üzere, bu makalenin başında kullanılana benzer bir "bilgi kutusu" nu nasıl koyacağımı bana söyleme şansınız olup olmadığını bilmek isterim. düzen çok güzel. Teşekkür ederim!

  2. Efendim, denedim. Gerçekten de, widget'ların sayfası, widget'ların eklenmesini tanımlamaktadır. Ve ekledim. Adım 2 php başlığına kodu girmek için başarısız olduğunda. Tahmin et 2, hata nedir, efendim?

  3. Yeni bir widget bölgesi oluşturmaktan oluşan ilk kodda "function" yazarak başlayın, ancak "function" ile başladığını söyleyebilirim. Aslında, bu kod yazarken hata yapan birkaç hata içeriyor. Düzeltilmiş olduğunu takdir ediyorum.

  4. 🙂 Her şey yolunda, sadece kendi yönetim kurullarında kimse kodu "functions.php eklemek için nerede açıklar! Bu önemli! Herkes "farklı" temaları kullanır ...

  5. Merhaba,

    Bu destekler için teşekkür ederiz.

    Arama çubuğunu özel başlığa ekleyebildim. Eksileri ile tarzı özelleştirmek daha karmaşık ...

    Boyut, konumu (üstbilginin tüm genişliğini almaz) yanı sıra arka plan rengini değiştirmek istiyorum.

    Şimdiden teşekkür ederiz.

YORUM BIRAKIN

E-posta adresiniz gösterilmeyecektir. Doldurulması zorunlu alanlar * ile işaretlenmiştir *

Bu site, istenmeyenleri azaltmak için Akismet'i kullanıyor. Yorum verilerinizin nasıl kullanıldığı hakkında daha fazla bilgi edinin..

Başa dönüş
6 hisseleri
hisse1
cıvıltı
Enregistrer5