Aggiungere un'animazione a un badge

Aggiungi effetti di animazione per attirare l’attenzione della clientela su saldi, offerte a tempo e informazioni importanti sul prodotto.

Come aggiungere un’animazione

1. Apri l’editor dei badge

   Da Sami Product Labels, vai su Badges & Labels. Fai clic su Edit badge/label per un badge esistente, oppure su Create badge e completa la configurazione iniziale del badge.

2. Apri Design

   L’editor si apre per impostazione predefinita su Design. Se ti trovi in un’altra scheda, fai clic su Design.

3. Espandi Advanced settings

   Scorri in fondo a Design, poi fai clic su Advanced settings.

   

   Espandi Advanced settings per trovare i controlli dell’animazione sotto Effects.

4. Attiva Use animation

   In Effects, attiva Use animation. Compaiono i controlli per tipo, velocità e ripetizione dell’animazione.

5. Seleziona il tipo di animazione

   Scegli uno dei 13 effetti disponibili: Pulse, Flash, Bounce in, Bounce out, Swing, Wobble, Flip, Gelatine, Roll in, Roll out, Rotate in down left, Rotate in up left o Hi there.

   

   Scegli un effetto di animazione, poi regolane la velocità e il numero di ripetizioni.

6. Imposta la velocità dell’animazione

   Usa il cursore o il campo numerico Animation speed per impostare un valore da 0 a 10. Osserva l’anteprima dal vivo mentre regoli, in modo che l’effetto resti ben visibile senza distogliere l’attenzione dal prodotto.

7. Imposta il numero di ripetizioni

   Usa il cursore o il campo numerico Animation Repeat per impostare un valore da 0 a 100.

8. Salva e visualizza l’anteprima

   Controlla l’effetto nell’anteprima dal vivo. Puoi passare tra le anteprime di pagina collezione e pagina prodotto e tra le viste desktop e mobile. Quando l’animazione ti convince, fai clic su Save in alto nell’editor.

Nota

Verifica anche il badge salvato sulla vetrina. Il CSS del tema e il layout della pagina possono influire sull’aspetto di un’animazione nel contesto reale.

Passaggi successivi

• Modificare lo stile del badge: personalizza caratteri, colori, bordi e sfondi del badge.
• Usare CSS personalizzato: usa CSS personalizzato per uno stile avanzato e per rifinire l’animazione.

Consiglio

Serve aiuto?

Se incontri difficoltà mentre segui questi passaggi, scrivici a [email protected].