Bagaimana cara menambahkan widget WordPress?Area widget integrasi tema

Fitur menu custom dan widget sidebar yaWordPressFitur unggulan dalam tema.

• Membuat tema, jika tidak menyertakan dua fungsi ini, seperti iga ayam...

Chen Weiliangsebelumnyamembangun situs webDalam tutorial ini, saya membagikan cara memberi tema WordPressTambahkan menu khusus.

Artikel ini menjelaskan cara menambahkan fungsi widget khusus saat membuat tema.

Sama seperti menambahkan menu kustom ke tema, menambahkan widget kustom hanya membutuhkan 3 langkah.

Langkah pertama, pendaftaran gadget

Untuk menggunakan widget, Anda harus mendaftar terlebih dahulu, buka file functions.php di bawah tema WordPress,

Pada file functions.php, tambahkan kode berikut:

<?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>',
    ) );
}

?>

Ubah tag li dan h2 di functions.php agar sesuai dengan tag di sidebar.php:

Judul li dan modul h2 'before_widget' dan 'after_widget', memodifikasi kode sesuai dengan situasi aktual.

(mungkin tanpa modifikasi)

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

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

Kode di atas mendaftarkan area widget bernama "top-sidebar":

• Nama yang ditampilkan adalah "Top Sidebar".
• Tambahkan tag h2 ke judul.
• Item konten ditandai dengan li.

登录Backend WordPressDasbor, buka Penampilan → Widget.

Jika Anda dapat melihat area widget Top Sidebar di sisi kanan gambar di bawah ini, itu berarti pendaftaran berhasil

Langkah kedua, panggilan gadget

Setelah gadget terdaftar, bisa dipanggil di file template tema, dan kode berikut bisa dipanggil di file sidebar.php.

1) Di file sidebar.php, di bawah tag li atau div terbesar, masukkan

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

2) Di file sidebar.php, yang terbesaratauDi atas, tambahkan

<?php endif; ?>

Langkah XNUMX: Siapkan widget

1) Gadget terdaftar, dan posisi tampilan juga ditentukan dalam file tema.

• Anda dapat mengatur area grup widget di latar belakang WordPress

2) Setelah menyimpan, segarkan halaman depan.

• Bilah sisi situs web kami akan terlihat seperti gambar di bawah ini

Anda dapat melihat gambar di atas, yang menunjukkan bahwa gadget kita telah dibuat dan berjalan seperti biasa.

Bagaimana cara menambahkan beberapa widget WordPress di area yang berbeda?

Ulangi langkah XNUMX dan XNUMX untuk membuat widget pendukung tema WordPress Anda di lokasi yang berbeda.

Misalkan Anda perlu menambahkan widget ke header, sidebar, dan bagian bawah tema.

1) Pertama, Anda perlu menyalin kode berikut ke dalam file functions.php

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) Selanjutnya, tambahkan kode berikut ke file header.php, sidebar.php dan footer.php masing-masing.

header.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>

sidebar.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>

footer.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>

Ini adalah sebuah kesuksesan!

• Tentu saja, Anda juga dapat memodifikasi berbagai detail dalam kode sesuai dengan kebutuhan Anda ^_^
• 2 langkah di atas, izinkan tema lainnya untuk mengintegrasikan fungsionalitas widget.

Selanjutnya, terus berbagi tips menggunakan widget di WordPress.

Tips Widget Widget Integrasi Tema WordPress

Kelola widget khusus secara efisien:

1) Setelah menambahkan widget ke tema, Anda dapat membuat file terpisah dan menamainyawidgets.php.

• Untuk menyimpan semua kode widget khusus yang ditambahkan pada langkah 1 ke folder ini.

2) Tambahkan kode ke file functions.php:

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

3) Simpan semua kode widget widget khusus yang ditambahkan pada langkah 1 ke file widgets.php.

Metode ini memastikan bahwa semua widget dimuat dengan lancar dan berfungsi di semua versi WordPress yang mendukung widget.

Dengan cara ini, Anda dapat mengelola file tema WordPress Anda dengan lebih efisien.