web-dev-qa-db-fra.com

Comment modifier le résultat par défaut du widget WordPress?

Je ne veux pas donner de style au widget par défaut uniquement avec CSS. Je souhaite afficher le contenu du widget "Catégories" par défaut avec ma propre structure HTML.

Y a-t-il un filtre ou un crochet disponible pour le faire?

14
Eh Jewel

Pour développer la réponse de Mark, il n’ya pas beaucoup (généralement) de filtres dans les widgets WordPress par défaut (à l’exception peut-être de widget_text).

Mais ajouter votre propre widget personnalisé est facile - mettez ceci dans votre 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");
}

Ensuite, vous souhaitez simplement copier le widget de catégories existant de wp-includes/widgets/class-wp-widget-categories.php à my_widget.php dans votre thème et modifier le nom de la classe avec le même nom que celui utilisé dans l'appel à register_widget() ci-dessus.

Ensuite, faites les changements que vous aimez! Je suggère également de modifier le titre afin que vous puissiez le distinguer du widget Catégories par défaut.

13
Tim Malone

Vous pouvez remplacer les widgets WordPress par défaut en les développant. Le code du widget Catégories par défaut est disponible sur le lien suivant: https://developer.wordpress.org/reference/classes/wp_widget_categories/widget/

et vous trouverez ci-dessous un exemple de code permettant de remplacer la sortie du 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' );
9
Boris Kuzmanov

Vous n'avez pas besoin de créer un nouveau widget complet pour faire ce que vous devez faire. En lisant votre question, vous ne souhaitez que changer la manière dont les catégories sont affichées au début. Il y a deux fonctions qui affichent les catégories sur le front-end

Tout dépend de quelle option a été sélectionnée dans le backend

Désormais, chacune de ces deux fonctions possède un filtre spécifique au widget (widget_categories_args ET widget_categories_dropdown_args) que vous pouvez utiliser pour modifier les arguments devant être transmis à ces fonctions. Vous pouvez l'utiliser pour modifier le comportement de la liste/du menu déroulant. Cependant, cela peut ne pas suffire pour faire ce que vous voulez.

Alternativement, chaque fonction a son propre filtre pour modifier complètement la manière dont ces fonctions doivent afficher leur sortie.

Ils sont respectivement

Nous pouvons utiliser le filtre widget_title pour cibler spécifiquement le widget et non les autres instances de ces fonctions.

En bref, vous pouvez essayer les solutions suivantes: ( 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 );
7
Pieter Goosen