Comment créer plusieurs widgets dans WordPress en utilisant les boucles For & Foreach

Publié: 2020-01-25

Comment créer plusieurs widgets dans WordPress Vous cherchez un moyen dynamique de créer plusieurs widgets dans WordPress sans écrire trop de code ? Ou avez-vous vu un thème WordPress qui vous permet de créer une barre latérale ou de créer plusieurs widgets depuis le tableau de bord ?

Dans un tutoriel précédent, j'ai expliqué en détail comment ajouter une barre latérale dans WordPress . Aujourd'hui, dans ce tutoriel rapide, je vais partager avec vous une solution rapide pour créer plusieurs widgets dans WordPress à la volée. Cela vous fera non seulement gagner du temps, mais vous réutiliserez l'astuce dans plusieurs projets, en particulier si vous êtes un développeur WordPress professionnel très occupé.

Boucle pour créer plusieurs barres latérales WordPress

Idéalement, nous voulons utiliser une fonction qui crée les multiples barres latérales WordPress en utilisant une sorte de boucle . Lorsque vous créez ce code pour le premier thème ou plugin, vous allez le réutiliser dans d'autres développements de thèmes et de plugins.

Cette fonction peut également servir de base à la construction d'un générateur de sidebar dynamique utilisé dans un thème ou un plugin WordPress. Pour que vous compreniez parfaitement le fonctionnement de ce code, vous devez connaître le processus de création d'une barre latérale WordPress , comme je l'ai expliqué en détail dans cet article.

Création de widgets WordPress

Les widgets WordPress jouent un rôle crucial en aidant les utilisateurs à afficher de nouveaux contenus dans différentes sections de leur site Web. Dans cet article sur la création de zones de widgets dans WordPress ; J'ai partagé des conseils importants et le code et j'ai également expliqué très clairement dans cet article comment ajouter une barre latérale dans WordPress .

Lorsque vous avez la possibilité d'ajouter un widget dans le thème WordPress, c'est tout simplement incroyable car vous pouvez ajouter n'importe quelle nouvelle fonctionnalité dans toutes les sections de votre site.

Pour un examen rapide de la façon d'ajouter la barre latérale ou la zone de widget dans WordPress, le code suivant doit être ajouté au functions.php pour enregistrer une barre latérale comme première étape lors de l'ajout d'un widget dans votre thème WordPress :

 /**
* Enregistrez la zone de widget.
*/

function njengah_create_one_widget_tutorial() {

//Fonction d'enregistrement de la barre latérale - https://developer.wordpress.org/reference/functions/register_sidebar/

register_sidebar(

  déployer(
     'name' => __( 'Exemple de Widget Njengah ', 'textdomain' ),
     'id' => 'barre latérale-1',
     'description' => __( 'Ajoutez des widgets ici pour qu'ils apparaissent dans votre barre latérale.', 'textdomain' ),
     'before_widget' => '<section id="%1$s" class="widget %2$s">',
     'after_widget' => '</section>',
     'before_title' => '<h2 class="widget-title">',
     'after_title' => '</h2>',

   )

  );


}

add_action( 'widgets_init', ' njengah_create_one_widget_tutorial');

Il s'agit de la fonction register_sidebar() que nous utilisons pour ajouter un widget au site WordPress et le widget peut maintenant être affiché dans le modèle de page respectif à l'aide de la fonction dynamic_sidebar() comme suit :

 <?php si ( is_active_sidebar( 'sidebar-1' ) ) : ?>

    <ul id="sidebar">

      <?php dynamic_sidebar( 'sidebar-1' ); ?>

    </ul>

<?php endif; ?>

Création de plusieurs barres latérales de widgets dans WordPress

Étant donné que le code pour enregistrer la barre latérale a utilisé la fonction register_sidebar() pour créer plus de barres latérales, il vous suffit de répéter ce code plusieurs fois comme vous le souhaitez : nous pouvons maintenant créer trois barres latérales en répétant ce code comme suit :

 /**
* Enregistrez 3 zones de widgets.
*/

function njengah_create_three_widget_tutorial() {

//Enregistrer la barre latérale #1

register_sidebar(
   déployer(
       'name' => __( 'Njengah Sidebar 1 ', 'textdomain' ),
       'id' => 'barre latérale-1',
      'description' => __( 'Ajoutez des widgets ici pour qu'ils apparaissent dans votre barre latérale 1.', 'textdomain' ),
      'before_widget' => '<section id="%1$s" class="widget %2$s">',
      'after_widget' => '</section>',
      'before_title' => '<h2 class="widget-title">',
      'after_title' => '</h2>',
  )
);

//Enregistrer la barre latérale #2

register_sidebar(
   déployer(
       'name' => __( 'Njengah Sidebar 2', 'textdomain' ),
        'id' => 'sidebar-2',
        'description' => __( 'Ajoutez des widgets ici pour qu'ils apparaissent dans votre barre latérale 2.', 'textdomain' ),
        'before_widget' => '<section id="%1$s" class="widget %2$s">',
        'after_widget' => '</section>',
        'before_title' => '<h2 class="widget-title">',
       'after_title' => '</h2>',
     )
);

//Enregistrer la barre latérale #3

register_sidebar(
   déployer(
       'name' => __( 'Njengah Sidebar 3 ', 'textdomain' ),
       'id' => 'sidebar-3',
       'description' => __( 'Ajoutez des widgets ici pour qu'ils apparaissent dans votre barre latérale 3.', 'textdomain' ),
       'before_widget' => '<section id="%1$s" class="widget %2$s">',
       'after_widget' => '</section>',
       'before_title' => '<h2 class="widget-title">',
       'after_title' => '</h2>',
      )
   );

}
add_action( 'widgets_init', 'njengah_create_three_widget_tutorial');

Vous pouvez créer de plus en plus de zones de widgets en répétant ce code que vous utilisez pour enregistrer les widgets et tout fonctionne et c'est cool.

Mais attendez une minute ! N'avez-vous pas entendu parler d'une règle fondamentale ou d'une programmation - DRY (Don't Repeat Yourself) ?

C'est un principe simple qui signifie que votre code doit être efficace et doit éviter de telles répétitions pour éviter la redondance. Nous pouvons remplacer ce code par quelque chose de mieux, par exemple, nous pouvons passer un argument à la fonction register_sidebar() pour le faire trois fois.

Créer plusieurs widgets dans WordPress avec un argument

Nous pouvons atteindre notre objectif de créer plusieurs widgets dans WordPress en modifiant la fonction register_sidebar() en passant un tableau d'arguments comme deuxième paramètre et le premier paramètre est le nombre de widgets que nous voulons créer. Dans ce cas, nous pouvons modifier le code partagé ci-dessus pour ceci :

 function create_multiple_sidebar_widgets() {

$args = tableau(
    'name' => 'Njengah Sidebar %d',
    'id' => 'njengah-sidebar',
    'description' => 'Une des barres latérales du tutoriel Njengah',
    'classe' => '',
    'before_widget' => '<li id="%1$s" class="widget %2$s">',
    'after_widget' => '</li>',
    'before_title' => '<h2 class="widgettitle">',
    'after_title' => '</h2>'
 );

  register_sidebar( 3, $args );

}
add_action( 'widgets_init', 'create_multiple_sidebar_widgets');

La valeur du nom a un espace réservé %d qui nous permet simplement d'afficher les barres latérales avec les chiffres 1, 2 et 3.

C'est une solution rapide pour créer plusieurs widgets dans WordPress mais ce n'est toujours pas la solution ultime. Nous pouvons aller de l'avant et l'améliorer, comme je le démontrerai sous peu.

Créer plusieurs barres latérales avec Array dans WordPress

La solution ci-dessus n'est pas très efficace puisque le titre et la description sont limités à ceux que vous attribuez dans la fonction register_sidebar().

Pour améliorer cette solution, nous pouvons introduire un tableau avec des noms, des identifiants et des descriptions, puis nous utilisons une boucle foreach pour enregistrer les barres latérales.

Voici un exemple de création de plusieurs widgets à l'aide d'un tableau et d'une boucle foreach :

 function create_multiple_sidebar_widgets() {

$njengah_sidebars = tableau(
  déployer(
     'name' => 'Page d'accueil de la zone widget',
     'id' => 'page d'accueil-zone-widget',
     'description' => 'Widgets affichés sur la page d'accueil',
  ),
  déployer(
      'name' => 'En-tête de zone de widget ',
     'id' => 'en-tête-zone-widget',
     'description' => 'Widgets affichés dans l'en-tête',
  ),
  déployer(
     'name' => 'Pied de page de la zone du widget',
     'id' => 'widget-zone-pied de page',
     'description' => 'Widgets affichés dans le pied de page',
   ),
  );

   $defaults = tableau(
      'name' => 'Barre latérale Njengah',
      'id' => 'njengah-sidebar',
      'description' => 'La barre latérale par défaut est affichée sur le côté gauche des pages de blog dans ce thème',
       'classe' => '',
      'before_widget' => '<li id="%1$s" class="widget %2$s">',
      'after_widget' => '</li>',
      'before_title' => '<h2 class="widgettitle">',
      'after_title' => '</h2>'
  );

  foreach( $njengah_sidebars as $sidebar ) {

    $args = wp_parse_args( $barre latérale, $defaults );

    register_sidebar( $args );
   }

}
add_action( 'widgets_init', 'create_multiple_sidebar_widgets');

Cette solution vous donne la possibilité de créer plusieurs widgets à l'avenir, car il vous suffit d'ajouter tous les nouveaux détails du widget (nom, identifiant et description) au tableau et le widget est créé à la volée.

Créer plusieurs widgets de pied de page similaires dans WordPress

En fin de compte, c'est la meilleure approche pour créer plusieurs widgets dans WordPress, bien que la deuxième option puisse également être utile lorsque vous souhaitez plusieurs widgets similaires.

Par exemple, lorsque vous souhaitez créer plusieurs widgets de pied de page, il peut être plus simple d'utiliser la boucle for comme suit :

 /**
* Enregistrez la zone de widget en utilisant la boucle for
*
* @auteur Joe Njenga
*/

function njengah_register_sidebars_dynamically() {

    pour ( $i = 1, $n = 5; $i <= $n; $i++ ) {

       register_sidebar(

         déployer(
               'name' => esc_html__( 'Zone de pied de page #', 'textdomain' ) . $i,
               'id' => 'footer-' . $i,
               'description' => sprintf( esc_html__( 'La colonne #%s dans la zone de pied de page', 'textdomain' ), $i ),
               'before_widget' => '<aside id="%1$s" class="widget %2$s">',
               'after_widget' => '</aside>',
               'before_title' => '<h3 class="widget-title">',
              'after_title' => '</h3>',
           )
        );
     }
   }
}
add_action( 'widgets_init', 'njengah_register_sidebars_dynamically' );

Je pense que cela peut être l'une des solutions les plus utiles pour créer plusieurs widgets dans WordPress puisque la boucle for compte simplement jusqu'à 5 et crée 5 widgets, vous pouvez simplement changer le nombre en n'importe quel autre nombre de widgets que vous voulez et les multiples widgets seront générés dynamiquement à la volée.

Emballer

Nous avons couvert les trois façons différentes de créer plusieurs widgets dans WordPress et j'espère que ce n'est qu'un début pour vous donner l'impulsion nécessaire pour créer des moyens plus innovants de créer plusieurs barres latérales dynamiques ou plusieurs widgets dans les thèmes et plugins WordPress. Enfin, il est important que chaque développeur WordPress apprenne à utiliser le principe DRY, car il permet non seulement de gagner du temps, mais également d'améliorer l'efficacité du code.