Come mettere un testo in highlight su WordPress (anche con plugin e HTML)

Di Riccardo Esposito | Pubblicato il

Per evidenziare un testo su WordPress puoi utilizzare il comando del blocco formattazione che ti consente di cambiare colore sfondo di una stringa. Oppure puoi utilizzare il tag HTML <mark> per dare highlight giallo al contenuto.


Come formattare un testo WordPress

Una delle necessità fondamentali per chi scrive articoli online con WordPress: mettere un testo in evidenza. Perché magari sta delineando un punto, vuole far notare qualcosa al lettore. C’è un a call to action da spingere o una keyword da far mergere.

Quindi bisogna fare in modo che ci sia una formattazione specifica su un punto della pagina. Di solito utilizziamo il grassetto per far notare qualcosa al lettore, ma non sempre basta: ecco come evidenziare con colore differente un testo su WordPress.

Come evidenziare un testo con l’editor

Il modo più semplice per mettere in evidenza un contenuto sull’articolo del tuo blog WordPress: usare il nuovo editor Gutenberg. Per avere questo risultato puoi cambiare colore dello sfondo a questa singola parola o frase. La procedura è piuttosto semplice:

  • Evidenzia il termine interessato.
  • Vai nell’ultima freccia del menu a tendina.
  • Seleziona la voce evidenzia.
  • Scegli il colore che preferisci.

Così puoi scrivere su WordPress e ottenere esattamente ciò che serve: una sezione con sfondo differente. In questo modo puoi far sì che l’utente si focalizzi su una stringa di testo specifica. Tutto questo non ha effetti sull’ottimizzazione SEO on-page, è chiaro.

come si evidenzia un testo su wordpress
Come si evidenzia il testo con Gutenberg.

Il tool ti permette di scegliere da una palette che rappresentano quelli standard del tema WordPress. Poi, se clicchi sulla griglia accedi a un pick color per scegliere la tonalità da una serie di esempi e sfumature. Puoi anche aggiungere il codice esadecimale.

Da leggere: meglio allineare a bandiera o giustificato?

Come evidenziare il testo con l’HTML

Una soluzione utilizzata quando lavori sul codice HTML e lascia da parte l’editor: puoi modificare lo sfondo del contenuto ed evidenziare il testo su WordPress con un tag specifico: il <mark>. Di cosa sto parlando esattamente? Ecco un esempio:

<mark style="background-color:#f4ea09">testo esempio da evidenziare</mark>

Come puoi vedere dal tag HTML in alto, puoi capire che questo elemento deve avere un attributo di stile che indica il colore con l’esadecimale. Che in realtà puoi aggiungere anche alto CSS in modo da agire solo sull’elemento per mettere il testo in highlight.

<style>
mark { 
  background-color: yellow;
}
</style>

<mark>testo esempio da evidenziare</mark>

Se non sai come aggiungere lo stile del mark puoi utilizzare WPCode – Insert Custom Code Snippets. Ricorda che sia su Gutenberg che sull’editor classico devi intervenire nel foglio di modifica HTML per inserire il tag <mark>. Che ha un’apertura e una chiusura.

Altri metodi per evidenziare un testo sul web

Se devi mettere in risalto un elemento testuale ma non vuoi cambiare sfondo del font puoi utilizzare altri comandi tipici della formattazione. Ad esempio? Cosa ci propone WordPress? Con Gutengerg, selezionato un blocco puoi decidere aspetto e decorazioni.

Qui puoi scegliere un carattere che va dal chiarissimo – quindi poco evidente – al grassetto accentuato per dare massima rilevanza a ciò che vuoi comunicare nel post.

In alcuni casi puoi modificare le dimensioni del font e utilizzare anche il corsivo. Che non a caso usa il tag HTML <em> che sta per emphasized text. Poi c’è il sottolineato che non si usa spesso perché rischia di essere confuso con l’anchor text di un link.

Un plugin per intervenire sulla formattazione

Advanced Editor Tools è il plugin per eccellenza che ti consente di aumentare le opportunità di formattazione per avere degli strumenti specifici anche nel caso in cui sia necessario evidenziare il testo. Ma è abbastanza inutile se ti serve solo per questo.

Un plugin per intervenire sulla formattazione
Funzione Mark del plugin.

Il concetto: se vuoi usare un add-on solo per aggiungere una funzione extra di evidenziazione del testo sul sito web o sui post del tuo blog conviene utilizzare la soluzione nativa – perfettamente funzionante – ed evitare un plugin WordPress inutile sul database.

Da leggere: come inserire salti di pagina su WordPress con le ancore

Alcune regole per l’highlight dei contenuti online

Avere gli strumenti per evidenziare un testo su WordPress non vuol dire utilizzarlo su ogni articolo. Soprattutto, bisogna scegliere la combinazione sfondo/font in modo da evitare problemi di formattazione e leggibilità. Ricorda che conviene sempre rispettare uno standard: base chiara e testo scuro. Ad esempio giallo brillante o grigio chiaro e nero.

evidenziare un testo su WordPress

Inoltre bisogna considerare che un eccesso di testo evidenziato può ottenere l’effetto contrario, ovvero creare confusione e peggiorare la leggibilità di un contenuto. Considera bene come usare questa funzione, sempre con grande parsimonia e giudizio.

Riccardo Esposito

Sono un web writer freelance. Mi occupo di scrittura online dal 2009, mi sono specializzato nella stesura di piani editoriali per blog aziendali. Ho scritto 3 libri dedicati al mondo del blogging e della scrittura online (bio di Riccardo Esposito).

Categoria: WordPress

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Torna in alto