Widgets: Icon

Categorie di widget: Base

Scegli tra una libreria di oltre 1000 icone già pronte oppure carica il tuo file SVG. Puoi cambiare colore dell'icona, hover, sfondo, bordo e altro. Usa le icone per dare risalto al testo e bilanciare il layout del tuo sito.

Per sapere come aggiungere i widget, consulta «Add Widgets».

Nota:

• I file SVG si possono ridimensionare senza perdere risoluzione.
• Gli SVG sono file immagine che contengono codice HTML: ogni volta che aggiungi un'icona SVG al sito, aggiungi anche righe di codice. Diversi SVG complessi possono sommare migliaia di righe e rallentare il caricamento del sito. Se ti servono più icone SVG sulla stessa pagina, ti consigliamo di convertirne alcune in immagini normali (.png, .jpeg, ecc.) per evitare problemi di caricamento o di funzionamento.

Editor di contenuto

Fai clic sull'elemento per aprire il menu fluttuante, poi seleziona l'opzione per l'editor di contenuto.

1. Fai clic su Seleziona icona per scegliere un'icona già pronta, oppure su Carica file SVG.
2. Per collegare l'icona, fai clic su Icona collegamento e scegli la pagina a cui vuoi collegarla.
3. Scrivi un testo alternativo (Alt text) per l'icona. Il testo alternativo aiuta i motori di ricerca a riconoscere il contenuto dell'immagine. Usa un testo che descriva l'immagine con chiarezza.
4. Scrivi un tooltip per l'icona. Il testo del tooltip compare quando un utente passa il mouse sopra l'immagine.

Editor di design

Fai clic sull'elemento per aprire il menu fluttuante, poi seleziona l'opzione per modificare il design.

Nell'editor di design puoi modificare il layout dell'icona, regolarne dimensione e colore e cambiare la spaziatura del widget.

Per rendere l'icona un widget fluttuante, attiva l'opzione Galleggiante e scegli una posizione per il widget. Per mostrare il pulsante fluttuante solo sulla pagina corrente, attiva l'opzione Mostra solo su questa pagina.

Nota: le icone fluttuanti si possono impostare perché compaiano su pagine specifiche, ma di default compaiono su tutte (per ora non c'è modo di disattivarle solo su alcune pagine).

Per informazioni sulle opzioni di design non specifiche di questo widget (ad esempio layout, stile o spaziatura), consulta «Widget Design».

Domande frequenti e risoluzione dei problemi

Perché il colore dell'icona non cambia quando seleziono un colore diverso?

Di solito il problema dipende da come è stato creato il file in origine. Il colore dell'icona deve essere nero puro (ad esempio, codice esadecimale #000000).

Inoltre, l'SVG va esportato con stile inline.

Dato che i file SVG possono avere un codice complesso, per qualsiasi modifica conviene rivolgersi a qualcuno esperto di SVG.