Come evidenziare del testo in un articolo del blog in modo personalizzato.

Ho già parlato di come sia possibile evidenziare del testo di un articolo attraverso l’estensione Line Marker oppure utilizzando l’editor di Blogger in Draft.

In entrambi i casi non possiamo scegliere dei colori personalizzati per le nostre evidenziazioni e nel caso di Blogger in Draft attualmente ci sono pure problemi di malfunzionamento.

Si può procedere diversamente in modo anche molto elegante creando appositamente delle classi in cui inserire le regole di evidenziazione. E’ più facile  mostrare degli esempi che spiegarlo in modo teorico.

Andate su Layout > Modifica HTML ed inserite il seguente codice immediatamente sopra al tag </head>

<style type='text/css'>
.evid1 {
color: #003366;
background-color: #FDBCB7;
}
.evid2 {
color: #940F04;
background-color: #67B4FF;
}
</style>

in cui ho creato due stili di evidenziazione cui ho dato il nome evid1 e evid2, si possono evidentemente scegliere anche altri nomi, inserire più di due classi o anche solo una. Sono due stili generici che possono andar bene con tutti i tag (span, p, div, table, ecc). Se volete utilizzarli solo con un tipo di tag, per esempio span, basta sostituire .evid1 e .evid2 rispettivamente con span.evid1 e span.evid2.

Nei due stili sono presenti il colore del testo (color: #FDBCB7; in evid1) e il colore dell’evidenziazione (background-color: #67B4FF; in evid1). Ovviamente possono essere sostituiti da altri colori più attinenti al blog.

Per evidenziare del testo bisogna passare alla modalità HTML ed inserire le due tag <span class=”evid1”> e </span> nel punto in cui si vuole che inizi e che finisca la evidenziazione. Si può usare anche evid2 e anche il tag “p”, in questo caso si evidenzia tutto un paragrafo inserendo <p class=”evid1”> all’inizio e </p> alla fine. Questo vale anche per il tag “div” e presumibilmente anche per altri, tipo “ul” e “ol” che rappresentano gli elenchi, o “table” che introduce una tabella.

Ecco un esempio di una evidenziazione con il primo stile (evid1) ed ecco un esempio di evidenziazione con il secondo stile (evid2). Gli screenshot mostrano gli inserimenti in modalità HTML

Un sistema forse un po’ complesso ma decisamente personale per dare un tocco di originalità al blog.

Questo metodo è molto efficiente se si ha un blog con Worpress in quanto ci sono dei plug-in che permettono l’inserimento di tag HTML in modo semplicissimo con un semplice click. Magari ne parlerò quando mi deciderò, se mi deciderò, a creare un blog che parli di come utilizzare quella piattaforma.