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

Hi, my name is Daniel, I'm the CTO here at Kinsta. You may know me from Smashing Magazine, WPMU Dev, Tuts+ and other WordPress/Development magazines. Aside from WordPress and PHP I spend most of my time around Node, React, GraphQL and other technologies in the Javascript space.

When not working on making the best hosting solution in the Universe I collect board games, play table football in the office, travel or play guitar and sing in a pretty bad band.