WordPress: inserire bottoni per ridimensionare grandezza testo

In alcuni siti ti sarà capitato di vedere i bottoni che servono a ridimensionare il testo. Si tratta di un’opzione per andare incontro alle persone con problemi alla vista e per ingrandire il solo testo, senza che il resto della pagina debba essere ridimensionato.

WordPress fortunatamente mette a disposizione un plugin, che vedremo tra poco, in grado di aggiungere questa utile funzionalità al sito o blog, per garantire sempre la migliore esperienza di navigazione possibile. Basterà installare e configurare il componente per poter offrire questa possibilità ai visitatori.

Il plugin in questione si chiama Accessibility Widget, è gratuito e si può installare direttamente dal pannello di amministrazione di WordPress o può essere scaricato ed installato manualmente via FTP.

Dopo aver correttamente installato ed attivato il plugin bisogna andare nell’area dedicata ai widget ed inserire l’Accessibility Widget, tramite il drag and drop.

Come per ogni altro Widget sarà possibile inserire un titolo. Inoltre il plugin da la possibilità di inserire gli elementi HTML o le classi CSS interessate. Le impostazioni di default funzionano comunque su quasi tutte le installazioni di WordPress.

Adesso dovrai scegliere le percentuali di ingrandimento e di ridimensionamento da offrire ai visitatori, in particolare a quelli con problemi di vista. Le opzioni default, liberamente modificabili, sono 90%, 100%, 110% e 120%. In ogni caso potrai inserire fino a quattro diversi ridimensionamenti per i test del tuo sito o blog.

Una volta finito di settare il componente non resta che salvare e verificare dal frontend che l’implementazione sia andata a buon fine e che il selettore di grandezza si veda correttamente.

Se vuoi personalizzare il modo in cui il selettore per il ridimensionamento dei testi viene mostrato potrai farlo semplicemente aggiungendo qualche riga al foglio di stile CSS del tema per WordPress che utilizzi, o ancora meglio del suo tema child.

Se ad esempio vuoi aggiungere un bordo alle lettere di grandezza diversa dovrai aggiungere il seguente codice:

.widget_accesstxt a {
 border: 2px solid #000;
 padding: 2px;
 font-weight: bold;
 }

In questo modo potrai offrire al meglio i contenuti, i cui testi potranno essere facilmente ridimensionati, ingranditi e rimpiccioliti a piacimento dell’utente.

Se hai dubbi, difficoltà o considerazioni in merito non esitare a lasciare un commento, come sempre saremo felici di poterti rispondere.

We will be happy to hear your thoughts

Leave a reply