Landing Page

Costruzione della pagina

Crea landing page coinvolgenti, ottimizzate sia per mobile che per desktop. Grazie all’editor “trascina e rilascia” la tua pagina sarà pronta in pochi minuti, senza la necessità di possedere competenze di sviluppo.

In questa guida troverai tutte le indicazioni utili per creare pagine accattivanti, efficaci e con un elevato tasso di conversione. Partiamo da alcuni punti basilari per procedere poi agli step più avanzati:

1. Aggiunta della nuova landing page

Per creare le proprie pagine di atterraggio è sufficiente entrare nella propria area riservata e cliccare sul tasto “Landing Page” del menù a sinistra. Qui sono riepilogate le eventuali pagine già create con la possibilità di visualizzarne le statistiche o modificarle.

Attraverso il pulsante “Nuova Pagina” è invece possibile creare una nuova landing page.

Consiglio: se utilizzi il piano Starter attiva il periodo di prova dell’account Premium! In questo modo avrai più landing pubblicabili contemporaneamente, URL personalizzabile , pagina white label, coupon digitali e lead magnet.

2. Scelta dei template

Per la creazione di una nuova landing page è necessario selezionare inizialmente uno dei template proposti nella pagina. Si può scegliere se usare i modelli “Crea da zero” (pensati per chi vuole editare completamente la pagina) oppure se sfruttare i template pronti all’uso, utili per chi vuole comporre una pagina con elevati tassi di conversione in pochi minuti. Ciascuna categoria risponde a specifici obiettivi di comunicazione, ovvero:

  • Registrazione e prenotazione
  • Promozione e sconti
  • Vendite
  • Donazioni
  • Download
  • Presentazione azienda, prodotto e servizi
  • Video
  • Pagine di ringraziamento
  • Ricorrenze

Una volta selezionato il template, scegli un nome per la pagina e sarai reindirizzato nell’area di lavoro.

3. Introduzione all’editor

Nella colonna di destra sono immediatamente configurabili le impostazioni generali della pagina, ovvero colore di sfondo, font ed altre impostazioni avanzate:

  • Informativa privacy – se nella pagina inserisci un form di raccolta contatti è obbligatorio inserire un’informativa privacy sul trattamento dei dati personali.
  • Script di analytics – es. Google Analytics, Pixel di Facebook, Kissmetric, per monitorare le visite della pagina con altri tool esterni
  • Tag open graph, che consentono di ottimizzare la condivisione della pagina sui social.

Inoltre, ciascun elemento della pagina può essere modificato: selezionando la riga corrispondente, nella sezione di destra è possibile configurare sfondo, immagini o bottoni.

Ogni riga può essere eliminata, spostata o duplicata utilizzando i tasti presenti in alto a destra di ogni sezione. È possibile inoltre aggiungere nuove righe, attraverso il pulsante “aggiungi riga” posto in basso.

Selezionando l’inserimento di una nuova riga, viene proposta la selezione dei vari tipi di contenuti da inserire. Ti invitiamo a proseguire la lettura delle guide per comprendere tutte le potenzialità delle landing page, buona lettura!

Creare una riga singola o con più colonne

L’editor landing page di LeadPower ti consente di creare delle pagine di atterraggio ottimizzate sia per mobile che per desktop. Proprio per questo motivo, abbiamo voluto dare la possibilità all’utente di suddividere le righe in più colonne: in tal modo la versione desktop è più accattivante perché si possono posizionare più elementi sulla stessa riga.

Per configurare la riga con una colonna, clicca su “aggiungi riga” in fondo alla pagina dell’editor e seleziona “colonna singola”: otterrai una riga costituita da immagine, testo e bottone call to action. A seconda di come vuoi strutturare i contenuti, nella colonna di destra puoi decidere se visualizzare l’immagine e il bottone (oppure non mostrarli) e stabilire la posizione rispetto al testo, caricare un’immagine oppure personalizzare con colori e link il bottone.

Per suddividere la riga in due o tre colonne, invece, clicca su “aggiungi riga” e seleziona l’apposita opzione, in modo da poter configurare due o tre articoli sulla stessa riga.

Consiglio: per ciascuna riga puoi scegliere il layout dello sfondo, impostandolo sul contenuto o su tutto lo schermo. In genere, la versione “tutto schermo” è pensata per landing page che vengono condivise sia su mobile che desktop e tablet. È possibile inoltre scegliere il colore dello sfondo o caricare un’immagine di sfondo ed impostarne le dimensioni. Per fare in modo che l’immagine si adatti a qualsiasi dispositivo (soprattutto a schermi grandi) si preferisca l’opzione “scala per riempire spazio se necessario”.

Editor di testo

Per inserire un blocco di testo nella tua landing page clicca su “aggiungi riga” e seleziona “testo”. Cliccando su questa icona, verrà aggiunta una nuova sezione alla Landing Page con un titolo e un testo popolati automaticamente.

Sulla destra vengono visualizzate le impostazioni di base della riga, tra cui il layout della riga (sul contenuto o tutto schermo), il colore di sfondo (o immagine di sfondo) e i margini superiori e inferiori, per aggiungere degli spazi tra una riga e l’altra.

Per modificare il titolo e il testo, clicca sopra il testo presente nella landing page. Apparirà un riquadro di selezione del testo e un pannello contenente gli strumenti di formattazione.

Piccola precisazione: il font usato automaticamente sarà quello che hai scelto nelle impostazioni generali della pagina. Se vuoi modificarlo clicca in alto a destra su “impostazioni generali pagina” e “font pagina”.

Se invece sei soddisfatto del font che hai scelto, ma vuoi cambiarlo solamente ad una frase(che potrebbe essere un titolo ad esempio) puoi farlo semplicemente selezionando il testo e cercando il font desiderato.

Inserire un’immagine singola

Per inserire un’immagine singola, clicca su “aggiungi riga” e seleziona l’icona “immagine”, che ti permette di aggiungere un’immagine alla pagina e personalizzarla a piacere.

Una volta creata la riga “immagine”, nella colonna di destra puoi caricare l’immagine desiderata, cliccando su “impostazioni immagine” e “carica un nuovo file”.

Come per le altre righe, puoi decidere se impostare il layout sul contenuto o su tutto lo schermo e sbizzarrirti sullo sfondo stesso della riga, che può essere un colore oppure un’immagine.

Per esempio, per creare l’effetto dell’immagine qui sotto, è stata inserita una riga “immagine”. Su “impostazioni immagine” è stato caricato il logo con sfondo trasparente (quindi in formato .png), mentre su impostazioni riga è stato scelto il layout “tutto schermo” ed è stata caricata una foto come sfondo, con impostazione “scala per riempire spazio se necessario”. Ti piace l’effetto? Prova ad ottenerlo, è accattivante come intestazione della pagina!

Creare una gallery di foto o immagini

Nella landing page è possibile inserire una galleria di immagini, utile nel caso in cui si voglia mostrare un prodotto da angolazioni diverse, oppure quando abbiamo tante immagini e inserirle una sotto l’altra occuperebbe troppo spazio, o ancora quando vogliamo ricreare l’effetto “sfoglia catalogo”.

Il procedimento è molto semplice: clicca su “aggiungi riga” e poi su “Gallery”.

Una volta inserito il nuovo componente, sulla destra, oltre alle impostazioni di base della riga, sarà presente una sezione “impostazioni galleria”.

Quì è possibile impostare la tipologia della galleria (Galleria formato 16/9, Galleria Fullscreen oppure Storytelling) e procedere al caricamento delle immagini.

Nella parte bassa compariranno, in base alla tipologia scelta, delle note su cui basarsi per avere una resa ottimale.

Una volta inserite le immagini desiderate sarà possibile testare l’animazione o lo slideshow direttamente dalla schermata in cui si sta creando la landing page.

Inserire un video da Youtube

Aumenta l’efficacia delle tue landing page inserendo contenuti video direttamente da Youtube. Farlo è davvero semplicissimo.

Parti dall’editor e clicca su “aggiungi riga” in basso e poi su “video Youtube”.

Nella colonna di destra inserisci l’URL del video desiderato e volendo, modifica le impostazioni di base della riga (decidendo se usare il layout “sul contenuto” o “tutto schermo” e impostando un colore o immagine di sfondo).

Come vedi, in pochi click la tua landing page è integrata con Youtube!

Integrare vendita con Paypal

Tramite il componente “Offerta”, è possibile vendere direttamente un prodotto dalla Landing page, senza doversi affidare a un sito e-commerce.

In particolare è possibile inserire:

  • Nome del prodotto
  • Prezzo originale
  • Prezzo scontato
  • Email account PayPal (inserire l’email dell’account Paypal sul quale si desidera ricevere il denaro)
  • Immagine descrittiva del prodotto
  • Link opzionale (per reindirizzare il cliente al click sull’immagine)

Tutte queste operazioni sono attuabili nella sezione “Impostazioni Offerta”, presente sulla destra. Ad ogni cambiamento l’anteprima della landing si aggiornerà automaticamente.

Ricevere donazioni

Questo elemento permette la creazione di un tasto “Dona Ora”, a cui può essere collegato un account PayPal.

E’ possibile collegare l’account associato nella sezione “Impostazioni Offerta” presente sulla destra.

Questa funzione è molto utile nel caso in cui si voglia raccogliere denaro senza scopo di lucro: tramite un semplice tasto gli utenti possono donare immediatamente, versando direttamente la somma sull’account Paypal da te configurato.

Inserire contatti con bottoni call to action

Nella landing page è possibile inserire i contatti con bottoni call to action, utili per aiutare l’utente a contattarti con facilità.

Per esempio, il tasto chiama usato da smartphone consente di chiamare direttamente senza dover uscire dalla landing page.

Per impostare i bottoni contatti è sufficiente cliccare su “aggiungi riga” e poi sull’ icona “contatti”.

In particolare, è possibile inserire i seguenti collegamenti:

  • Numero di telefono (azione: chiama)
  • Coordinate GPS (azione: aprire la mappa)
  • Sito Web (azione: apre il sito)
  • Email (azione: apre una pagina con nuova mail indirizzata a questo indirizzo)
  • Sms (azione: apre pagina per l’invio dell’SMS)

Nella landing finale verranno visualizzati solo i call2action correttamente impostati.

Per modificarli, fare riferimento alla colonna a destra, dove è presente la sezione “Call2Action”.

Countdown per offerte lampo

Inserire il countdown è una strategia per invogliare gli utenti ad acquistare, perché trasmette un senso di urgenza (ti mostro quanto manca alla scadenza dell’offerta). Oppure può essere utilizzato in vista di un evento, per sottolinearne l’importanza.

Ma come fare ad inserirlo nelle tue landing page?

Clicca su “aggiungi riga” e seleziona “countdown”.

A questo punto puoi personalizzare il colore del font e dell’eventuale bordo, decidere se mostrare il bordo arrotondato o meno ed, ovviamente, impostare la data di scadenza.

Inoltre, come per tutte le altre righe, c’è la possibilità di caricare un’immagine nello sfondo del countdown. Per farlo andare su “impostazioni riga” e scegli un’immagine di sfondo.

Inserire Google Maps

Nelle landing page è possibile inserire la mappa di Google, in maniera semplice ed automatica.

Per farlo clicca su “aggiungi riga” e seleziona “Google maps”.

Sulla colonna di destra ti verrà chiesto di inserire la posizione, specificando:

  • Titolo punto sulla mappa (è opzionale e ti permette di “nominare il punto sulla mappa es. Nome negozio)

  • Coordinate punto sulla mappa (cliccando sull’apposito posizionatore si aprirà un popup in cui ti verrà richiesto di inserire via e numero civico della tua posizione)

Inserire un Codice a Barre

Nella landing page è possibile inserire un codice a barre, utile nel caso si voglia inserire un dato scansionabile da smartphone o da barcode scanner. Possono essere aggiunti dei codici fissi (nel formato Code 128 e EAN13) oppure un codice legato ad un campo personalizzato del tipo “Codice a Barre”.

Il procedimento è molto semplice: clicca su “aggiungi riga” e poi su “Codice”.

Una volta inserito il nuovo componente, sulla destra, oltre alle impostazioni di base della riga, sarà presente una sezione “impostazioni Barcode”.

Quì è possibile inserire un codice fisso, scegliendo tra le tipologie di codice a barre disponibili (QR Code, Code128 oppure EAN13) oppure un campo personalizzato della rubrica da collegare.

Se si sceglie un campo personalizzato della rubrica del tipo Barcode, la Landing Page deve essere condivisa tramite SMS o Email, per fare in modo che venga creata l’associazione con il contatto. Nel caso l’associazione non sia disponibile verrà visualizzato il messaggio “Codice a Barre non disponibile”.

Inserire un widget per le prenotazioni

Nella landing page è possibile inserire un widget per le prenotazioni, per permettere ai clienti di prenotarsi ai tuoi servizi in modo semplice e veloce.

Per maggiori informazioni sulla creazione di un calendario per le prenotazioni, consulta la guida dedicata.

Il procedimento è molto semplice: clicca su “aggiungi riga” e poi su “Prenotazioni”.

Una volta inserito il nuovo componente, sulla destra, oltre alle impostazioni di base della riga, sarà presente una sezione “impostazioni Form”, nella quale sarà possibile selezionare un calendario esistente oppure procedere alla creazione di uno nuovo.

Cliccando su “Modifica calendario selezionato” si verrà reindirizzati nella sezione relativa alla funzione Prenotazioni.

Impostazioni del footer

Quando crei una nuova landing page, ti accorgerai che il footer è già inserito: quello che puoi fare è cancellarlo oppure personalizzarlo con le informazioni riguardanti la tua azienda. Vediamo come.

Per eliminare del tutto il footer, ti basterà aprire le “impostazioni” nella colonna di destra (cliccando sulla riga del footer) e dalla prima voce “mostra footer” (menù a tendina) scegliere “no”.

Se invece vuoi personalizzare il footer con informazioni inerenti la tua azienda, clicca sull’apposita riga e, nella colonna di destra, inserisci i link dei vari social network.

Nota: lascia vuoto il campo per non inserire il bottone nella pagina.

Per personalizzare la scritta sotto i button ti basterà cliccarci sopra ed editarla.

Piccola precisazione: se utilizzi un piano Starter, una volta pubblicata la pagina, sotto il footer apparirà la scritta “Tecnologia di LeadPower”. Invece, se hai un profilo Premium la tua pagina sarà completamente white label.

Inserire il form

L’inserimento di un form nella landing page ti consente di raccogliere con facilità nuovi lead oppure integrare i contatti esistenti chiedendo loro ulteriori dati ed informazioni (come data di nascita, preferenze, interessi, propensioni all’acquisto).

Per includere all’interno della tua landing page un form di raccolta contatti, il primo step è quello di aggiungere una riga e selezionare “Form raccolta contatti”:

A questo punto ti apparirà la riga riservata al form. Nella colonna a destra potrai scegliere quale form vuoi utilizzare, potrai decidere se inserire un form già creato in precedenza (nella sezione Form raccolta contatti) oppure crearne uno nuovo premendo sul bottone “nuovo form”.

Premendo il bottone per la creazione di un nuovo form ti apparirà in primo piano la finestra di configurazione sulla quale andrai a lavorare. Ecco le guide di riferimento per tutti e 6 gli step:

Sfondo del form e scelta del font

Il font utilizzato nel form è il font da te scelto nelle impostazioni generali della pagina.

Per configurarlo clicca su “impostazioni pagina” in alto a destra dell’editor, seleziona la voce “font pagina” e scegli il font che preferisci.

Impostare un’immagine di sfondo al form nella landing

Vuoi realizzare form accattivanti? L’idea di inserire un’immagine di sfondo è una valida soluzione.

Per farlo, dall’editor landing page seleziona la riga del form e clicca su “impostazioni riga”. Qui ti consigliamo di selezionare “tutto schermo” nella voce layout sfondo, per avere un effetto ottimale anche da desktop.

Per inserire un’immagine come sfondo clicca semplicemente su “carica un nuovo file” (ti consigliamo un’immagine di larghezza 1500 px) e seleziona il file dal tuo PC oppure scegliendo tra gli ultimi caricati. Puoi anche impostare il margine superiore o inferiore del form.

Consiglio: ti consigliamo di impostare “scala per riempire spazio se necessario” nella parte dimensione dell’immagine di sfondo, in modo che si adatti a qualsiasi grandezza di schermo.

Scegliere la posizione del form

Per scegliere la posizione del form all’interno della riga, seleziona la riga stessa e nella colonna di destra, alla voce “Impostazioni App Lead” seleziona dal menù a tendina la posizione desiderata.

Puoi scegliere tra:

Centrato (senza testo ai lati)

Destra con testo a sinistra:

O sinistra con testo a destra:

Condividere via web, SMS e QR code

Una volta realizzata la landing page puoi visualizzarne l’anteprima cliccando in alto a destra e scegliendo tra anteprima mobile o desktop:

Se sei soddisfatto del risultato, per condividere la tua pagina non ti resta che pubblicarla, cliccando in alto a destra sul tasto arancione “pagina non pubblicata” e selezionando “pubblica”:

A questo punto sei pronto per condividere la pagina dove vuoi tu:

  • Per condividerla sul web (social network, all’interno del sito web, email, Google Ads) utilizza l’URL pubblico della pagina, che si trova in alto a destra (per personalizzare l’URL visita la guida)
  • Per condividere la landing sul cartaceo, usa il QR code (stampalo all’interno del volantino o banner e chi vuole potrà visitare la pagina inquadrando semplicemente il QR code con il proprio smartphone
  • Per condividere la landing all’interno dei tuoi SMS, vai nella sezione “Invio SMS” e nella fase di stesura del testo dell’SMS inserisci la landing page.

 

Ottimizzare la condivisione sui social

Una volta pubblicata la landing page, è possibile diffonderla sul web tramite l’URL specifico della pagina.

Per gestire al meglio la condivisione, anche sui social, c’è la possibilità di configurare i tag open graph, ovvero quei metatag che consentono di inserire i parametri che andranno a comporre titolo, descrizione ed immagine del link condiviso.

Come fare in modo che automaticamente condividendo il link della landing sui social appaiano immagine, titolo e sottotitolo che voglio io?

Nelle “impostazioni generali pagina” scegli “tag open graph”dalle impostazioni avanzate:

E compila i seguenti campi nella finestra pop-up:

  • Titolo della pagina
  • Descrizione (dalle 2 alle 4 frasi per descrivere meglio la pagina. La descrizione è facoltativa e nelle versioni mobile — per esempio di Facebook — non si vede)
  • Immagine (si consiglia 1200×630 px in formato .png)

A questo punto non ti resta che accedere al social network che vuoi utilizzare e condividere semplicemente il link della pagina, che trovi in alto nella voce “condividi”:

Inserire Pixel di Facebook nella landing page

Se vuoi inserire il Pixel di Facebook nella tua Landing Page, per future campagne di remarketing sul pubblico che ha visualizzato quella specifica pagina, allora ti risulterà molto interessante questa guida.

Ci rivolgiamo pertanto principalmente a chi ha una certa dimestichezza con Facebook e con il pannello di Business Manager.

Dal Business Manager di Facebook scegli la voce “Pixel” nella sezione “Misurazione e report”:

A questo punto clicca su “crea pixel” e segui le istruzioni di Facebook:

Ora torna sull’editor landing page di LeadPower, vai su “impostazioni generali pagina” e seleziona la voce “script analytics”:

Copia lo script del pixel ed inseriscilo nella riga “Script da inserire nel tag HEAD”:

Ricorda: puoi realizzare un pixel di Facebook per ciascun account pubblicitario, ti consigliamo pertanto di utilizzarlo nella landing page solamente se non hai un sito web, altrimenti il nostro consiglio è di installarlo lì (avrai nel tempo più traffico lì che nella landing page, che ti serve per una specifica campagna).

Gentile utente la fruizione della guida non è disponibile da cellulare... si, teniamo alla salute dei tuoi occhi.

La guida ti aspetta su tablet o desktop, per tornare a Foxlead clicca qui.