Il consiglio è sempre quello di non abusarne ma, se ben sviluppate e ben integrate, le animazioni riescono a rendere più accattivanti le pagine di un sito Web.

Grazie a WebAnimator possiamo realizzare, in modo semplice e veloce, animazioni adatte per essere inserite nei nostri siti e negozi online: non prevedendo l’uso di Flash ma impiegando, invece, HTML5, CSS e JavaScript, risultano infatti più leggere e soprattutto compatibili con qualsiasi browser e dispositivo mobile, incluso iPhone e iPad.

Le animazioni in HTML5 realizzate con WebAnimator possono essere facilmente integrate nei siti realizzati con WebSite X5. Se le si vuole inserire come contenuti di una pagina, si può sfruttare l’Oggetto HTML (vedere la FAQ “Come inserire un’animazione HTML5 di WebAnimator in WebSite X5” [ https://helpcenter.websitex5.com/post/107026 ]), oppure impiegare l’Oggetto opzionale WebAnimator Animation (vedere la FAQ “Come inserire un’animazione HTML5 di WebAnimator in WebSite X5 grazie all'Oggetto WebAnimator Animation” [ https://helpcenter.websitex5.com/post/108784 ]).

Un’altra possibilità è utilizzare le animazioni create con WebAnimator per personalizzare l’intestazione o il piè di pagina del modello grafico del sito. Per ottenere questo risultato occorre procedere nel seguente modo:

1. Creiamo l'animazione usando WebAnimator e salviamola con un nome (es: WA_Animation).

2. Esportiamo l'animazione da WebAnimator in una cartella vuota (es: C:\WA_Project).

3. Avviamo WebSite X5, apriamo in progetto su cui vogliamo lavorare e accediamo alla finestra Personalizzazione del Modello, al Passo 1.

4. Clicchiamo sul pulsante Inserisci codice HTML e inseriamo il seguente codice HTML:

Se abbiamo usato un nome diverso per l'animazione, nel codice sopra è necessario sostituire il nome "WA_Animation" con quello utilizzato.

Nell'Oggetto Codice HTML è anche necessario impostare la stessa altezza inserita nell'animazione in WebAnimator. È possibile modificare queste impostazioni in WebAnimator nella proprietà del progetto.

5. Andiamo al Passo 4 – Impostazioni Avanzate e clicchiamo sulla voce Statistiche, SEO e Codice. Apriamo la sezione Esperto e clicchiamo sul pulsante Aggiungi per importare tutti i file che si trovano nella cartella C:\WA_Project\WA_Animation_resources in modo da allegarli. Verifichiamo di aver impostato come percorso relativo sul server WA_Animation_resources. Solo per il file jquery-1.7.min.js, selezionare l'opzione Collega il file (solo per file .js e .css). In questo modo alleghiamo tutti i file necessari per il corretto funzionamento dell’animazione. 

Fatto questo, non ci resta che confermare tutto e cliccare sul pulsante Anteprima per verificare che tutto funzioni correttamente.

Buon lavoro!

-------------------------------------------------------

Su questo argomento vedi anche:

• Come inserire un'animazione HMTL5 di WebAnimator in WebSite X5 [ https://helpcenter.websitex5.com/post/107026 ]
• Come inserire un’animazione HTML5 di WebAnimator in WebSite X5 grazie all’Oggetto WebAnimator Animation [ https://helpcenter.websitex5.com/post/108784 ]