Vai al contenuto principale

Editor drag & drop (Classico) - Parte 4: Elementi del layout (titolo, testo, immagine, pulsante e spazio)

Gli elementi del layout sono singoli elementi che puoi aggiungere alla tua newsletter. Se preferisci, puoi anche utilizzare elementi più complessi che raggruppano immagini, titolo, testo e pulsante in elementi di contenuto. In questo articolo ti spiegheremo come aggiungere gli elementi di progettazione (titolo, testo, immagine, pulsante e spazio) alla tua newsletter e come modificarne le impostazioni. 

In questo articolo vedremo i seguenti elementi:

Titolo e Testo

Con gli elementi Titolo e Testo, puoi aggiungere facilmente informazioni scritte alle tue campagne email e successivamente applicare una varietà di stili e impostazioni dei font. 

Title_and_Text.gif

Formattazione di titoli e testo con la barra degli strumenti

Puoi modificare la formattazione del testo (grassetto, corsivo, sottolineato, barrato, ecc.) cliccando sul testo e utilizzando la barra degli strumenti di formattazione:

Toolbox2.png

Il video è in inglese, ma puoi attivare i sottotitoli automatici nella tua lingua.

Modifica delle impostazioni dell'elemento

Le impostazioni degli elementi sono diverse da un elemento all'altro. Puoi accedervi cliccando sull'elemento (Titolo o Testo in questo caso). Sulla destra appariranno le impostazioni dell'elemento e potrai modificare le opzioni seguenti:

Element_settings.png
  1. Famiglia di font
  2. Allineamento del titolo (per il testo, l'allineamento può essere modificato dalla barra degli strumenti di formattazione)
  3. Colore dei link
  4. Se i link sono sottolineati o no

💡 Buono a sapersi: Se vuoi aggiungere un tuo font, consulta il nostro articolo Come importare font nell’editor di newsletter responsivo.

Aggiunta di un link al testo

Aggiungere link al testo non potrebbe essere più facile! Utilizza la barra degli strumenti di formattazione con un elemento di testo per trasformare qualsiasi parte di testo della tua campagna email in un link.

  1. Aggiungi l'elemento Testo o Titolo al tuo layout.
  2. Sostituisci il testo Lorem ipsum con il tuo testo.
  3. Seleziona il testo a cui vuoi aggiungere un link.
  4. Clicca sull'icona Link nella barra degli strumenti di formattazione.
  5. Per Tipo di link lascia l'impostazione URL e inserisci l'URL nel campo.
  6. Clicca su OK.

add_a_link_EN.png

Nella scheda Destinazione puoi scegliere la destinazione del link (nuova finestra, stessa finestra, ecc.).

Per rimuovere il link, seleziona il testo e clicca sull'icona Scollega a destra dell'icona Link.

Aggiunta di un link mailto

Così come si aggiunge un link, è possibile aggiungere un link mailto nelle proprie e-mail se si desidera ricevere risposte quando gli iscritti cliccano sul link. 

  1. Aggiungi l'elemento Testo o Titolo al tuo layout.
  2. Sostituisci il testo Lorem Ipsum con il tuo testo.
  3. Seleziona l'indirizzo email a cui vuoi aggiungere un link.
  4. Scegli Email come Tipo di link.
  5. Inserire l'indirizzo email (campo obbligatorio) e l'oggetto e il corpo del messaggio (campi facoltativi).
    Compila i campi Oggetto del messaggio e Corpo del messaggio se vuoi che la riga dell'oggetto e il corpo dell'email vengano compilati automaticamente quando qualcuno clicca sul link per inviare un'email.
  6. Clicca su OK.

add_mailto_EN.png

 

Buono a sapersi
Per aggiungere un link mailto su un pulsante, inserire mailto:contatto@miaazienda.com nel campo Link delle opzioni del pulsante.

Aggiunta di un colore di sfondo o di un'immagine di sfondo

Se vuoi aggiungere un colore o un'immagine di sfondo agli elementi del titolo/testo, devi andare alle opzioni del blocco facendo clic sull'icona della penna. Per informazioni sull'intera procedura, consulta la sezione Colore o immagine di sfondo dell'articolo Editor drag & drop (Classico): Opzioni dei blocchi e opzioni degli elementi.

Immagine

Sendinblue ti consente di caricare, aggiungere e modificare rapidamente le immagini nella tua campagna email. Questo è un modo perfetto per personalizzare il design delle tue email e renderlo più coinvolgente.

Puoi aggiungere immagini in due modi diversi alle tue email:

Descriveremo questi due metodi nelle sezioni che seguono. Il video è in inglese, ma puoi attivare i sottotitoli automatici nella tua lingua.

Aggiunta di un'immagine tramite la galleria di immagini

  1. Trascina e rilascia l'elemento Immagine nella tua email.
  2. Clicca sull'immagine.
    Nel menu a sinistra compare la galleria di immagini.
  3. Per aggiungere un'immagine proveniente dalla galleria di immagini:
    • Clicca su + Aggiungi immagine in alto a destra
    • Oppure trascina e rilascia un'immagine dal menu nell'email
  4. Al termine del caricamento, trascina e rilascia l'immagine nell'elemento Immagine.

Add_image_from_gallery.gif

💡 Buono a sapersi: Per recuperare l'URL assoluto della tua immagine, vai alla galleria di immagini nel menu a sinistra, clicca con il pulsante destro del mouse sull'immagine e copia l'indirizzo/URL o l'immagine.

Aggiunta di un'immagine tramite un URL

  1. Trascina e rilascia l'elemento Immagine nella tua email.
  2. Clicca sull'immagine.
    Sulla destra compaiono le impostazioni dell'immagine.
  3. In basso, per Origine dell'immagine, selezionare URL.
  4. Incollare l'URL dell'immagine nel campo.

L'immagine non verrà visualizzata nell'editor, ma potrai vederne l'anteprima quando invierai un'email di prova.

Add_image_from_URL.gif

Modifica delle impostazioni dell'immagine

Nel menu a sinistra, avrai accesso a diverse impostazioni per la tua immagine. Clicca sull'immagine per accedere a questo pannello:

param_image_FR.png
  1. Link immagine: se vuoi che l'immagine sia cliccabile, puoi aggiungere un link in questo campo
  2. Testo alternativo: questo testo apparirà al posto dell'immagine quando la visualizzazione è disabilitata dall'utente o per impostazione predefinita dall'interfaccia di consultazione email
  3. Bordo: aggiungi un bordo all'immagine e scegli il colore e lo spessore
  4. Raggio del bordo dell'immagine: Questa impostazione consente di "arrotondare gli angoli" di qualsiasi elemento
  5. Allineamento dell'immagine: allinea l'immagine a destra, al centro o a sinistra
  6. Origine dell'immagine
    • Galleria: l'immagine viene scelta dalla galleria a sinistra
    • URL: in questo caso, andrà inserito l'URL dell'immagine

Image_element_settings.gif

Editor fotografico

Il nostro editor drag & drop comprende un editor fotografico che permette di ritagliare un'immagine, aggiungere filtri, testo o elementi di layout. Per accedere all'editor fotografico, clicca sull'immagine e quindi sul pulsante Modifica nell'angolo superiore sinistro dell'immagine.

photo_editor.png

Come ridimensionare un'immagine?

  1. Clicca su Modifica nell'angolo superiore sinistro dell'immagine.
  2. Vai a Trasforma nell'angolo superiore sinistro dell'editor fotografico.
  3. Seleziona Personalizza.
  4. Seleziona la casella accanto a Mantieni risoluzione.
  5. Modifica larghezza o altezza dell'immagine, l'altra dimensione verrà adattata automaticamente per mantenere lo stesso rapporto.
  6. Clicca su Salva.
  7. L'immagine ridimensionata viene aggiunta alla galleria e puoi trascinarla e rilasciarla nell'elemento immagine.

how_to_resize_an_image_gif_2.gif

Pulsante

Puoi utilizzare il nostro elemento Pulsante per creare un link a un sito web o per scaricare un file. Aggiungere pulsanti alle campagne email è un ottimo modo per evidenziare link specifici su cui desideri che gli utenti facciano clic. 

Button_settings.png
  1. Link: inserisci qui l'URL. Per aggiungere un link mailto, inserisci mailto:contatto@miaazienda.com
  2. Famiglia di font: font del testo del pulsante
  3. Colore del pulsante: scegli il colore del pulsante
  4. Colore del testo nel pulsante: scegli il colore del testo del pulsante
  5. Altezza del pulsante: cambia l'altezza del pulsante
  6. Dimensioni del font del pulsante: cambia le dimensioni del testo del pulsante
  7. Raggio del pulsante: aggiunge angoli arrotondati ai pulsanti.
  8. Allineamento del pulsante: scegli l'allineamento del pulsante (sinistra, centro, destra)
  9. Bordo: aggiungi un bordo all'immagine e scegli il colore e lo spessore

Button.gif

Il video è in inglese, ma puoi attivare i sottotitoli automatici nella tua lingua.

Spazio

L'inserimento degli spazi giusti fra gli elementi del layout renderà la tua campagna più piacevole da leggere. L'elemento Spazio assumerà automaticamente lo stesso colore del colore di sfondo della pagina, puoi solo modificare l'altezza dell'elemento. 

Puoi anche gestire tutta la spaziatura direttamente all'interno degli elementi (testo, pulsante, immagine, ecc.) tramite le opzioni del blocco cliccando sull'icona della penna nell'angolo superiore destro dell'elemento. Per ulteriori informazioni sulla spaziatura, consulta il nostro articolo Editor drag & drop (Classico): Opzioni dei blocchi e opzioni degli elementi.

⏭️ E adesso?

🤔 Domande?

In caso di domande, non esitare a contattare il team dell’assistenza creando un ticket dal tuo account. Se ancora non hai un account, puoi contattarcihere.