Bagaimana saya bisa memodifikasi output widget default WordPress?

Saya tidak ingin mendesain widget default dengan hanya CSS. Saya ingin menampilkan konten widget 'Kategori' default dengan struktur HTML saya sendiri.

Apakah ada filter atau pengait untuk melakukan itu?

Untuk memperluas jawaban Mark, tidak banyak (umumnya) tersedia filter filter pada widget WordPress default (kecuali mungkin widget_text).

Tetapi menambahkan widget kustom Anda sendiri mudah - letakkan ini di functions.php:

require_once("my_widget.php");
add_action("widgets_init", "my_custom_widgets_init");

function my_custom_widgets_init(){
  register_widget("My_Custom_Widget_Class");
}

Kemudian Anda hanya ingin menyalin widget kategori yang ada dari wp-includes/widgets/class-wp-widget-categories.phpke my_widget.phpdalam tema Anda, dan mengubah nama kelas menjadi nama yang sama seperti yang digunakan dalam panggilan ke register_widget()atas.

Kemudian buat perubahan apa pun yang Anda suka! Saya sarankan untuk mengubah judul juga sehingga Anda dapat membedakannya dari widget Kategori default.

Anda dapat mengganti widget WordPress default dengan memperluasnya. Kode untuk widget Kategori default dapat ditemukan pada tautan berikut: https://developer.wordpress.org/reference/classes/wp_widget_categories/widget/

dan di bawah ini adalah kode contoh bagaimana Anda dapat menimpa output widget.

Class My_Categories_Widget extends WP_Widget_Categories {
    function widget( $args, $instance ) {
        // your code here for overriding the output of the widget
    }
}

function my_categories_widget_register() {
    unregister_widget( 'WP_Widget_Categories' );
    register_widget( 'My_Categories_Widget' );
}
add_action( 'widgets_init', 'my_categories_widget_register' );

Anda tidak perlu membuat widget baru yang lengkap untuk melakukan apa yang perlu Anda lakukan. Ketika saya membaca pertanyaan Anda, Anda hanya tertarik untuk mengubah bagaimana kategori ditampilkan di ujung depan. Ada dua fungsi yang menampilkan kategori di ujung depan

• wp_list_categories() yang menampilkan kategori dalam daftar

• wp_dropdown_categories() yang menampilkan kategori dalam daftar dropdown

Ini semua tergantung pada opsi apa yang dipilih di backend

Sekarang, masing-masing dari dua fungsi ini memiliki filter khusus widget ( widget_categories_argsdan widget_categories_dropdown_argsmasing - masing ) yang dapat Anda gunakan untuk mengubah argumen yang harus diteruskan ke fungsi-fungsi ini. Anda dapat menggunakan ini untuk mengubah perilaku daftar / tarik-turun. Namun, ini mungkin tidak cukup untuk melakukan apa yang Anda inginkan.

Atau, masing-masing fungsi memiliki filter sendiri untuk sepenuhnya mengubah cara bagaimana fungsi-fungsi ini harus menampilkan outputnya.

Mereka masing-masing

• wp_list_categories

• wp_dropdown_cats

Kita dapat menggunakan widget_titlefilter untuk secara khusus menargetkan widget saja dan bukan contoh lain dari fungsi ini.

Singkatnya, Anda dapat mencoba yang berikut: ( TOTALLY UNTESTED )

add_filter( 'widget_title', function( $title, $instance, $id_base )
{
    // Target the categories base
    if( 'categories' === $id_base ) // Just make sure the base is correct, I'm not sure here
        add_filter( 'wp_list_categories', 'wpse_229772_categories', 11, 2 );
        //add_filter( 'wp_dropdown_cats', 'wpse_229772_categories', 11, 2 );
    return $title;
}, 10, 3 );

function wpse_229772_categories( $output, $args )
{
    // Only run the filter once
    remove_filter( current_filter(), __FUNCTION__ );

    // Get all the categories
    $categories = get_categories( $args );

    $output = '';
    // Just an example of custom html
    $output .= '<div class="some class">';
    foreach ( $categories as $category ) {
        // Just an example of custom html
        $output .= '<div class="' . echo $category->term_id . '">';
        // You can add any other info here, like a link to the category
        $output .= $category->name;
        // etc ect, you get the drift
        $output .= '</div>';
    }
    $output .= '</div>';

    return $output;
}, 11, 2 );