In questo articolo esamineremo alcuni modi per utilizzare la funzione di WordPress per registrare una sidebar e vi daremo alcuni consigli avanzati!

Registrare una Singola Sidebar su WordPress

Per ottenere una barra laterale che funzioni nel vostro tema dovrete prima informare WordPress, per essere sicuri che compaia nell’admin, e aggiungere un po’ di codice front-end per visualizzare i widget. Per registrare una barra laterale potete scegliere una delle due opzioni seguenti: registrare una sidebar con register_sidebar() o registrarne molte contemporaneamente con register_sidebars().

La funzione register_sidebar() va utilizzata in questo modo:

add_action( 'widgets_init', 'my_awesome_sidebar' );
function my_awesome_sidebar() {
  $args = array(
    'name'          => 'Awesome Sidebar',
    'id'            => 'awesome-sidebar',
    'description'   => 'The Awesome Sidebar is shown on the left hand side of blog pages in this theme',
    'class'         => '',
    'before_widget' => '<li id="%1$s" class="widget %2$s">',
    'after_widget'  => '</li>',
    'before_title'  => '<h2 class="widgettitle">',
    'after_title'   => '</h2>' 
  );

  register_sidebar( $args );

}

Le funzioni dovrebbero essere richiamate da una funzione agganciata a widgets_init e richiede un singolo array di parametri. Il nome e la descrizione sono mostrati nel backend nel momento in cui l’utente sta assemblando la barra laterale, e gli ultimi quattro parametri sono usati per visualizzare ogni widget.

I parametri prima e dopo il titolo vengono preparati e aggiunti al titolo, mentre i parametri prima e dopo il widget vengono aggiunti prima e dopo l’elemento widget. Questo consente di mantenere uno stile uniforme su tutta la barra laterale dei widget.

Registrare Sidebar Multiple in una Volta Sola su WordPress

La funzione register_sidebars() è quasi esattamente la stessa della sua sorella per la barra laterale singola, ma prende un parametro extra che detta il numero di barre laterali da aggiungere.
Ecco un semplice esempio:

add_action( 'widgets_init', 'my_theme_sidebars' );
function my_theme_sidebars() {
  $args = array(
    'name'          => 'Awesome Sidebar %d',
    'id'            => 'awesome-sidebar',
    'description'   => 'One of the awesome sidebars',
    'class'         => '',
    '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 );

}

L’unica altra differenza è l’uso del segnaposto %d che mostrerà il numero della barra laterale, nel nostro caso 1, 2 o 3.

Registrare nel Modo Migliore Più Sidebar

L’unico problema della funzione di cui sopra è che non permette di personalizzare il titolo e la descrizione, e l’uso del parametro “id” è tecnicamente scorretto in quanto dovrebbe essere unico. Per ovviare a questo problema, di solito, imposto un array di informazioni e lo passo in loop per creare le mie barre laterali.
Ecco come fare:

add_action( 'widgets_init', 'my_awesome_sidebar' );
function my_awesome_sidebar() {

  $my_sidebars = array(
    array(
      'name'          => 'Header Widget Area',
      'id'            => 'header-widget-area',
      'description'   => 'Widgets shown in the flyout of the header',
    ),
    array(
      'name'          => 'Header Widget Area',
      'id'            => 'header-widget-area',
      'description'   => 'Widgets shown in the flyout of the header',
    ),
    array(
      'name'          => 'Header Widget Area',
      'id'            => 'header-widget-area',
      'description'   => 'Widgets shown in the flyout of the header',
    ),  
  );

  $defaults = array(
    'name'          => 'Awesome Sidebar',
    'id'            => 'awesome-sidebar',
    'description'   => 'The Awesome Sidebar is shown on the left hand side of blog pages in this theme',
    'class'         => '',
    'before_widget' => '<li id="%1$s" class="widget %2$s">',
    'after_widget'  => '</li>',
    'before_title'  => '<h2 class="widgettitle">',
    'after_title'   => '</h2>' 
  );

  foreach( $my_sidebars as $sidebar ) {
    $args = wp_parse_args( $sidebar, $defaults );
    register_sidebar( $args );
  }

}

Prima di tutto, ho definito una serie di sidebar con i parametri di cui ho bisogno per ognuna di esse. Ho anche creato un set di parametri di default che può essere utilizzato nel caso in cui manchino dei dati da qualche parte. Durante il looping attraverso il nostro array di barre laterali, uniamo l’array di argomenti specifici della barra laterale con i valori predefiniti e li passiamo alla funzione register_sidebar().

Se avete voglia di divertirvi, potete separare l’array di barre laterali da questa funzione e creare la vostra funzione; la potete poi riutilizzare da un tema all’altro: tutto quello che dovete fare è modificare l’array di barre laterali.

Questo vi dà più controllo e standardizzazione in tutto il vostro lavoro, il che è ottimo se offrite aggiornamenti e supporto.

Riepilogo

Finché utilizzate le funzioni predefinite di WordPress non importa come si registrano le barre laterali, ma se lavorate regolarmente sul tema o volete iniziare a creare alcuni snippet riutilizzabili, consiglio vivamente di utilizzare loop e array di dati.

Personalmente non mi piace la funzione register_sidebars() perché in molti casi porta a un HTML non valido e non vi dà il controllo che dovreste sempre mantenere quando lavorate sui temi.

Lettura suggerita: Come Rimuovere le Sidebar in WordPress (4 Metodi).

Daniel Pataki

"Ciao, mi chiamo Daniel, sono il CTO di Kinsta. Forse avete già visto il mio nome su Smashing Magazine, WPMU Dev, Tuts+ e altre riviste di WordPress/Sviluppo. Oltre a WordPress e PHP, trascorro la maggior parte del mio tempo con Node, React, GraphQL e altre tecnologie nello spazio Javascript.
Quando non lavoro per creare la migliore soluzione di hosting dell'universo, colleziono giochi da tavolo, gioco a calcio balilla in ufficio, viaggio o suono la chitarra e canto in una band piuttosto scadente."