Una caratteristica molto apprezzata di Elementor è la sua interfaccia semplificata per le icone, che include oltre 1.500 icone Font Awesome 5.
Ma Elementor non si ferma qui! Offre anche la possibilità di caricare set completi di icone personalizzate direttamente nel suo editor. Essendo integrate tre delle più popolari piattaforme di font di icone (Fontello, IcoMoon e Fontastic), creare i tuoi set di icone sarà un gioco da ragazzi.
Una volta aggiunto un set, tutte le icone saranno disponibili all’interno della libreria icon di Elementor, con la possibilità di modificarne ulteriormente lo stile attraverso i controlli nativi dell’editor.
Hai la possibilità di personalizzare i tuoi set di icone e di applicare velocemente gli ultimi stili alle tue pagine web.
Come creare icone personalizzate per Elementor Pro
In primo luogo, è necessario scaricare o creare delle icone personalizzate in formato SVG. Per farlo, puoi utilizzare servizi come Fontello, IcoMoon o Fontastic.
Prendiamo come esempio Fontello per capire in modo completo come funziona il caricamento delle icone personalizzate.
Una volta all’interno del sito Fontello, potrai scegliere di utilizzare le icone presenti al suo interno o caricare e trasformare in icone delle grafiche che hai realizzato o recuperato altrove.
La procedura è la stessa per entrambe le metodologie, semplicemente nel caso in cui tu voglia trasformare delle tue grafiche personalizzate in icone utili per Elementor, dovrai caricare le tue grafiche (in SVG) nell’apposito box di Fontello (vedi immagine sopra).
Una volta fatto questo passaggio, vedrai le tue nuove icone all’interno di una nuova sezione dedicata nella pagina Fontello.
Adesso ti basta selezionare tutte le icone che ti interessano (caricate da te o già presenti in Fontello), cliccare sulle impostazioni del tuo kit di icone (simbolo della chiave inglese in alto a destra) ed inserire un prefisso CSS (utilizzane uno diverso per ogni kit che vuoi scaricare).
A questo punto potrai scaricare il tuo kit attraverso il pulsante rosso dedicato al download ed il tuo set di icone sarà pronto per essere utilizzato.
Come aggiungere icone personalizzate su Elementor Pro
Dopo aver creato un pacchetto di icone personalizzate su Fontello, dovrai caricarlo sul tuo Elementor Pro.
Per farlo vai nella dashboard WP,su “Elementor” > “Custom Icons” > “Aggiungi Nuovo“, trascina il file zip del pacchetto e inserisci il nome che vuoi assegnare al set di icone.
Aggiorna la pagina e vedrai che le tue icone saranno automaticamente disponibili nella sezione “Custom Icons“.
Inoltre, se vuoi poter utilizzare icone personalizzate dal servizio Font Awesome Pro, puoi aggiungere direttamente il tuo kit ID all’interno delle integrazioni Elementor. Appena inserito, potrai scegliere le icone da Font Awesome Pro e usarle nei tuoi widget.
Infine, una volta aggiunte le icone personalizzate, saranno disponibili nella sezione “Custom Icons” e potrai usarle nei vari widget.
