Come aggiungere una barra di scorrimento personalizzata a qualsiasi elemento in WordPress

Piccoli tocchi di design possono fare una grande differenza nell'aspetto professionale del tuo sito web.

Le barre di scorrimento personalizzate sono uno di quei dettagli che la maggior parte dei visitatori non noterà consciamente, ma sentiranno sicuramente la coerenza visiva migliorata durante la navigazione nei tuoi contenuti.

La buona notizia è che la personalizzazione delle barre di scorrimento in WordPress non richiede competenze di codifica avanzate e i risultati possono davvero migliorare l'esperienza utente complessiva del tuo sito.

Dalla nostra esperienza nella creazione di siti WordPress, abbiamo scoperto che le barre di scorrimento personalizzate aiutano a creare quell'aspetto curato e intenzionale che distingue i siti per principianti da quelli professionali.

Ti mostreremo 2 modi semplici per aggiungere barre di scorrimento personalizzate a qualsiasi elemento del tuo sito WordPress. Ogni metodo che tratteremo è stato testato in scenari reali, quindi puoi scegliere l'approccio che meglio si adatta al tuo livello di comfort.

Quando aggiungere una barra di scorrimento a elementi specifici in WordPress?

L'aggiunta di una barra di scorrimento per gli elementi di WordPress può migliorare notevolmente l'esperienza utente del tuo sito.

Ma quando dovresti usare questa funzionalità di design di WordPress?

Ecco alcuni elementi comuni di WordPress che possono beneficiare di barre di scorrimento personalizzate:

• Menu di navigazione – Perfetto per blog con oltre 20 categorie e sottocategorie che altrimenti si estenderebbero lungo l'intera pagina.
• Widget della barra laterale – Ideale per barre laterali ricche di contenuti in cui si desidera mantenere tutti i widget senza compromettere lo spazio.
• Descrizioni dei prodotti – Mantiene i dettagli prolissi dei prodotti contenuti mantenendo un layout pulito.
• Sezioni commenti – Visualizza ordinatamente centinaia di commenti senza sovraccaricare la pagina.
• Gallerie di immagini – Mostra immagini multiple in una galleria mantenendo l'accessibilità.

Tenendo presente questo, ti mostreremo due opzioni per aggiungere una barra di scorrimento personalizzata a qualsiasi elemento del tuo sito web WordPress.

Ti consigliamo di scegliere l'opzione 1 se stai appena iniziando con il tuo sito e desideri utilizzare un page builder con funzionalità di barra di scorrimento personalizzata. Questo perché se hai già utilizzato un tema diverso, dovrai cambiare il tuo tema per questo metodo.

D'altra parte, se ti piace il tuo tema attuale, puoi scegliere l'opzione 2 per aggiungere una barra di scorrimento personalizzata utilizzando il codice CSS. Non preoccuparti, scomporremo il processo passo dopo passo in modo che sia facile da seguire per chiunque.

Puoi utilizzare i collegamenti rapidi qui sotto per saltare al tuo metodo preferito:

• Opzione 1: Utilizza un Page Builder con barre di scorrimento personalizzate specifiche per elemento (senza codice)
• Option 2: Use CSS Code to Add a Custom Scrollbar to a Specific Element

Opzione 1: Utilizza un Page Builder con barre di scorrimento personalizzate specifiche per elemento (senza codice)

Un modo per aggiungere una barra di scorrimento personalizzata in un elemento specifico è utilizzare un page builder con una funzione di barra di scorrimento. In questo modo, puoi personalizzare facilmente la barra di scorrimento senza toccare alcun codice.

Per questo metodo, utilizzeremo Thrive Architect. Oltre alla funzione di barra di scorrimento, Thrive Architect dispone di oltre 300 modelli per creare rapidamente pagine dall'aspetto professionale e funzionalità di contenuto dinamico per personalizzare l'esperienza del tuo visitatore.

Inoltre, abbiamo trovato l'interfaccia drag-and-drop facile da usare, rendendola ideale per chi è nuovo a WordPress. Per un'analisi più dettagliata di questo strumento, consulta la nostra recensione di Thrive Architect.

Sebbene Thrive Architect non offra una versione gratuita, puoi utilizzare il nostro speciale codice sconto Thrive Themes per risparmiare fino al 50% sul tuo acquisto iniziale.

Passaggio 1: Configura Thrive Architect e Thrive Themes

Per iniziare, dobbiamo installare il plugin Thrive Architect. Puoi accedervi effettuando l'accesso al tuo account sul sito web di Thrive Themes.

Successivamente, scarica e installa il plugin Thrive Product Manager. Se hai bisogno di aiuto, consulta la nostra guida su come installare plugin WordPress per principianti.

Dopo aver attivato il plugin, naviga su Product Manager nella tua bacheca di WordPress.

Fai clic su 'Accedi al mio account' per collegare il tuo sito WordPress con il tuo account Thrive Themes.

Ora dovresti vedere un elenco dei prodotti Thrive Themes disponibili nel tuo account.

Trova 'Thrive Architect' e seleziona la casella 'Installa prodotto'.

Scorri verso il basso per trovare 'Thrive Theme Builder' e seleziona l'opzione 'Installa tema'.

Quindi, fai clic su 'Installa prodotti selezionati'. Questo passaggio è necessario poiché Thrive Architect funziona insieme a Thrive Theme Builder.

La schermata successiva mostrerà Thrive Product Manager che installa e attiva Thrive Theme Builder.

Una volta completato, seleziona 'Vai alla bacheca di Theme Builder'.

Ora è il momento di selezionare un design di base per il tuo sito utilizzando la libreria di temi di Thrive.

Se non sei sicuro quale scegliere, usa il pulsante 'Anteprima' per vedere come appare ogni tema. Una volta deciso, fai clic su 'Scegli'.

Ora entrerai nella procedura guidata di Theme Builder.

Questa procedura guidata ti aiuterà a caricare il tuo logo, selezionare i colori del marchio per il tuo tema e impostare varie strutture e modelli di tema.

Assicurati di completare la procedura guidata di configurazione prima di passare al passaggio successivo.

Passaggio 2: Aggiungi un elemento Casella di contenuto al tuo tema

Aggiungiamo ora un elemento Casella di contenuto al tuo tema WordPress, che dispone della funzionalità barra di scorrimento per impostazione predefinita.

In Thrive Themes, una casella di contenuto è un blocco che puoi utilizzare come contenitore per raggruppare più blocchi. Questo può essere utile se hai bisogno che un set di elementi venga stilizzato allo stesso modo o gestito come gruppo.

Per questo esempio, aggiungeremo una casella di contenuto che contiene un lungo elenco di categorie di post del blog. In questo scenario, vogliamo essere in grado di visualizzare tutte le categorie nella barra laterale senza renderla eccessivamente lunga.

Innanzitutto, visita qualsiasi pagina o post sul tuo blog WordPress dove desideri che sia presente la barra di scorrimento.

Quindi, nella barra degli strumenti di amministrazione in alto, fai clic su 'Modifica modello tema [nome]' o 'Modifica con Thrive'.

Dovresti ora arrivare all'interfaccia di modifica di Thrive Architect. Per aggiungere il blocco casella di contenuto, fai clic sul segno '+' sul lato destro della pagina e seleziona l'elemento 'Casella di contenuto'.

Quindi, trascinalo e rilascialo ovunque desideri posizionare l'elemento con la barra di scorrimento.

Ora puoi aggiungere altri elementi di contenuto alla casella di contenuto. Ad esempio, potresti fare di nuovo clic sul segno '+' e aggiungere il blocco 'Testo'. Quindi, potresti digitare qualsiasi testo desideri.

Thrive Themes offre tantissimi elementi visivi, da quelli di base come testo e immagini a moduli e tabelle prezzi.

Poiché vogliamo aggiungere un elenco di categorie alla barra laterale, aggiungeremo anche l'elemento 'Elenco stilizzato dinamico' alla casella di contenuto.

Questo blocco estrae dati dal tuo sito web per visualizzare dinamicamente un elenco, come categorie, tag o autori. Il blocco si aggiornerà automaticamente man mano che costruisci il tuo sito web.

Una volta trascinato e rilasciato l'elenco con stile dinamico nella casella di contenuto, fai clic sul pulsante 'Seleziona tipo di elenco'.

Quindi, fai clic su ‘Elenco categorie’.

Ora, il tuo elenco di categorie, il blocco di testo e qualsiasi altro elemento che aggiungi alla casella di contenuto si trovano nello stesso contenitore.

E come puoi vedere, l'elenco è piuttosto lungo, ed è per questo che vogliamo aggiungere una barra di scorrimento.

Passaggio 3: Abilita la barra di scorrimento nella casella di contenuto

Se selezioni quel contenitore e fai clic sulla freccia blu a sinistra, vedrai molte opzioni per personalizzare la tua casella di contenuto.

Le impostazioni per aggiungere una barra di scorrimento si trovano nella scheda ‘Layout e& Posizione’. Qui puoi regolare il padding, il margine, la larghezza, l'altezza, l'allineamento e così via della casella.

La prima cosa che abbiamo fatto è stata fare clic sulla freccia bianca all'interno dell'area di padding blu, appena sotto la sezione ‘Margini e& Padding’. L'abbiamo fatto solo per assicurarci che la casella di contenuto sia allineata con il resto degli elementi nella barra laterale.

Sentiti libero di esplorare altre opzioni qui per assicurarti che la tua casella abbia un aspetto ben proporzionato.

Successivamente, scorri verso il basso fino alla sezione Altezza. Vai avanti e fai clic sul pulsante ‘Max’ e cambia l'altezza in pixel con un numero molto più piccolo. In questo caso, siamo passati da 617px a 300px.

Questo renderà la casella di contenuto molto più corta, facendo scomparire i nomi delle categorie nella sezione inferiore.

Fatto ciò, scorri di nuovo il pannello verso il basso e apri la scheda ‘Avanzate’. Quindi, seleziona ‘Scorrimento’ nelle impostazioni di Overflow e attiva l'opzione ‘Stile barra di scorrimento’.

Una barra di scorrimento dovrebbe essere aggiunta automaticamente al tuo blocco casella di contenuto.

E questo è tutto per l'aggiunta di una barra di scorrimento personalizzata con Thrive Architect. Puoi continuare a modificare il tuo tema WordPress, la pagina o il post, oppure fare clic su ‘Salva lavoro’ in basso per pubblicare le modifiche.

Ecco come appare la nostra barra di scorrimento sul sito demo:

Opzione 2: Usa il codice CSS per aggiungere una barra di scorrimento personalizzata a un elemento specifico

Se cambiare il tuo tema WordPress e usare un page builder per creare una barra di scorrimento personalizzata ti sembra troppo complicato, puoi usare invece il codice CSS. Questo metodo ti permette di personalizzare la barra di scorrimento direttamente sulla tua pagina WordPress.

Non preoccuparti se sei nuovo nel lavorare con snippet di codice. Ti guideremo passo dopo passo nel processo, rendendo facile abilitare questa funzionalità sul tuo sito WordPress.

Innanzitutto, capiamo come funziona il CSS. CSS sta per Cascading Style Sheets. È un linguaggio che dice ai browser web come visualizzare gli elementi su una pagina web. Nel nostro caso, useremo il CSS per aggiungere e stilizzare una barra di scorrimento personalizzata.

Per usare il CSS personalizzato, abbiamo bisogno di due cose:

1. Una classe CSS: È come un'etichetta per un elemento sulla tua pagina. La aggiungiamo all'elemento che vogliamo modificare.
2. Codice CSS: È l'insieme di istruzioni che dice al browser come stilizzare l'elemento con la classe CSS.

Quindi, per aggiungere una barra di scorrimento personalizzata, assegneremo prima una classe CSS all'elemento che vogliamo modificare. Quindi, aggiungeremo del codice CSS che crea la barra di scorrimento per gli elementi con quella classe. 

Aggiungerai la classe CSS scroll-bar al tuo elemento. Ti mostreremo come fare di seguito. E questo è lo snippet di codice CSS completo che aggiungerà la barra di scorrimento:

.scroll-bar {
  max-height: 100px;  /* Adjust the maximum height as needed */
  width:250px;  /* Adjust the width as needed */
  overflow-y: scroll; /* Enable vertical scrolling */
  overflow-x: hidden; /* Hide horizontal scrollbar */
}


/* Customizing the vertical scrollbar for Webkit-based browsers (Chrome, Safari) */
.scroll-bar::-webkit-scrollbar {
  width: 10px; /* Width of the vertical scrollbar */
}


.scroll-bar::-webkit-scrollbar-track {
  background: #eaeaea; /* Background of the scrollbar track */
}


.scroll-bar::-webkit-scrollbar-thumb {
  background: grey; /* Color of the scrollbar thumb */
  border-radius: 15px; /* Rounded corners for the thumb */
}


/* Hover state for the scrollbar thumb */
.scroll-bar::-webkit-scrollbar-thumb:hover {
  background: black; /* Change color when hovered */
}


/* For Firefox */
.scroll-bar {
  scrollbar-width: thin; /* Define scrollbar width */
  scrollbar-color: #888 #f1f1f1; /* Scrollbar thumb and track color */
}

Passaggio 1: Aggiungi la classe CSS al tuo elemento

Ci sono diversi modi per aggiungere una classe CSS a un elemento sul tuo sito WordPress.

Se ti trovi nell'editor a blocchi o nell'editor del sito completo, puoi semplicemente fare clic su qualsiasi blocco nella tua pagina, post o modello di tema a blocchi. Quindi, nella barra laterale delle impostazioni del blocco, apri la scheda 'Avanzate' e inserisci la tua classe CSS nel campo 'Classi CSS aggiuntive'.

Una volta terminato, fai clic su Aggiorna, Pubblica o Salva.

Se utilizzi un tema classico, questo processo funziona anche con l'editor di widget basato su blocchi. Vai su Aspetto » Widget e fai clic su qualsiasi blocco a cui desideri aggiungere la classe CSS.

Dopodiché, vedrai la stessa scheda Avanzate nella barra laterale delle impostazioni del blocco. Inserisci semplicemente la classe CSS nel campo ‘Classi CSS aggiuntive’ come in precedenza.

Passaggio 2: Aggiungi il codice CSS al tuo tema

Ora, procediamo e aggiungiamo il nostro codice CSS personalizzato. Ti mostreremo 3 modi per farlo: utilizzando il personalizzatore del tema, l'editor completo del sito e WPCode.

La prima opzione è per gli utenti di temi classici. Inoltre, è una funzionalità integrata, quindi non hai bisogno di un plugin per inserire il codice o persino aprire i file del tuo tema.

Per fare ciò, puoi aprire il personalizzatore del tema di WordPress andando su Aspetto » Personalizza.

Nota: Se non vedi questa impostazione su WordPress, probabilmente stai utilizzando un tema a blocchi e puoi utilizzare il metodo successivo. Per ulteriori informazioni, consulta la nostra guida su come correggere la mancanza del personalizzatore del tema in WordPress.

Metodo 1: Aggiungere CSS ai temi classici

All'interno del personalizzatore, trova e fai clic su ‘CSS aggiuntivo’.

Qui, incolla semplicemente il codice che ti abbiamo mostrato in precedenza.

Vedrai automaticamente le modifiche al tuo tema una volta aggiunto il codice.

Come puoi vedere, l'elemento a cui hai aggiunto la classe CSS ora ha una barra di scorrimento. Quindi, puoi semplicemente fare clic su ‘Pubblica’.

Metodo 2: Aggiungere CSS utilizzando l'editor completo del sito

Se hai un tema a blocchi, dovrai aggiungere il codice CSS utilizzando l'editor completo del sito, quindi vai su Aspetto » Editor.

Troverai alcune opzioni di menu per personalizzare il tuo tema a blocchi.

Qui, fai clic su 'Stili'.

In questa pagina dovrebbero esserci alcuni design di temi a blocchi tra cui scegliere.

Ignoreremo semplicemente questo e faremo clic sul pulsante 'Modifica'. Ha la forma di una matita.

Ora sei all'interno dell'interfaccia di modifica.

Nel pannello laterale destro, fai clic sul menu a tre punti accanto all'icona delle revisioni e seleziona 'CSS aggiuntivo'.

Ora, incolla semplicemente lo snippet di codice di prima. Dovresti vedere le tue modifiche automaticamente.

Una volta fatto, fai clic su 'Salva'.

Uno svantaggio dell'utilizzo del personalizzatore del tema e dell'editor completo del sito per inserire il tuo CSS è che se decidi di aggiornare o cambiare il tuo tema, potresti rischiare di perdere la personalizzazione CSS.

Ecco perché consigliamo di utilizzare WPCode per modificare il CSS del tuo sito, specialmente se stai utilizzando l'editor completo del sito e un tema basato su blocchi. Puoi seguire quel metodo di seguito e funzionerà anche con i temi classici.

Metodo 3: Aggiungere CSS utilizzando WPCode

Se hai paura di personalizzare il tuo sito utilizzando il codice, allora WPCode è la soluzione perfetta per te. Questo plugin per snippet di codice rende sicuro l'inserimento di codice personalizzato, poiché non dovrai interagire direttamente con i file del tuo tema.

In caso di errore, WPCode rileverà e disattiverà automaticamente il codice che causa il problema. In questo modo, c'è una minima possibilità che tu possa compromettere il tuo sito.

Innanzitutto, installa il plugin WPCode sul tuo sito web. Puoi leggere la nostra guida per principianti su come installare un plugin WordPress per maggiori informazioni.

Quindi, vai su Snippet di codice » + Aggiungi snippet nella tua bacheca di WordPress. Scegli 'Aggiungi il tuo codice personalizzato (Nuovo snippet)' e fai clic su '+ Aggiungi snippet personalizzato'.

Ora, dai un nome al tuo nuovo snippet di codice personalizzato. Può essere qualcosa di semplice come 'CSS Scrollbar'.

Successivamente, cambia il Tipo di codice in 'Snippet CSS'.

Nella casella Anteprima codice, incolla lo snippet che ti abbiamo mostrato in precedenza.

Una volta fatto, scorri la pagina fino alla sezione ‘Inserimento’. Lì, assicurati che il Metodo di Inserimento sia ‘Inserimento Automatico’ e la Posizione sia ‘Intestazione Sito’.

Fatto ciò, attiva semplicemente il pulsante nell'angolo in alto a destra in modo che dica ‘Attivo’ e fai clic su ‘Salva Snippet’.

Dovresti ora vedere una barra di scorrimento sull'elemento a cui hai aggiunto la classe CSS.

Ecco un esempio di come aggiungere una barra di scorrimento a un elenco di articoli recenti:

Come aggiungere una barra di scorrimento personalizzata a una voce di menu con sottomenu multipli

Una delle cose che i lettori sono curiosi di sapere è come aggiungere la barra di scorrimento alla voce del menu di navigazione che ha un lungo elenco di sottomenu.

Il processo è in realtà piuttosto simile a quello che ti abbiamo appena mostrato. Ma ci sono alcune piccole modifiche qua e là a seconda del tema che stai utilizzando.

Se utilizzi un tema classico, allora dovresti aggiungere la classe scroll-bar solo alla voce del menu principale. Non è necessario aggiungerla alle voci del sottomenu.

Per aggiungere una classe CSS al tuo menu, puoi aprire il personalizzatore del tema.

Quindi, fai clic sul pulsante ‘Menu’.

Successivamente, fai clic sull'icona a forma di ingranaggio ‘Impostazioni’ e quindi seleziona ‘Classi CSS’.

Questo ti consente di aggiungere una classe CSS a ciascuna voce di menu.

Ora, scorri verso il basso nel pannello laterale.

Quindi, apri il tuo menu principale.

A questo punto, puoi selezionare la voce di menu a cui desideri aggiungere la classe CSS e fare clic per espanderla.

Dovrebbe esserci un campo chiamato ‘Classi CSS’, e puoi aggiungere la classe lì.

Oltre a ciò, vuoi assicurarti di aggiungere la classe sub-menu dopo ogni menzione della classe scroll-bar nel tuo codice CSS, così:

.scroll-bar .sub-menu {
  max-height: 100px;  /* Adjust the maximum height as needed */
  overflow-y: scroll; /* Enable vertical scrolling */
  overflow-x: hidden; /* Hide horizontal scrollbar */
}
/* Do the same to the rest of the code */

Ecco come dovrebbe apparire il menu di navigazione:

Lo stesso principio vale per i temi a blocchi.

Devi solo aggiungere la classe scroll-bar alla voce principale del menu, non ai sottomenu.

Ora, ecco dove le cose cambiano. Devi visitare il tuo sito WordPress e aprire lo strumento di ispezione del tuo browser.

Per gli utenti Chrome, fai semplicemente clic destro sulla voce del menu con sottomenu e seleziona 'Ispeziona'.

Sulla tastiera, premi CTRL/Comando + F per attivare la funzione Trova. Quindi, individua il codice HTML <ul></ul> che contiene la classe scroll-bar.

Il codice esatto sarà diverso da tema a tema, ma ecco come appare il nostro:

<ul data-wp-on-async--focus="actions.openMenuOnFocus" class="wp-block-navigation__submenu-container scroll-bar wp-block-navigation-submenu">...</ul>

Saprai di aver selezionato la riga di codice corretta se tutte le voci del sottomenu sono evidenziate.

Ora, vuoi copiare tutte queste classi CSS tra class=" e ">.

Nel codice CSS, sostituisci la classe scroll-bar con tutte quelle classi e un punto (.) prima di esse per indicare che si tratta di una classe. È anche buona norma aggiungere !important su ogni riga che personalizza la barra di scorrimento per assicurarsi che il tema non sovrascriva queste impostazioni.

Ecco un esempio:

.wp-block-navigation__submenu-container.scroll-bar.wp-block-navigation-submenu {
 max-height: 100px !important; /* Adjust the maximum height as needed */
 overflow-y: auto !important; /* Enable vertical scrolling */
 overflow-x: hidden !important; /* Hide horizontal scrollbar */
}
/* Do the same to the rest of the code */

Una volta aggiunto questo codice, il tuo menu di navigazione dovrebbe apparire così:

Come personalizzare il design della barra di scorrimento personalizzata

Ora che hai aggiunto una barra di scorrimento personalizzata, potresti volerla far corrispondere al design del tuo sito web. Puoi facilmente cambiare l'aspetto della barra di scorrimento usando il CSS. Vediamo come personalizzare le sue dimensioni, il colore e la forma.

Diciamo che vuoi cambiare l'altezza massima dell'elemento a cui stai aggiungendo una barra di scorrimento. In questo caso, puoi cambiare il numero in max-height: in alto con qualsiasi numero desideri, purché sia in pixel.

Puoi anche regolare il numero in width: per rendere più larga o più stretta la larghezza dell'elemento con la barra di scorrimento.

Per regolare la dimensione della barra di scorrimento, trova la riga width: 10px; sotto il selettore .scroll-bar::-webkit-scrollbar.

Aumenta questo numero per rendere la barra di scorrimento più larga, o diminuiscilo per renderla più stretta. Ad esempio, width: 15px; creerà una barra di scorrimento più larga, mentre width: 5px; la renderà più sottile.

Per cambiare il colore della barra di scorrimento, trova la riga che dice background: grey; sotto il selettore .scroll-bar::-webkit-scrollbar-thumb.

Sostituisci 'grey' con qualsiasi colore desideri, come 'blue' o qualsiasi colore utilizzando il codice colore esadecimale (ad esempio #0000FF).

Se vuoi rendere la barra di scorrimento più arrotondata, cerca la proprietà border-radius.

Più alto è il numero, più arrotondati saranno gli angoli. Prova a cambiare border-radius: 15px; in border-radius: 20px; per un aspetto più arrotondato, o border-radius: 0px; per angoli netti.

Nota che le modifiche sopra influenzeranno solo i browser basati su Webkit come Chrome e Safari.

Per Firefox, dovrai regolare la proprietà scrollbar-color. Il primo colore è per il pollice (la parte che trascini), e il secondo è per la traccia (lo sfondo). Ad esempio, scrollbar-color: blue #eaeaea creerà una barra di scorrimento blu su una traccia grigio chiaro in Firefox.

Dopo aver apportato queste modifiche, salva il tuo CSS e aggiorna la tua pagina WordPress per vedere la nuova barra di scorrimento personalizzata in azione. Sentiti libero di sperimentare con colori e dimensioni diverse finché non trovi l'aspetto perfetto per il tuo sito web.

Scopri altri modi per migliorare il design del tuo sito WordPress

Ora che hai imparato come aggiungere barre di scorrimento personalizzate al tuo sito WordPress, perché non esplorare altri modi per migliorare il design e la funzionalità del tuo sito web? Ecco alcune guide utili per portare le tue competenze WordPress al livello successivo:

• Se stai cercando di mostrare le tue pagine in modo visivamente accattivante, dai un'occhiata al nostro tutorial su come mostrare facilmente un elenco di pagine con miniature in WordPress.
• Per i blog con molti contenuti, lo scorrimento infinito può migliorare notevolmente l'esperienza utente. Impara come aggiungere questa funzionalità passo dopo passo.
• Per aggiungere un po' di stile visivo, prova ad aggiungere un effetto parallax al tuo tema WordPress. È più facile di quanto pensi.
• Per una migliore accessibilità, considera l'aggiunta di un ridimensionatore di font al tuo sito. Abbiamo una guida semplice per aiutarti a fare proprio questo.
• Se non sei soddisfatto della posizione attuale della tua barra laterale, possiamo mostrarti come cambiare il lato della barra laterale in WordPress.

Speriamo che questo articolo ti abbia aiutato a imparare come aggiungere una barra di scorrimento personalizzata a qualsiasi elemento sul tuo sito WordPress. Potresti anche voler dare un'occhiata alle nostre scelte di esperti dei migliori costruttori di temi WordPress e alla nostra guida su come aggiungere una barra di avanzamento della lettura in WordPress.

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.