Fissare uno o più Widget della Sidebar in WordPress durante lo scroll della pagina
Vuoi mantenere visibile l’ultimo widget (o uno qualunque) che hai sulla sidebar mentre l’utente scorre la pagina? Magari implementandolo in maniera (quasi) semplice? È proprio quello che ti sto per mostrare in questo articolo!
Partiamo dall’inizio… I widget sono i contenitori che puoi riempire a piacimento e che vedi nella sidebar, la colonna laterale di un blog WordPress, ma anche nel footer o nell’header.
Di default, tutti i temi hanno la sidebar fissa, quindi quando un utente scorre (scroll) la pagina fino in fondo, vede solamente i widget presenti nella porzione della sidebar visibile in quella precisa altezza della pagina. I Widget sono fissi. Una volta che l’utente li ha passati, non li vedrà più se continuerà a scorrere verso il basso.
Dopo l’ultimo widget, la sidebar sarà vuota… e allora, perchè non riempire questo spazio?
E perchè non “riempire” la sidebar mostrando sempre l’ultimo widget (o uno qualunque) anche mentre l’utente scorre la pagina?
Potrebbe essere una soluzione molto interessante, da sfruttare per qualsiasi scopo, basta un po’ di fantasia… Puoi mostrare dei link utili, i pulsanti di condivisione sociali come il pulsante Mi Piace o il pulsante Tweet, puoi presentare un prodotto o, come nel caso dell’immagine qui sopra, una risorsa gratuita come la mia Blogging Box, ma perchè no, se te la senti, potresti anche metterci un bel banner pubblicitario, ma NON AdSense in quanto è vietato dal regolamento! (Prima di “giocare” con banner pubblicitari di network importanti, controlla sempre il relativo regolamento)
Ad ogni modo, dai libero sfogo alla tua fantasia, ma pensa sempre al bene dell’utente… a te piacerebbe “farti inseguire” da un banner pubblicitario?
La cosa interessante è che con il metodo che ti mostrerò, potrai anche fissare durante lo scroll un widget che non sia necessariamente in ultima posizione (ad esempio il primo), ma soprattutto, permette di fissare anche più di un widget!!!
Come fissare l’ultimo Widget durante lo scroll della pagina
Per poter fissare l’ultimo widget della sidebar e quindi renderlo sempre visibile durante lo scroll della pagina, installa il plugin Q2W3 Fixed Widget.
Comparirà nel menù Aspetto il sotto-menù Fixed Widget Options:
Qui potrai impostare il margine superiore (top) ed inferiore (bottom) che il widget avrà dallo schermo durante lo scroll della pagina.
Andando su Aspetto > Widget >, potrai selezionare quali widget vuoi che diventino fissi durante lo scroll, semplicemente selezionando la casella che è comparsa a fondo di ogni widget.
Ad esempio, inserisci un semplice widget di testo, seleziona la casella Fixed widget e salva.
Vai ad aggiornare la pagina e… e puoi ritrovarti un due situazioni: soddisfazione + inchino alla potenza di Roberto Iacono 🙂 o odio profondo per Roberto Iacono 🙂
Se sei soddisfatto e funziona tutto, vai pure al paragrafo Dì la tua…
Ecco un esempio di utilizzo del plugin con due widget fissi, non in ultima posizione!
Non funziona!
Aspetta ad insultarmi 🙂
Il widget non si blocca se non possiede un identificatore univoco. Quindi non funziona se il contenitore del widget non ha un ID, oppure se ha un ID uguale a quello di un altro widget.
Come risolvere questo problema?
Fai un backup del file functions.php del tuo tema, dopodichè vai su Aspetto > Editor > functions.php e cerca register_sidebar
.
Se non lo trovi, devi cercare questa stringa in altri file. Prova ad usare il programma gratuito FileSeek come spiegato in questo articolo.
Una volta trovato la funzione register_sidebar, devi aggiungere id="%1$s"
al contenitore del widget (solitamente rappresentato dal codice ‘before_widget‘), ecco l’esempio per il tema TwentyEleven, guarda la riga 4:
[php]
register_sidebar( array(
‘name’ => __( ‘Main Sidebar’, ‘twentyeleven’ ),
‘id’ => ‘sidebar-1’,
‘before_widget’ => ‘<aside id="%1$s" class="widget %2$s">’,
‘after_widget’ => "</aside>",
‘before_title’ => ‘<h3 class="widget-title">’,
‘after_title’ => ‘</h3>’,
) );
[/php]
Salva e vai a controllare se funziona.
Ancora niente?
Può essere che il tuo tema sia sprovvisto delle funzioni wp_head();
e wp_footer();
. In questo caso, aggiungile rispettivamente nel file header.php (prima del </head>) e del file footer.php (aggiungila prima del </body>).
Dì la tua
In che modo sfrutterai il widget fisso durante lo scroll della pagina? Che contenuti conterrà?
21/12/2012 alle 08:13
Ottima risorsa.. Grazie Roberto stavo proprio cercando una cosa simile!!
21/12/2012 alle 19:33
Farlo senza il plugin sarebbe molto complicato?
22/12/2012 alle 09:55
Roberto, sei una miniera di informazioni; ho appena letto questo articolo e quello che parla del software “file seek”. Per me, che ho cominciato a provare wordpress a settembre, i tuoi articoli sono molto importanti; seguo molti dei tuoi consigli per il blog di prova che ho in locale.
Grazie ancora; passa un Buon Natale e ti auguro che il 2013 sia un sereno anno.
mauro
23/12/2012 alle 22:37
Ti ringrazio Mauro, mi fa molto piacere!!!
Buon Natale anche a te!
12/06/2013 alle 19:13
Ciao Roberto, ho fatto tutto quello che hai detto nell’articolo, aggiunti gli id, controllato wp_head e wp_footer ma il plugin, non funziona. C’è da dire che uso Infinite Scroll, ma anche disattivandolo lo stesso non funziona. Mi è venuto il dubbio sulla jquey, dice che funziona dalla 1.8 in poi possibile sia questo il problema? Come faccio a vedere che versione di jquery ho impostato nel tema? E nel caso, aggiornarlo? Grazie