WordPress widget'ları nasıl eklenir?Tema entegrasyonu Widget'ları alanı

Özel menü özellikleri ve kenar çubuğu widget'ları, evetWordPressTemada öne çıkan özellikler.

• Tema yapmak, bu iki işlevi içermiyorsa tavuk kaburga gibidir...

Chen WeiliangöncekindeBir istasyon inşa etBu derste, bir WordPress temasının nasıl verileceğini paylaşıyorumÖzel menü ekleyin.

Bu makale, bir tema oluştururken özel widget işlevlerinin nasıl ekleneceğini açıklar.

Tıpkı temalara özel menüler eklemek gibi, özel widget eklemek de yalnızca 3 adım sürer.

İlk adım, gadget kaydı

Widget'ı kullanmak için öncelikle kayıt olmanız, WordPress temasının altındaki function.php dosyasını açmanız,

Functions.php dosyasına aşağıdaki kodu ekleyin:

<?php

//侧边栏小工具
if ( function_exists('register_sidebar') ) {
    register_sidebar( array(
        'name' => __( 'Top Sidebar' ),
        'id' => 'top-sidebar',
        'description' => __( 'The top sidebar' ),
        'before_widget' => '<li>',
        'after_widget' => '</li>',
        'before_title' => '<h2>',
        'after_title' => '</h2>',
    ) );
}

?>

Sidebar.php'deki etiketlere karşılık gelecek şekilde function.php içindeki li ve h2 etiketlerini değiştirin:

'before_widget' ve 'after_widget' li ve modül h2 başlıkları, gerçek duruma göre kodu değiştirir.

(belki değişiklik yapılmadan)

        'before_widget' => '<li>',
        'after_widget' => '</li>',

        'before_title' => '<h2>',
        'after_title' => '</h2>',

Yukarıdaki kod, "üst kenar çubuğu" adlı bir pencere öğesi alanını kaydeder:

• Görüntülenen ad "Üst Kenar Çubuğu" dur.
• Başlığa bir h2 etiketi ekleyin.
• İçerik öğeleri li ile etiketlenir.

登录WordPress arka ucuPano, Görünüm → Widget'lar'a gidin.

Aşağıdaki resmin sağ tarafında Üst Kenar Çubuğu widget alanını görüyorsanız, kayıt başarılı demektir ▼

İkinci adım, gadget çağrısı

Gadget kaydedildikten sonra tema şablon dosyasında çağrılabilir ve aşağıdaki kod sidebar.php dosyasında çağrılabilir.

1) sidebar.php dosyasında, en büyük li veya div etiketinin altına ▼ yazın.

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(top-sidebar) ) : ?>

2) sidebar.php dosyasındaki en büyükveyaYukarıya ▼ ekleyin

<?php endif; ?>

XNUMX. Adım: Widget'ları ayarlayın

1) Gadget kaydedilir ve görüntüleme konumu da tema dosyasında tanımlanır.

• Widget grubu alanını WordPress arka planında ayarlayabilirsiniz ▼

2) Kaydettikten sonra ön sayfayı yenileyin.

• Web sitemizin kenar çubuğu aşağıdaki resimdeki gibi görünecek ▼

Gadget'ımızın yapıldığını ve her zamanki gibi çalıştığını gösteren yukarıdaki resmi görebilirsiniz.

Farklı alanlara birden fazla WordPress widget'ı nasıl eklenir?

WordPress temanızın farklı konumlarda widget'ları desteklemesini sağlamak için XNUMX. ve XNUMX. adımları tekrarlayın.

Temanın başlığına, kenar çubuğuna ve altına bir widget eklemeniz gerektiğini varsayalım.

1) Öncelikle aşağıdaki kodu function.php dosyasına kopyalamanız gerekir ▼

if (function_exists('register_sidebar')) {

register_sidebar(array(
'name' => 'Header',
'id' => 'header',
'description' => 'This is the widgetized header.',
'before_widget' => '<div id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>'
));
register_sidebar(array(
'name' => 'Sidebar',
'id' => 'sidebar',
'description' => 'This is the widgetized sidebar.',
'before_widget' => '<div id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>'
));
register_sidebar(array(
'name' => 'Footer',
'id' => 'footer',
'description' => 'This is the widgetized footer.',
'before_widget' => '<div id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>'
));

}

2) Ardından sırasıyla header.php, sidebar.php ve footer.php dosyalarına aşağıdaki kodu ekleyin.

başlık.php ▼

<div id="widgetized-header">

<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('header')) : else : ?>

<div>
<p><strong>Widgetized Header</strong></p>
<p>This panel is active and ready for you to add some widgets via the WP Admin</p>
</div>

<?php endif; ?>

</div>

kenar çubuğu.php ▼

<div id="widgetized-sidebar">

<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('sidebar')) : else : ?>

<div>
<p><strong>Widgetized Sidebar</strong></p>
<p>This panel is active and ready for you to add some widgets via the WP Admin</p>
</div>

<?php endif; ?>

</div>

altbilgi.php ▼

<div id="widgetized-footer">

<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('footer')) : else : ?>

<div>
<p><strong>Widgetized Footer</strong></p>
<p>This panel is active and ready for you to add some widgets via the WP Admin</p>
</div>

<?php endif; ?>

</div>

Bu bir başarı!

• Elbette, koddaki çeşitli ayrıntıları ihtiyaçlarınıza göre de değiştirebilirsiniz ^_^
• Yukarıdaki 2 adım, temanın geri kalanının widget'ın işlevselliğini entegre etmesine izin verir.

Ardından, WordPress'te widget'ları kullanmayla ilgili ipuçlarını paylaşmaya devam edin.

WordPress Tema Entegrasyon Widget Widget İpuçları

Özel widget'ları verimli bir şekilde yönetin:

1) Temaya widget'lar ekledikten sonra ayrı bir dosya oluşturup adını verebilirsiniz.widgets.php.

• 1. adımda eklenen tüm özel widget kodunu bu klasöre kaydetmek için.

2) Kodu functions.php dosyasına ekleyin:

if ($wp_version >= 2.8) require_once(TEMPLATEPATH.’/widgets.php’);

3) 1. adımda eklenen tüm özel widget widget kodunu widgets.php dosyasına kaydedin.

Bu yöntem, tüm widget'ların sorunsuz yüklenmesini ve widget'ları destekleyen tüm WordPress sürümlerinde çalışmasını sağlar.

Bu şekilde, WordPress tema dosyalarınızı daha verimli bir şekilde yönetebilirsiniz.