Come aggiungere testo sopra un’immagine in WordPress (3 metodi)

In molti casi è necessario aggiungere un overlay di testo a un’immagine in WordPress.

Forse state creando un banner accattivante per la vostra homepage. O forse volete aggiungere un titolo accattivante alla vostra immagine in evidenza. Anche noi ci siamo trovati in questa situazione e l’aggiunta di un overlay di testo è un ottimo modo per rendere le immagini più informative e coinvolgenti.

Se avete bisogno di aiuto per aggiungere testo in alto alla vostra immagine in WordPress, siete nel posto giusto. Abbiamo trovato 3 modi semplici per add-on il testo sulle immagini in WordPress, senza bisogno di competenze di progettazione.

Quando aggiungere testo alle immagini in WordPress

Leimmagini possono rendere più interessante il vostro sito web WordPress e contribuire a spezzare grandi paragrafi di testo.

Tuttavia, a volte le immagini possono richiedere maggiori spiegazioni. Ad esempio, si potrebbe aggiungere del testo sopra un’immagine per spiegare cosa mostra l’immagine e perché l’avete aggiunta al vostro post.

Molti blog WordPress aggiungono anche del testo sopra un’immagine per creare banner e intestazioni accattivanti e informative.

In questo post abbiamo tre modi, adatti ai principianti, per aggiungere del testo sopra un’immagine in WordPress. Se preferite passare direttamente a un metodo particolare, potete utilizzare i link sottostanti:

Metodo 1: Aggiungere testo sopra un’immagine utilizzando il blocco di copertura

Un modo per aggiungere testo sopra un’immagine in WordPress è utilizzare il blocco Cover. È possibile utilizzare questo blocco per mostrare qualsiasi immagine e poi digitare del testo sopra l’immagine. Ciò rende il blocco Cover perfetto per creare immagini eroiche, header e banner.

Per aggiungere un blocco di copertina a una pagina o a un post, è sufficiente fare clic sul pulsante “+ Aggiungi blocco” nell’editor di blocchi di Gutenberg.

Ora è possibile digitare “copertina” e selezionare il blocco giusto quando appare.

Qui si può scegliere il blocco copertina predefinito. Ma si può anche scegliere l’opzione template con immagine e testo segnaposto. Con la seconda opzione, si possono semplicemente sostituire l’immagine e il testo esistenti con i propri.

Per sostituire l’immagine predefinita, è sufficiente fare clic per selezionare l’immagine. Una volta fatto ciò, fare clic sul pulsante “Sostituisci”.

Se si desidera utilizzare un’immagine già presente nella libreria multimediale di WordPress, è sufficiente fare clic su “Apri libreria multimediale”. È possibile scegliere un’immagine esistente.

Se si desidera caricare una nuova immagine, fare clic su “Carica”.

Si apre una finestra in cui è possibile scegliere qualsiasi file dal computer.

Dopo aver scelto un’immagine, è possibile utilizzare le impostazioni del blocco per creare effetti interessanti e accattivanti. Ad esempio, si può fare in modo che l’immagine rimanga fissa mentre il visitatore scorre la pagina o aggiungere una sovrapposizione di colori all’immagine.

Se si utilizza un overlay, è possibile modificarne l’opacità utilizzando il cursore ‘Opacità’. L’impostazione dell’opacità controlla la trasparenza dell’immagine di sfondo.

Quando si è soddisfatti dell’aspetto dell’immagine, si è pronti ad aggiungere del testo.

Per impostazione predefinita, il blocco Copertina ha un’intestazione e un blocco Paragrafo in cui è possibile aggiungere del testo sopra l’immagine.

Per aggiungere del testo, è sufficiente fare clic per selezionare il blocco Intestazione o Paragrafo. Quindi, digitare il testo che si desidera utilizzare.

Quando si aggiunge del testo a un’immagine, questo può risultare difficile da leggere. Questo è particolarmente vero per i visitatori con problemi di vista. Per saperne di più, consultate la nostra guida su come migliorare l’accessibilità del vostro sito WordPress.

Detto questo, è possibile che si voglia dare uno stile al testo in modo che sia più facile da leggere.

Se si lavora con un blocco di intestazione, si possono anche provare i diversi stili di intestazione per vedere quale sia il più facile da leggere.

È inoltre possibile far risaltare il testo utilizzando un colore contrastante.

Per scegliere un colore diverso, selezionare la scheda “Blocco” nel menu di destra. Quindi, fare clic su “Colore” per espandere questa sezione.

Una volta fatto ciò, fare clic su “Testo”. Si apre una finestra a comparsa in cui è possibile scegliere un nuovo colore per tutto il testo del blocco.

In genere, un testo più grande è più facile da leggere.

Per ingrandire il testo, fare clic sul campo accanto a “Dimensione” e digitare un numero più grande in questo campo.

Una volta soddisfatti dell’aspetto del blocco di copertina, è possibile pubblicare o aggiornare la pagina come di consueto. Ora, se visitate il vostro sito WordPress, vedrete il vostro testo sopra l’immagine.

Metodo 2: Aggiungere testo sopra un’immagine utilizzando il blocco immagine

Il blocco Cover è ottimo per creare banner e intestazioni. Tuttavia, è anche possibile aggiungere del testo sopra un blocco immagine standard di WordPress.

Per iniziare, è necessario aggiungere un blocco immagine alla pagina o al post. Per farlo, è sufficiente fare clic sul pulsante “+ Aggiungi blocco” nell’editor dei blocchi di WordPress.

È quindi possibile digitare “Immagine” e selezionare il blocco giusto per aggiungerlo al post.

È possibile caricare un’immagine dal computer o cliccare su “Libreria dei media” per scegliere un’immagine dalla libreria dei media di WordPress.

Dopo aver scelto l’immagine, è possibile modificarne il punto focale, aggiungere una sovrapposizione e cambiare l’opacità seguendo lo stesso procedimento descritto sopra.

Si possono anche provare i diversi cursori “Sfondo fisso” e “Sfondo ripetuto” per vedere cosa funziona meglio per il blocco immagine.

Quando si è soddisfatti dell’aspetto dell’immagine, è sufficiente fare clic sul pulsante “Aggiungi testo all’immagine”.

Questo aggiunge un’area in cui è possibile digitare il testo.

A seconda dell’immagine, i visitatori potrebbero avere difficoltà a leggere il testo in sovrimpressione. In questo caso, può essere utile rendere il testo in grassetto o cambiarne il colore seguendo lo stesso procedimento descritto sopra.

È anche possibile ingrandire il testo.

A tale scopo, nel menu di destra si trova la sezione “Dimensioni”. È quindi possibile fare clic sui diversi numeri per ingrandire o rimpicciolire il testo.

Quando si è soddisfatti dell’aspetto del testo e dell’immagine, si può visualizzare l ‘anteprima del sito. Quindi, fare clic su “Salva bozza”, “Aggiorna” o “Pubblica” per salvare le modifiche.

Se utilizzate un tema WordPress a blocchi, potete utilizzare i metodi 1 e 2 per aggiungere del testo sopra un’immagine in qualsiasi parte del tema utilizzando l’Editor completo del sito (FSE) di WordPress.

Per saperne di più su FSE, consultate la nostra guida completa per principianti alla modifica completa del sito WordPress.

Metodo 3: creare un layout di pagina personalizzato con testo sopra un’immagine

I blocchi integrati di WordPress sono un modo semplice e veloce per aggiungere testo sopra un’immagine in WordPress. Tuttavia, se si desidera la libertà di creare pagine completamente personalizzate, è necessario un plugin per la creazione di pagine.

SeedProd è il miglior plugin per il page builder di WordPress sul mercato. Permette di aggiungere testo sopra qualsiasi immagine in tutto il sito web.

Per maggiori dettagli, potete leggere la nostra recensione completa di SeedProd.

Per prima cosa, è necessario installare e attivare il plugin SeedProd. Per maggiori dettagli, consultate la nostra guida passo-passo su come installare un plugin di WordPress.

Al momento dell’attivazione, è necessario inserire la chiave di licenza SeedProd. È possibile ottenere questa chiave accedendo al proprio account SeedProd. Quindi, fare clic sulla scheda “Download”.

Una volta fatto ciò, è possibile copiare la chiave nella sezione “Chiave di licenza”.

A questo punto è possibile incollare questa chiave nell’area di amministrazione di WordPress, andando alla pagina SeedProd ” Impostazioni.

Una volta qui, incollate la vostra chiave nel campo “Chiave di licenza”.

A questo punto è sufficiente fare clic su “Verifica chiave”.

Dopodiché, andiamo su SeedProd “ Pagine di destinazione e facciamo clic su “Aggiungi una nuova pagina di destinazione”.

Il compito successivo è quello di scegliere un modello, che sarà il punto di partenza della vostra pagina. Indipendentemente dal modello SeedProd scelto, è possibile personalizzare ogni parte del modello per adattarlo perfettamente al proprio sito web e al proprio marchio.

Se si preferisce iniziare con una tela vuota, è possibile fare clic su “Modello vuoto”.

In tutte le nostre immagini, utilizziamo il modello Tasty Squeeze Page, che è perfetto per ottenere più campagne di abbonamenti.

Una volta trovato un modello che si desidera utilizzare, passarci sopra il mouse. È quindi possibile fare clic sull’icona “Anteprima”.

Viene visualizzata un’anteprima del modello.

Se l’aspetto di questo modello vi soddisfa, fate clic sul pulsante “Scegli questo modello”.

Nel campo “Nome della pagina”, digitare un nome per la pagina.

Per impostazione predefinita, SeedProd utilizzerà questo nome come URL della pagina. Se si desidera modificare questo URL creato automaticamente, è sufficiente modificare il testo nel campo “URL della pagina”.

Quando si è soddisfatti delle informazioni inserite, fare clic sul pulsante “Salva e inizia a modificare la pagina”. Questo aprirà il modello nell’editor drag-and-drop di SeedProd.

Nella barra laterale di sinistra sono visibili tutti i blocchi e le sezioni che si possono aggiungere alla pagina mediante trascinamento.

A meno che non si stia utilizzando il modello vuoto, la pagina SeedProd avrà già alcuni blocchi e sezioni. Per modificare uno qualsiasi di questi contenuti, è sufficiente fare clic per selezionare il blocco o la sezione.

Il menu di sinistra di SeedProd mostrerà ora tutte le impostazioni che si possono utilizzare per personalizzare questo blocco o sezione. Come si può vedere nell’immagine seguente, se si fa clic su un blocco Titolo, è possibile modificare il testo visualizzato in questo blocco.

Il modo più semplice per aggiungere del testo sopra un’immagine è utilizzare una delle sezioni Hero già pronte di SeedProd.

Queste sezioni hanno un’immagine di sfondo a tutta larghezza, con un testo segnaposto aggiunto in cima. È possibile sostituire l’immagine di sfondo e il testo predefiniti con i propri contenuti.

Per iniziare, fare clic sulla scheda “Sezioni” nel menu di sinistra di SeedProd.

Si può quindi fare clic su “Eroe” per vedere tutte le sezioni eroe già pronte che si possono aggiungere alla pagina.

Per visualizzare l’anteprima di uno qualsiasi di questi modelli di sezione, è sufficiente passare il mouse sul modello e fare clic sull’icona della lente di ingrandimento.

Per aggiungere questa sezione eroe al vostro progetto, fate clic su “Scegli questa sezione”.

Successivamente, si dovrà sostituire l’immagine stock del modello con una propria immagine. Per farlo, basta fare clic sull’immagine stock per selezionarla.

Quindi, nel menu di sinistra di SeedProd, passate il mouse sull’anteprima “Immagine di sfondo” finché non appare l’icona del cestino.

È quindi possibile fare clic su questa icona per eliminare l’immagine segnaposto.

Quindi, fate clic su “Usa la tua immagine”. È possibile scegliere un’immagine dalla libreria multimediale di WordPress o utilizzare un’immagine stock.

SeedProd consente di accedere facilmente a migliaia di immagini stock royalty-free. Per dare un’occhiata alla libreria di immagini stock di SeedProd, cliccate su “Usa un’immagine stock”.

Nella barra di ricerca, digitate una parola o una frase che descriva l’immagine che state cercando e fate clic sul pulsante “Cerca”.

SeedProd mostrerà ora tutte le immagini stock che corrispondono al termine di ricerca.

Quando si trova un’immagine che si desidera aggiungere al proprio progetto, è sufficiente fare clic su di essa.

Una volta aggiunta un’immagine, si è pronti a sostituire il testo segnaposto.

A tale scopo, fare clic per selezionare il blocco Testo. Quindi, nell’area ‘Testo’, è sufficiente digitare il testo che si desidera utilizzare.

Alcuni dei modelli hero di SeedProd presentano contenuti extra, come i pulsanti di invito all’azione.

Volete modificare questo contenuto? Allora è sufficiente fare clic per selezionare il blocco e apportare le modifiche nel menu di sinistra di SeedProd.

Un’altra opzione è quella di eliminare il blocco dal modello dell’eroe.

Per farlo, è sufficiente fare clic per selezionare il blocco e poi fare clic sull’icona del cestino.

Quando si è soddisfatti del design della pagina, si può fare clic sul pulsante “Salva”.

Da qui si può scegliere di pubblicare la pagina o di salvarla come modello.

Per maggiori dettagli sulla creazione di layout di pagina personalizzati con SeedProd, potete consultare la nostra guida su come creare una landing page in WordPress.

Suggerimenti bonus per gestire immagini e file in WordPress

L’aggiunta di testo alle immagini è solo un modo per migliorare l’aspetto del sito. Volete fare di più con le vostre immagini? Selezionate queste semplici guide:

• Come caricare imagely le immagini su WordPress
• Come aggiungere gallerie multiple nei post e nelle pagine di WordPress
• Come aggiungere correttamente un cursore di contenuto in primo piano in WordPress
• Come aggiungere un bordo intorno a un’immagine in WordPress
• Come ritagliare e modificare le immagini in evidenza dei post di WordPress
• Come aggiungere facilmente immagini interattive a 360 gradi in WordPress

Speriamo che questo articolo vi abbia aiutato a imparare come add-on di un’immagine in WordPress. Potreste anche consultare la nostra guida su come modificare di massa le immagini in evidenza e le nostre scelte di esperti sui migliori plugin per slider di WordPress.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.