Cambiare il colore dei link in WordPress
siti web, e-commerce, seo, web agency, responsive, san benedetto del tronto, ascoli piceno, fermo, teramo, marche, abruzzo
5485
post-template-default,single,single-post,postid-5485,single-format-standard,bridge-core-3.1.3,qode-page-transition-enabled,ajax_fade,page_not_loaded,,qode_grid_1300,qode_popup_menu_push_text_top,qode-content-sidebar-responsive,qode-child-theme-ver-1.0.0,qode-theme-ver-30.2,qode-theme-bridge,wpb-js-composer js-comp-ver-7.3,vc_responsive

Cambiare il colore dei link in WordPress

Cambiare il colore dei link in WordPress

Cambiare il colore dei link in WordPress

Inizio l’anno nuovo con un articolo semplice ma funzionale, soprattutto se si verifica uno di quei casi in cui, in un modo o nell’altro, per cambiare il colore dei link in un sito WordPress non sono sufficienti le opzioni del tema in uso ed occorre intervenire in modo diverso. Il modo di verso che propongo in questo articolo è tramite codice, ma non allarmatevi, si tratta di un qualcosa di talmente semplice che non occorre essere dei professionisti, ma solo seguire un paio di indicazioni.

Ormai credo che conosciamo tutti i link sul web e non servono grosse spiegazioni, diciamo che dal punto di vista dell’usabilità per l’utente però è buona norma fare in modo che siano riconoscibili, proprio per permettere ai visitatori di poterli vedere e cliccare. Per tale motivo, se tali link non avessero un colore diverso ma bensì lo stesso del testo con cui scrivete, diventa alquanto complicato per chi naviga il sito poterli consultare. Qui infatti entrano in gioco i colori, i quali evidenziano tali parole per farle saltare all’occhio.

Per farlo, basta semplicemente andare in Aspetto > Personalizza > CSS aggiuntivo ed aggiungere il seguente codice:

a {
color: #f02c0a;
}

Nell’esempio qui sopra, il codice esadecimale (che trovate dopo il simbolo del cancelletto “#”) cambierà il colore dei link in rosso, pertanto, se desiderate personalizzare questo colore con uno a vostro piacere, non dovrete fare altro che cambiare #f02c0a nel colore esadecimale che volete usare nel vostro sito.
Se non sapete quale codice esadecimale usare, vi basta cercare su Google un qualsiasi codice esadecimale comprensivo del simbolo del cancelletto per avere una palette di colori fornita da Google nel primo risultato di ricerca nella quale spostarvi col cursore e scegliere, esattamente come in questo esempio.

Cambiare il colore del link al passaggio del mouse in WordPress

Ora che avete fatto questo primo step, vi suggerisco anche il secondo, ossia la possibilità di cambiare il colore del link al passaggio del mouse. Ciò a cui mi riferisco, è proprio il colore che compare al visitatore quando passa con il suo mouse su un qualsiasi link, si tratta infatti di un ulteriore metodo di interazione per attirare l’attenzione dell’utente.
Per farlo, basta aggiungere, sempre in Aspetto > Personalizza > CSS aggiuntivo il seguente codice subito dopo quello precedentemente integrato:

a:hover {
color: #ffea00;
}

Questo codice colorerà di giallo il link al passaggio del mouse, anche in questo caso, così come detto pocanzi, per personalizzare tale colore vi basta agire sostituendo il colore esadecimale con uno di vostra preferenza.

Sottolineare il link al passaggio del mouse in WordPress

Ultimo step, ma non è certamente obbligatorio, se desiderate personalizzare ancor di piì il vostro link, è quello di aggiungere anche la funzione di sottolineare il link al passaggio del mouse, il tutto con lo stesso colore scelto prima. Pertanto, in questo modo quando l’utente passerà sopra il vostro link, esso cambierà di colore con quello da voi scelto e contemporaneamente verrà sottolineato, sempre col medesimo colore.

a:hover {
color: #ffea00;
text-decoration: underline;
}
Non ci sono commenti

Pubblica un commento