Editor X: aggiungere e personalizzare i file di animazione Lottie

Tempo di lettura: 4 min.
Editor X sta passando a Wix Studio, la nostra nuova piattaforma per agenzie e freelancer.Scopri di più su Wix Studio
LottieFiles è un'ottima fonte di animazioni di alta qualità che puoi aggiungere al tuo sito Editor X. Dopo aver importato l'animazione tramite il suo URL, puoi ridimensionarla in base alle tue esigenze e decidere se viene o meno riprodotta ininterrottamente. 
In questo articolo, scoprirai come:
Prima di iniziare:
Per importare un'animazione, devi avere un account LottieFiles. 

Importare animazioni da LottieFiles

Puoi importare tutte le animazioni di Lottie di cui hai bisogno per ravvivare il tuo design. Una volta aggiunto un elemento Animazione Lottie all'Editor X, incolla l'URL dell'animazione nel pannello Impostazioni per vedere come appare sulla tua pagina. 

Per importare un'animazione Lottie:

  1. Clicca su Aggiungi elementi nella parte superiore dell'Editor X
  2. Clicca su Incorpora e Social
  3. Clicca su Animazione Lottie
  4. Trascina l'elemento sotto Animazione Lottie nella posizione desiderata sulla tua pagina
  5. (In una scheda separata) Copia l'URL dell'animazione da LottieFiles:
    1. Accedi al tuo account LottieFiles (pagina in inglese)
    2. Seleziona l'animazione scelta
    3. Clicca sull'icona Copia sotto Lottie Animation URL
  6. Incolla l'URL dell'animazione nell'Editor X:
    1. Clicca sull'elemento Animazione Lottie nell'Editor
    2. Clicca sull'icona Impostazioni
    3. Incolla l'URL in Qual è l'URL dell'animazione?
    4. Premi Invio sulla tastiera
Qual è il prossimo passo?
Scopri come viene riprodotta l'animazione cliccando su Anteprima animazione nella parte superiore del pannello Impostazioni.
Modifica dell'URL dell'animazione Lottie dal pannello Impostazioni dell'elemento, dopo averlo aggiunto al tuo sito Editor X
Usare i punti di interruzione:
Puoi personalizzare le dimensioni dell'animazione Lottie in base al punto di interruzione, in modo che abbia l'aspetto perfetto su ogni schermo. 

Modificare l'animazione Lottie

Se vuoi modificare l'animazione Lottie, puoi farlo incollando il nuovo URL nel pannello Impostazioni dell'elemento. 

Per modificare l'animazione:

  1. Clicca sull'animazione Lottie nell'Editor X
  2. Clicca sull'icona Impostazioni
  3. Incolla l'URL della nuova animazione in Qual è l'URL dell'animazione?
Modifica dell'URL dell'animazione Lottie dal pannello Impostazioni dell'elemento nell'Editor X

Impostare la riproduzione ininterrotta dell'animazione

Puoi scegliere la modalità di riproduzione dell'animazione Lottie, una sola volta o ininterrottamente. 

Per impostare la modalità di riproduzione dell'animazione:

  1. Clicca sull'animazione Lottie nell'Editor X
  2. Clicca sull'icona Impostazioni
  3. Clicca sull'interruttore accanto a Riproduzione ininterrotta per attivare o disattivare questa opzione
Il cursore di trova sull'interruttore per impostare un'animazione Lottie in modo che venga riprodotta ininterrottamente.

Aggiungere alt text alla tua animazione Lottie

Dal pannello Impostazioni, puoi aggiungere un alt text per descrivere brevemente la tua animazione Lottie. Questo può migliorare il posizionamento SEO oltre che aiutare gli utenti che usano gli screen reader a capire cosa viene mostrato nella tua animazione. 

Per aggiungere alt text all'animazione:

  1. Clicca sull'animazione Lottie nell'Editor X
  2. Clicca sull'icona Impostazioni
  3. Digita o incolla la descrizione del testo nel campo sotto Scrivi il testo alt dell'animazione
  4. Premi Invio sulla tastiera
Scrittura di alt text per un'animazione Lottie nel pannello Impostazioni dell'elemento nell'Editor X

Hai trovato utile questo articolo?

|