Come installare e utilizzare FontAwesome su WordPress

In questa guida ti mostrerò come utilizzare FontAwesome su WordPress per inserire icone fantastiche nei tuoi post.

Come al solito, però, andiamo con ordine.

Cos’è FontAwesome?

FontAwesome è una collezione di icon fonts, che ti consente di inserire in WordPress, ma in qualunque progetto web, una serie di icone (gratuite ed a pagamento) come se fossero caratteri di testo.

fontawesome su wordpress

Il vantaggio di utilizzare fontawesome su wordpress riguarda sicuramente la velocità con cui sarai in grado di integrare queste icone.

Utilizzare queste icone avrà un impatto minimo sulla velocità di caricamento del tuo blog wordpress poiché si integrano perfettamente con il CSS.

Pertanto, utilizzando fontawesome su wordpress ti consentirà di creare un blog non solo graficamente bello, ma anche funzionale e sicuramente veloce.

Come installare FontAwesome su WordPress:

Attualmente, la versione di FontAwesome rilasciata è la 5, perciò ti spiegherò come installare questa versione.

FontAwesome 4: Come Migrare?

Il problema attuale è che la maggior parte dei temi di wordpress distribuiti utilizza la versione precedente delle icon fonts, e, pertanto, installando la versione 5, perderai il supporto alla precedente versione.

Il risultato sarà che se non modifichi tutte le icone presenti, non le visualizzerai.

Per questo motivo ho deciso di creare un plugin che ti consenta di installare la versione 5 di FontAwesome, ma al contempo di mantenere il supporto alla precedente versione.

Installazione di FontAwesome su WordPress:

Non c’è bisogno di scaricare il file relativo alla nuova versione, e potrai utilizzare la versione di FA disponibile nel cloud messo a dispositizione dalla società che ha rilasciato gli icon fonts.

Al contrario, per manter

Hai due possibilità:

  1. Inserisci il codice che sto per mostrarti direttamente nel file function.php del tuo tema wordpress; questa opzione è sconsigliata, perchè ogni volta che aggiorni il tema dovrai reinserirla nel tuo function.php;
  2. Scaricare ed installare il plugin che ho creato per te; per abilitare il link di download, ti chiedo solo di condividere questo articolo tramite il box sottostante, e otterrai il link al plugin automaticamente.

#1 Inserimento nel file function.php del tuo tema.

  1. Accedi alla Bacheca di WordPress;
  2. Vai nella sezione “Aspetto” poi Editor;
  3. Nella barra di destra cerca il file “function.php“;
  4. Alla fine del file inserisci questo codice:
add_action( 'wp_enqueue_scripts', 'wp_cb_fontawesome' );
function wp_cb_fontawesome() {
 wp_enqueue_script( 'font-awesome', 'https://use.fontawesome.com/releases/v5.0.1/js/all.js', array(), null );
 wp_enqueue_script( 'font-awesome-4', https://raw.githubusercontent.com/creareblogsnet/wp-cb-fontawesome-CreareBlogsNet/master/wp-cb-fontawesome/js/4/fa-v4-shims.min.js, array(), null );
}
add_filter( 'script_loader_tag', 'wp_cb_add_defer_attribute', 10, 2 );<script>// <![CDATA[
tag for the enqueued script.
 * @param string $handle The script's registered handle.
 *
 * @return Filtered HTML script tag.
 */
function wp_cb_add_defer_attribute( $tag, $handle ) {
 if ( 'font-awesome' === $handle || 'font-awesome-4' === $handle ) {
 $tag = str_replace( ' src', ' defer src', $tag );
 }
 return $tag;
}

#2 Scarica il plugin che ho creato per te.

In alternativa puoi scaricare il plugin che ho creato da github.

  1. Scaricalo;
  2. Decomprimilo;
  3. Caricalo nella Cartella “wp-content/plugins” del tuo blog, tramite FTP
  4. Attivalo dalla Bacheca di WordPress.

Per scaricare il file, ti chiedo di utilizzare il Content Locker qui sotto. Grazie

 

 

Rispondi

%d blogger hanno fatto clic su Mi Piace per questo: