Tutorial WordPress affidabili, quando ne hai più bisogno.
Guida per principianti a WordPress
WPB Cup
25 Milioni+
Siti web che utilizzano i nostri plugin
16+
Anni di esperienza con WordPress
3000+
Tutorial WordPress di esperti

Come aggiungere un'immagine nel widget della barra laterale di WordPress

Quando abbiamo lanciato WPBeginner, abbiamo capito rapidamente quanto la barra laterale potesse essere preziosa per connetterci con i nostri visitatori.

Abbiamo iniziato a usare immagini nella nostra barra laterale per renderla più accattivante visivamente, e i risultati sono stati impressionanti.

Le immagini ci hanno aiutato a promuovere i nostri corsi gratuiti, evidenziare offerte con coupon, mostrare articoli popolari e guidare i lettori verso diversi tipi di articoli e toolkit.

Con pochi tocchi visivi, la barra laterale è diventata una delle parti più efficaci del nostro sito per generare coinvolgimento e clic.

In questa guida, ti mostreremo come aggiungere facilmente immagini ai widget della barra laterale sul tuo sito WordPress, indipendentemente dal tema che stai utilizzando o dalla tua esperienza tecnica.

Come aggiungere un'immagine nel widget della barra laterale di WordPress

Perché aggiungere immagini alla barra laterale di WordPress?

Aggiungere immagini alla barra laterale di WordPress può migliorare significativamente l'attrattiva visiva e la funzionalità del tuo sito web.

A differenza del testo semplice, le immagini possono catturare efficacemente l'attenzione delle persone, rendendole più propense a interagire con i contenuti. Questo può essere utile per evidenziare guide importanti, promozioni o risorse che vuoi che i tuoi visitatori notino.

Inoltre, le immagini contribuiscono all'estetica generale del tuo sito, rendendolo più piacevole visivamente e facile da usare.

Una barra laterale ben progettata con immagini può migliorare l'esperienza utente, con conseguenti visite più lunghe al sito e tassi di rimbalzo ridotti. Questo può anche migliorare la reputazione e la credibilità del tuo sito web.

Detto questo, diamo un'occhiata a come aggiungere facilmente immagini alla barra laterale del tuo sito WordPress.

Fai semplicemente clic sui collegamenti sottostanti per passare alla sezione preferita:

Opzione 1: Utilizzo del blocco widget immagine di WordPress

Puoi utilizzare un blocco widget immagine per aggiungere immagini alla barra laterale del tuo sito.

L'editor a blocchi per i widget è stato introdotto in WordPress 5.8 e replica l'esperienza di utilizzo dell'editor di contenuti di WordPress. Puoi utilizzare diversi blocchi per aggiungere moduli, post correlati, immagini e altri elementi all'area widget utilizzando i blocchi.

Per iniziare, dovrai visitare la pagina Aspetto » Widget dalla tua bacheca di WordPress. Dopodiché, fai semplicemente clic sul pulsante '+' e aggiungi un blocco widget immagine.

Aggiungere un blocco widget immagini

Successivamente, puoi aggiungere un'immagine nel blocco widget in 3 modi.

Ad esempio, puoi caricare un'immagine, scegliere un'immagine esistente dalla tua libreria multimediale di WordPress o inserire l'immagine da un URL.

Carica immagine nel blocco widget

Nell'editor del blocco widget, avrai anche opzioni per cambiare lo stile, aggiungere un testo alternativo e modificare le dimensioni dell'immagine.

Ci sono impostazioni per cambiare il bordo dell'immagine e altre impostazioni avanzate.

Modifica le impostazioni del blocco widget immagine

Al termine, non dimenticare di fare clic sul pulsante 'Aggiorna'.

Successivamente, puoi visitare il tuo sito web e vedere l'immagine nella barra laterale.

Visualizza immagine nella barra laterale

🔎 Vuoi rendere le tue immagini più interattive? Prova ad aggiungere hotspot alle tue immagini per evidenziare caratteristiche specifiche dei tuoi elementi visivi!

Opzione 2: Utilizzo del plugin widget immagine

Un altro modo per aggiungere immagini alla barra laterale di WordPress è utilizzare un plugin. Questo ti offrirà alcune opzioni in più e un'interfaccia semplice, che alcuni principianti potrebbero trovare più facile rispetto al widget 'Immagine' predefinito.

Innanzitutto, è necessario installare e attivare il plugin Image Widget. Per maggiori dettagli, consulta la nostra guida passo passo su come installare un plugin WordPress.

Dopo l'attivazione, vai semplicemente alla pagina Aspetto » Widget e aggiungi il blocco ‘Image Widget’.

Aggiungi blocco widget immagine

Successivamente, fai clic sul pulsante ‘Seleziona immagine’ per caricare un'immagine o selezionarne una dalla libreria multimediale.

Dopodiché, devi fare clic sul pulsante ‘Inserisci nel widget’ e vedrai l'anteprima dell'immagine nelle impostazioni del widget.

Seleziona un'immagine dalla libreria

Puoi aggiungere un titolo o testo alternativo, nonché un link e una didascalia per l'immagine.

Puoi anche scegliere una dimensione dell'immagine dall'elenco delle opzioni disponibili, modificare l'allineamento e altro ancora.

Aggiungi titolo e testo alternativo

Una volta soddisfatto, fai semplicemente clic sul pulsante Aggiorna per salvare il widget immagine. Tutto qui. Ora puoi andare sul tuo sito web e vedere l'immagine visualizzata nella tua barra laterale.

Se desideri visualizzare più immagini, puoi utilizzare il widget Galleria invece del widget Immagine.

Ancora una volta, vai alla pagina Aspetto » Widget e fai clic sull'opzione ‘Galleria’.

Scelta del widget Galleria

Da qui, puoi personalizzare le immagini nella tua galleria. Ad esempio, puoi arrotondare gli angoli delle immagini.

Una volta che sei soddisfatto di come appare la galleria, fai semplicemente clic su ‘Aggiorna’.

Personalizzazione del widget Galleria

Se desideri maggiori opzioni di personalizzazione, ti consigliamo di utilizzare un plugin per gallerie di immagini come Envira Gallery.

Viene fornito con molte più funzionalità, come modelli di galleria multipli che il widget galleria predefinito non offre. Inoltre, puoi creare album e aggiungere filigrane alle tue immagini.

Per ulteriori informazioni, consulta la nostra guida su come creare una galleria di immagini reattiva in WordPress.

Una volta installato il plugin e configurate alcune gallerie, vedrai il widget ‘Envira Gallery’ nel tuo editor di widget basato su blocchi.

Aggiunta del widget Envira Gallery

Tutto quello che devi fare dopo è scegliere la galleria che vuoi visualizzare.

Fai clic sul menu a discesa per farlo.

Scelta di una galleria da visualizzare con il widget Envira Gallery

Una volta fatto, puoi personalizzare ulteriormente la galleria. Ad esempio, puoi cambiare il layout delle colonne e abilitare la modalità lightbox quando si fa clic su un'immagine.

Quando sei soddisfatto, fai clic su ‘Aggiorna’.

Personalizzazione del widget Envira Gallery

Opzione 4: Aggiunta di immagini nell'area widget classica

Se stai utilizzando una versione precedente di WordPress o hai disabilitato i blocchi dei widget, puoi anche aggiungere facilmente un'immagine alla barra laterale.

Vai semplicemente alla pagina Aspetto » Widget dal tuo pannello di amministrazione di WordPress e aggiungi il widget ‘Immagine’ alla tua barra laterale. Se non hai mai usato i widget prima, consulta la nostra guida su come aggiungere e usare i widget in WordPress.

Aggiungi widget immagine

Il widget si espanderà e potrai vedere le sue impostazioni.

La prima opzione è aggiungere un titolo al widget immagine. Dopodiché, fai clic sul pulsante ‘Aggiungi immagine’ per continuare.

Questo aprirà l'uploader multimediale di WordPress, dove puoi fare clic sul pulsante carica file per caricare la tua immagine o selezionare un'immagine che hai precedentemente caricato.

Impostazioni immagine

Dopo aver caricato l'immagine, vedrai le impostazioni dell'immagine nella colonna di destra. Da qui, puoi fornire un titolo o testo alternativo per l'immagine, aggiungere una descrizione, selezionare le dimensioni o persino aggiungere un link.

Una volta terminato, puoi fare clic sul pulsante 'Aggiungi al widget' per salvare le modifiche. Ora vedrai un'anteprima dell'immagine all'interno dell'area delle impostazioni del widget.

Anteprima widget

Non dimenticare di fare clic sul pulsante 'Salva' per salvare il tuo widget immagine.

Ora puoi visitare il tuo sito web per vedere l'immagine visualizzata nella barra laterale del tuo blog WordPress.

Anteprima immagine barra laterale

Opzione 5: Utilizzo del blocco widget HTML personalizzato

In alcuni casi, potrebbe essere necessario aggiungere codice HTML aggiuntivo alla tua immagine. Il widget di testo predefinito consente un HTML molto basilare, ma potrebbe non funzionare con HTML o formattazione avanzati. In tal caso, dovrai aggiungere manualmente un'immagine alla barra laterale del tuo blog.

Innanzitutto, devi caricare l'immagine sul tuo sito WordPress. Vai semplicemente su Media » Aggiungi nuovo e carica il tuo file immagine.

Dopo aver caricato l'immagine, è necessario fare clic sul collegamento Modifica accanto all'immagine.

Modifica immagine caricata

WordPress ti porterà ora alla pagina 'Modifica media', dove vedrai l'URL del file immagine sul lato destro dello schermo.

Devi copiare questo URL e incollarlo in un editor di testo come Blocco note.

Copia URL file immagine

Successivamente, devi andare alla schermata Aspetto » Widget dalla tua bacheca di WordPress.

Dopodiché, puoi aggiungere il blocco widget 'HTML personalizzato' alla tua barra laterale dove desideri visualizzare l'immagine.

Aggiungi blocco widget HTML personalizzato

Nell'area della casella di testo del widget, devi aggiungere la tua immagine usando questo codice:

<img src="Paste The File URL Here" alt="Strawberries" />

Il tag img viene utilizzato in HTML per visualizzare le immagini. Richiede due attributi. Il primo è src, che definisce la posizione del file immagine. Qui incollerai l'URL che hai copiato in precedenza.

Il secondo è alt, che viene utilizzato per fornire un testo alternativo per l'immagine. Il tuo tag immagine finale sarà simile a questo:

<img src="http://www.example.com/wp-content/uploads/2014/09/strawberries.jpg" alt="Strawberries" />

Devi fare clic sul pulsante 'Aggiorna' per memorizzare le impostazioni del widget e quindi visualizzare in anteprima il tuo sito web.

Speriamo che questo articolo ti abbia aiutato ad aggiungere un'immagine al widget della barra laterale di WordPress. Potresti anche voler consultare le nostre scelte degli esperti dei migliori page builder drag-and-drop in WordPress e come cambiare il lato della barra laterale in WordPress.

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

Dichiarazione: Il nostro contenuto è supportato dai lettori. Ciò significa che se fai clic su alcuni dei nostri link, potremmo guadagnare una commissione. Vedi come è finanziato WPBeginner, perché è importante e come puoi supportarci. Ecco il nostro processo editoriale.

Il Toolkit WordPress Definitivo

Ottieni l'accesso GRATUITO al nostro toolkit - una raccolta di prodotti e risorse relative a WordPress che ogni professionista dovrebbe avere!

Interazioni del lettore

50 CommentsLeave a Reply

  1. Ciao,

    Ho appena inviato una domanda sulla mia immagine che appare solo nella home page e non in altre pagine del sito. Ho risolto il mio problema e volevo condividere la soluzione nel caso potesse aiutare qualcun altro. Stavo cercando di usare il widget HTML personalizzato per MOSTRARE un paio di immagini nella mia barra laterale dei contenuti e quando ho configurato specificamente l'aggiunta delle pagine in cui volevo mostrarle (lasciando "Corrispondi a tutto" DESELEZIONATO), le immagini sono apparse solo nella Home page.

    The solution was to reverse it and tell the widget to HIDE if the page was 404 (or whatever you want). Now the images show up on the sidebar of all my pages. :-)

    Grazie,
    Holly

  2. Ciao,

    Ho fatto funzionare il widget HTML personalizzato nella home page, ma le immagini non appaiono nelle altre pagine statiche. Ho configurato le impostazioni su "Mostra se" le mie pagine desiderate sono selezionate, ma l'immagine appare solo nella home page. Ho provato a eliminare e riaggiungere il widget e a rimuovere e riaggiungere le pagine. Qualche idea?

    Grazie!
    Holly

    • Depending on your theme, the widget area you are placing it at may only display on your home page. You would want to check with the theme’s support for where those widgets should show :)

      Amministratore

  3. Ciao, sto cercando di aggiungere l'immagine e farla apparire nell'angolo in alto a sinistra del post. Quando la aggiungo e visualizzo l'anteprima, tutto è presente, ma quando pubblico non c'è. Qualche idea?

  4. Ho aggiunto un'immagine nel mio footer e su Chrome su un desktop appare e poi scompare immediatamente. Ho ridotto le dimensioni, ho provato ad aggiungerla come immagine in html ma niente risolve il problema. Su Chrome sul mio cellulare va bene. Non ho adblock sul mio desktop. Il problema si verifica anche con Firefox, ma Microsoft Edge funziona tutto bene. Qualche idea?

  5. ciao ho creato un blog in wordpress ma la lingua del contenuto dei post è telugu. come posso cambiare lo stile del font del post in telugu?

  6. Ciao,

    Ho provato entrambi i metodi elencati in questo video, e ancora l'immagine della barra laterale non viene visualizzata affatto.

    Avete qualche idea su come potrei risolvere questo problema?

    Grazie!

  7. Voglio mostrare un'immagine predefinita quando non c'è nulla nel widget. Come posso fare?

    Grazie

  8. C'è un modo per impostare l'immagine in modo che venga visualizzata solo sulla pagina iniziale?

  9. Grazie. Ci sto provando da tempo per caricare la mia foto profilo e ora posso farlo facilmente.

  10. Grazie per essere sempre in cima alle ricerche casuali che faccio per cose di WordPress – e grazie per le informazioni utili adatte alle persone comuni che usano WP!

  11. Grazie per aver scritto su questo in dettaglio. Voglio mettere i miei annunci nella sezione widget. Questo metodo si adatterà perfettamente alle mie esigenze. Ma ho solo un problema. Come aggiungere un'immagine diversa per ogni post del blog. C'è un modo per farlo?

  12. Credo che il video dicesse "Alt tag". Quella non sarebbe la terminologia corretta – sarebbe l'Attributo Alt del tag.

  13. Adoro questo tutorial, tuttavia sono scettico nel scaricare il widget immagine perché dice che non è stato testato con la mia versione di Wordpress. Ci saranno aggiornamenti in arrivo o come viene testato con la mia versione di Wordpress?

  14. Ciao, spero di non essermelo perso da qualche parte nei commenti, ma come si inserisce un'immagine circolare o ovale invece che quadrata per la sezione "chi sono" nella barra laterale? Sto usando Divi di Elegant Themes.

  15. Ciao,

    Hai idea del perché i punti elenco non vengano visualizzati nei widget della barra laterale nonostante abbia rimosso "list-style-type: none" dal file CSS e l'abbia sostituito con il seguente codice e ancora non funziona:

    .widget ul li { list-style: circle }

  16. wow! perfetto. Il testo visivo richiede troppo lavoro per una semplice immagine. Stavo cercando un plugin che facesse esattamente questo. grazie mille

  17. Ciao,
    Ho un paio di domande. Innanzitutto, per qualche motivo ho difficoltà a installare il plugin Widget Image. Ho già installato plugin in passato, ma questo non riesco a farlo. Certo, sono un principiante e li ho aggiunti quasi un anno fa, quindi forse ho dimenticato qualcosa. Puoi darmi qualche consiglio?

    Inoltre, che tu ci creda o no, sono riuscito a mettere un'immagine sul mio widget usando il codice HTML! (Sorpreso che potessi codificare, ma l'hai reso molto facile e comprensibile) L'unico problema che ho è che è a grandezza naturale e spero di avere delle miniature. Esiste un codice per questo? In tal caso, non ho bisogno di installare il plugin.
    Grazie!

  18. Ho letto questo per cercare di aggiornare l'immagine che ho su un widget sul mio blog.

    Siete sullo stesso pianeta del resto di noi? Date un'occhiata a quello che avete scritto – bisognerebbe essere un avvocato di Philadelphia incrociato con Steve Jobs per capire le istruzioni.

    Comunque – torniamo a cercare di cambiare l'immagine, sono sicuro che il trucco è da qualche parte.

  19. Grazie mille per queste informazioni. Ma ho davvero bisogno di sapere come visualizzare gli annunci di Google nei miei post e anche nella barra laterale. Ho già un account AdSense approvato e ho generato il codice dell'annuncio. Ma il passo successivo da compiere è quello che non capisco. Ho bisogno di aiuto per favore.

  20. O ho trascurato molte cose di cui hai parlato o il sito è cambiato. Vedo un'opzione per un widget immagine che dici non esistere. Non vedo alcuna libreria multimediale o galleria in cui posso caricare un file immagine.

    Quindi, dove carico il file in modo da poter ottenere un URL da inserire nel posto necessario sul modulo per configurare il widget immagine?

  21. Ciao. So come inserire le immagini nella barra laterale, ma occupano troppo spazio, quindi sto cercando di creare una galleria cliccabile qui. Ottengo la piccola casella cliccabile, ma non vengono visualizzate immagini. Sono anche riuscito a fare una presentazione automatica, ma è molto distraente, quindi non la voglio. Voglio solo la galleria fotografica in cui si clicca per passare all'immagine successiva, ma non trovo nulla su come risolvere questo problema qui.

  22. Ciao,

    Sto riscontrando un problema nell'aggiunta di widget immagine. Quando provo ad aggiungerne uno nuovo (dopo averne anche eliminato uno) le modifiche non vengono salvate, la pagina smette di caricarsi e quando provo ad accedere al sito (amministratore e normale) dice che non è possibile connettersi al server – quindi in pratica il mio sito è inattivo. Ho riavviato il mio computer e installato gli aggiornamenti e questo ha risolto il problema la prima volta, ma quando ho provato ad aggiungere di nuovo il widget è successa la stessa cosa, tranne che il riavvio non sembra più aiutare!

    Aiuto per favore! Lo apprezzerei molto!

    Grazie in anticipo!

  23. Ciao, grazie per questo, funziona benissimo. Ho una domanda; non voglio che la stessa immagine appaia su ogni pagina, quindi come faccio a limitarla a una pagina particolare in modo da poter utilizzare un'immagine diversa nelle pagine successive.

    Cordiali saluti,

    Gregor

  24. Thank you, the video is helpful but you zip through the dialogue so fast I had to hit pause, rewind pause, pause, repeat….many times. Please realize some of us are ABSOLUTE newbies on WordPress. Thanks for the great material…but slower would be more helpful. :-)

  25. Ho l'immagine nel widget – quello che voglio sapere è come puntare quel widget a un modulo di opt-in – come si aggiunge quel codice

Lascia una risposta

Grazie per aver scelto di lasciare un commento. Tieni presente che tutti i commenti sono moderati secondo la nostra politica sui commenti, e il tuo indirizzo email NON verrà pubblicato. Si prega di NON utilizzare parole chiave nel campo del nome. Avviamo una conversazione personale e significativa.