Usa l'indice dei contenuti
Inserire immagini su WordPress è una delle azioni maggiormente sfruttata quando si crea un sito internet, per questo motivo è importante sapere come farlo e sopratutto sapere come sfruttare questa funzionalità in più situazioni.
Più precisamente, oggi vedremo come caricare un’immagine su WordPress dall’interno di un articolo o pagina utilizzando Gutenberg, direttamente tramite il pannello “Media” di WordPress, e anche sfruttando il famoso page builder Elementor.
Vuoi velocizzare il tuo sito WordPress in pochi istanti? WP Rocket è il miglior plugin di cache per WordPress e ti permetterà di raggiungere prestazioni inimmaginabili.
Prima di caricare un’immagine, quello a cui devi prestare maggiore attenzione, è la sua dimensione. Il più delle volte infatti molti utenti, sbagliando, inseriscono le immagini su WordPress senza ottimizzarle, e questo grava pesantemente sulla velocità del sito.
Uno dei fattori principali di rank per Google ed i motori di ricerca in generale è la velocità con cui il sito apre i contenuti, e quindi una cattiva gestione degli stessi porta inevitabilmente a comparire in fondo ai risultati di ricerca.
In questo caso, il primo consiglio utile, è quello di ridimensionare le immagini con dimensioni adatte per il web. Ciò vuol dire che è inutile caricare sul sito internet un’immagine con dimensione 5000x3200px perché sarebbe eccessivamente grande, estremamente pesante e non ottimizzata.
Se hai bisogno di aiuto e vuoi migliorare la velocità del tuo sito WordPress, chiedi aiuto ai nostri specialisti tramite la pagina di assistenza WordPress, saranno felici di darti una mano!
Inserire immagini su WordPress con Gutenberg
Con WordPress 5.0 abbiamo visto l’introduzione di un nuovo editor di testo: Gutenberg. Questo nuovo editor nasce con l’obiettivo di semplificare il lavoro anche ai meno esperti grazie all’utilizzo dei blocchi.
I blocchi a nostra disposizione sono molti, tra i quali troviamo: intestazioni, testo, immagini, tabelle, ma anche shortcode e categorie. Aggiungere un’immagine con Gutenberg è quindi molto semplice dato che esiste un blocco ad hoc.
Ma come procedere? Per prima cosa rechiamoci nell’articolo o nella pagina dove vogliamo inserire l’immagine. Facciamo click sul pulsante “+” come mostrato nell’immagine poco più sopra, e avremo a disposizione i blocchi di Gutenberg, a questo punto scegliamo il blocco “Immagine“.
In seguito ci verrà chiesta la sorgente dalla quale inserire il file media, possiamo decidere di caricarlo dal nostro PC, selezionarlo dalla galleria media presente su WordPress o inserire un URL del link presente su un altro sito web, infine pigiamo su “Seleziona” per inserire il file media.
Suggerimento: prima di caricare l’immagine sul tuo spazio web, ottimizza il peso della stessa tramite il sito tinyPNG.com. Noterai una perdita quasi impercettibile della qualità ma un notevole miglioramento del peso effettivo del file multimediale.
Utilizzando il menu a destra del documento, avendo cura di essere sul blocco immagine, possiamo modificare diversi aspetti del file. Attraverso la sezione “Stili” andremo a scegliere se visualizzare l’immagine circolare o rettangolare, mentre in “Impostazioni Aggiuntive” potremo aggiungere l’Alt text (testo alternativo) molto importante a livello SEO, in quanto sarà questa descrizione a far capire agli spider dei motori di ricerca, di che immagine si tratta.
Inoltre, sempre in questo pannello, potremo andare a scegliere la dimensione dell’immagine tra: miniatura, medio, grande o dimensione reale (la scelta varia in base a quanto vogliamo che sia grande l’immagine da mostrare). Infine in “Avanzate” potremo applicare una classe CSS.
Inserire immagini su WordPress dalla libreria media
A volte, capita di dover caricare un’immagine sul nostro sito WordPress, ma di non volerla applicare in un articolo o pagina specifica. Per questo, o per altri motivi, è opportuno utilizzare il pannello di WordPress per effettuare l’upload di file multimediali ed avere così il file sul nostro spazio web.
La prima cosa da fare dopo aver scelto l’immagine da caricare, è di andare nella bacheca di WordPress e dirigersi nel sotto menu “Media -> Aggiungi Nuovo“. Ci troveremo dinanzi una schermata dove potremo trascinare il file o caricarlo dal disco del nostro computer.
Una volta completato il caricamento dell’immagine, cliccando su “Modifica“, potremo scoprire il link del file media appena caricato. L’immagine, ovviamente, potrà essere utilizzata successivamente all’interno di un articolo o pagina selezionando libreria media.
Inserire immagini su WordPress con Elementor
Se stai utilizzando Elementor sul tuo sito web, è possibile utilizzare l’apposito widget per caricare un’immagine all’interno della pagina per renderla più accattivante. Dirigiti nella pagina alla quale vuoi applicare il file immagine e, tramite il filtro a sinistra dello schermo, cerca il widget “Immagine“.
Dopo averlo fatto, trascina il blocco nella sezione dove vuoi mostrare l’immagine.
Passando il mouse sopra il widget, apparirà una matita blu che ti permette di aprire le impostazioni e quindi scegliere l’immagine da mostrare. Il tutto, corredato anche di altre impostazioni come stile e posizione. Il pannello è molto semplice ed intuitivo, ma allo stesso tempo ricco di opzioni.
Tramite questo pannello possiamo infatti modificare la dimensione dell’immagine, l’allineamento, aggiungere una didascalia ed inserire un link.
Ma non solo, potremo anche inserire uno sfondo dietro l’immagine, applicare un bordo, inserire un’ombra, aggiungere una classe CSS e molto altro ancora.
Ricorda che Elementor è provvisto di un lightbox per le immagini, questo permetterà alle immagini con link ai file media, di essere aperte nella stessa pagina. Puoi attivare questa funzionalità direttamente dalle impostazioni di Elementor.
Lasciando disattivata questa impostazione, le immagini con link ai file media, apriranno l’immagine linkata in una nuova pagina.
Conclusioni
Grazie a questa breve guida abbiamo imparato ad inserire immagini su WordPress attraverso il pannello nativo del CMS e tramite il plugin Elementor.
Ricorda il nostro consiglio, ossia di ottimizzare sempre le immagini prima di caricarle sul sito web, dato che questo fattore incide profondamente sulla velocità del un sito web.
Ora potrai migliorare graficamente il tuo sito web e renderlo davvero unico. Siamo sempre curiosi di sapere la tua opinione quindi facci sapere, tramite i commenti, se questa guida ti è stata utile.
Sei in cerca di un tema per WordPress flessibile e anche potente? Allora Divi può fare al caso tuo. Scopri tutta la sua potenza.
Salve, stranamente Elementor non mi fa più caricare immagini e neanche modificare lo stile dei pulsanti.
Eppure riesco a caricare i file nella libreria media, così come in un altro mio sito, sempre con Elementor, riesco a fare tutto bene come sempre.
Ho provato a togliere qualche plugin ma niente da fare…
Ciao Dani,
sembra essere un problema interno di Elementor, o qualche plugin che va in conflitto con Elementor non permettendogli di lavorare correttamente.
Se vuoi affidarti a noi puoi contattare la nostra assistenza.
Anche a me la stessa cosa… Ho provato a fare la procedura da capo cioè creando proprio un altro database, ma non non riesco a cambiarle… Sarà stato l’ultimo aggiornamento 🙈 speriamo di no!!
Anche nel tuo caso utilizzando Elementor?
Nell’ultima versione di Elementor (3.2.1) è presente un bug che non fa visualizzare le impostazioni di sezione quando si prova a modificare un elemento. Potrebbe essere questo il tuo caso.
È consigliato fare un downgrade di Elementor alla versione 3.1.4 fino a quando il problema non verrà risolto con un nuovo aggiornamento.
Idem, ho lo stesso problema di tutti voi.
Caso curioso: con il sito in cui ho Elementor Pro il problema non si verifica, mentre con il sito in cui ho Elementor Free non posso modificare lo stile e inserire le immagini.
Con la versione che hai consigliato si risolve tutto. Ti ringrazio infinitamente!