Créer et ajouter une zone de Widget dans un thème WordPress

wordpress-logo[1]

Pour créer et mettre en place une nouvelle zone de Widget dans votre thème WordPress suivez le procédure présentez ci-dessous.

Rendez vous dans votre dossier de votre thème WordPress et ouvrez le fichier « functions.php« . Recherchez la fonction « function appliance_widgets_init() » et collez à la suite de vos zone à Widget déjà présente le code ci-dessous.

1
2
3
4
5
6
7
8
9
        register_sidebar( array(
'name' => __( 'header', 'appliance' ),
'id' => 'header',
'description' => __( 'Widget de Header', 'appliance'),
'before_widget' => '<div id="header_persus">',
'after_widget' => '</div>',
'before_title' => '',
'after_title' => '',
) );

Vous avez ci-dessous une capture d’écran du résultat final pour la mise en forme de votre code. Bien sur il vous faudra ajouter un bloc par Widget que vous souhaitez ajouter. On voit assez clairement les différents options possible. Ici mon Widget sera présent dans ma page suivant l’id de ma div « header_persus ».

wordpress functions php

A se moment, votre nouvelle zone de Widget est présente dans votre interface de gestion WordPress, il vous reste à positionner le morceaux de code suivant afin de positionner votre nouvelle zone dans votre page.

Dans mon exemple, j’ai cré une zone « header » je vais donc placer logiquement mon code afin que ma nouvelle zone arrive dans mon header. Ouvrez donc header.php et insérez le code ci-dessous. Pensez à adapter suivant l’identifiant que vous avez désigné plus haut dans le fichier functions.php.

1
2
<?php if(is_active_sidebar('header')){
dynamic_sidebar( 'header' );} ?>

activation nouvelle zone widget

Placez à présent les widgets dans votre nouvelle zone et ils apparaîtront dans l’emplacement de votre page.

Add a comment »One comment to this article

  1. Bonjour,
    merci pour ce code….même si j’ai eu un peu de mal à l’installer correctement….mais je ne suis pas très doué !

    Répondre

Laisser un commentaire

Assemblé dans la station orbitale WordPress