Come aggiungere GIF animate in WordPress (Il MODO GIUSTO)

Una volta ho trovato la GIF perfetta per rendere un post più coinvolgente, ma si è trasformata in un'immagine statica e immobile subito dopo il caricamento. Era incredibilmente fastidioso vedere l'animazione scomparire proprio quando volevo coinvolgere i miei lettori.

Questo accade perché quando WordPress crea automaticamente dimensioni di immagine più piccole (come le miniature), utilizza solo il primo fotogramma dell'animazione. Il resto dei dati dell'animazione non è incluso in queste dimensioni generate.

Fortunatamente, risolvere questo problema è semplice una volta che sai quale impostazione modificare. Ho utilizzato questo metodo specifico sui miei siti per mantenere le animazioni fluide senza alcun codice.

Ecco come aggiungere GIF animate in WordPress nel modo giusto.

Perché le GIF di WordPress non funzionano correttamente?

Ogni volta che carichi un'immagine nella libreria multimediale, WordPress crea automaticamente diverse copie di quell'immagine in diverse dimensioni.

Ci sono 3 dimensioni delle immagini di WordPress predefinite che vengono generate automaticamente: miniatura, media e grande. WordPress conserva anche il tuo caricamento originale, che viene chiamato 'Dimensione intera'.

Il problema è che quando crea queste nuove dimensioni di immagine per le GIF animate, WordPress cattura solo il primo fotogramma dell'animazione.

Di conseguenza, quando aggiungi una di quelle dimensioni di immagine generate al tuo post o alla tua pagina, saranno immagini statiche e il risultato sarà che la GIF di WordPress non funzionerà.

Ora, vediamo il modo corretto di aggiungere GIF animate in WordPress in modo che mantengano la loro animazione.

Aggiungere correttamente GIF animate in WordPress

Innanzitutto, devi modificare o creare un nuovo post o pagina di WordPress nell'editor Gutenberg di WordPress per aggiungere la GIF animata.

Una volta nell'editor di contenuti di WordPress, fai clic sul pulsante '+' e aggiungi un blocco Immagine.

Successivamente, troverai diversi modi per caricare la tua GIF animata nel blocco Immagine.

Per iniziare, fai semplicemente clic sul pulsante 'Carica' e seleziona la tua GIF animata dal tuo computer. Oppure puoi fare clic sul pulsante 'Libreria multimediale' e aggiungere file multimediali che sono già stati caricati nella tua libreria multimediale.

C'è anche un'opzione per inserire il link alla tua GIF facendo clic sul pulsante 'Inserisci da URL', ma non lo consigliamo perché non carica l'immagine sul tuo sito web.

Una volta caricata la tua GIF, l'editor a blocchi la inserirà nei tuoi contenuti e potrai personalizzarla.

Dopo aver aggiunto la GIF, dovrai selezionare l'opzione 'Dimensione intera' sotto 'Dimensione immagine' dal menu sulla destra.

È importante selezionare ' Dimensione intera ' perché questo dice a WordPress di utilizzare la GIF animata originale e non modificata che hai caricato.

Le altre dimensioni (come 'Miniatura', 'Media' o anche 'Grande') sono copie statiche che WordPress ha generato utilizzando solo il primo fotogramma. Scegliendo 'Dimensione intera', ti assicuri che l'animazione venga riprodotta correttamente. 👍

Sarai in grado di vedere l'animazione subito nell'editor dei contenuti.

Procedi pure alla pubblicazione o all'aggiornamento del tuo post del blog per vedere le GIF animate in azione.

Suggerimenti bonus per l'utilizzo di GIF animate in WordPress

Le immagini GIF animate sono solitamente più grandi in termini di dimensioni del file rispetto ad altri file immagine. Questo perché contengono diverse immagini compresse utilizzate come fotogrammi per creare l'animazione.

L'utilizzo di GIF di grandi dimensioni o l'aggiunta di troppe immagini GIF su una pagina WordPress può rallentare il tuo sito web e danneggiare l'ottimizzazione per i motori di ricerca (SEO). Consulta la nostra guida definitiva su come migliorare la velocità e le prestazioni di WordPress per maggiori dettagli.

Se utilizzi Giphy.com per trovare GIF animate, potresti trovare molto utile il plugin GIF Master. Ti consente di cercare nel database Giphy dalla tua bacheca di WordPress e aggiungere GIF senza lasciare il tuo sito WordPress.

Se hai un link a una GIF da Giphy, puoi anche semplicemente incollare l'URL direttamente nell'editor di WordPress su una riga separata. WordPress incorporerà automaticamente la GIF animata per te, senza bisogno di plugin.

Domande frequenti sui GIF in WordPress

Ecco le risposte ad alcune delle domande più comuni che riceviamo sull'utilizzo di GIF animate in WordPress.

Perché le GIF animate sono così grandi?

Le GIF animate sono essenzialmente una serie di immagini statiche, o fotogrammi, impacchettati in un unico file. Più fotogrammi e colori ha una GIF, maggiore sarà la sua dimensione del file.

Ecco perché sono spesso molto più grandi delle immagini JPG o PNG standard.

Come posso ottimizzare le GIF per renderle più piccole?

Puoi utilizzare strumenti online gratuiti come EZgif o GIMP per ottimizzare le tue GIF animate. Questi strumenti possono ridurre le dimensioni del file rimuovendo fotogrammi extra o abbassando il numero di colori.

È dannoso usare molte GIF in una singola pagina?

Sì, aggiungere troppi file GIF di grandi dimensioni a una singola pagina può rallentare significativamente il tempo di caricamento del tuo sito web. Questo può creare una scarsa esperienza utente e influire negativamente sui tuoi ranking SEO.

È meglio usarle con parsimonia per evidenziare punti chiave o aggiungere interesse visivo dove conta di più.

Risorse aggiuntive per la gestione dei tuoi media

Speriamo che questa guida ti abbia aiutato ad aggiungere correttamente le GIF animate al tuo sito WordPress. Ora che hai imparato a usare le GIF, potresti trovare utili questi altri articoli sulla gestione dei media.

• Ottimi plugin WordPress per la gestione delle immagini – Scopri strumenti che possono aiutarti a organizzare, ottimizzare e visualizzare le tue immagini in modo più efficace.
• Perché non dovresti mai caricare un video su WordPress – Scopri perché ospitare i tuoi video può danneggiare le prestazioni del tuo sito e cosa dovresti fare invece.

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.