Elementi statici in un modulo web

È possibile includere nelle pagine del modulo elementi con i quali l'utente non interagisce; si tratta di elementi statici quali immagini, contenuto HTML, barra orizzontale o collegamento ipertestuale. Questi elementi vengono creati mediante il primo pulsante nella barra degli strumenti, selezionando Static elements.

Sono disponibili i seguenti tipi di campo:

  • Valore basato su risposte fornite in precedenza (nel contesto del modulo) o sul database.

  • Collegamento ipertestuale, HTML, barra orizzontale. Consultate Inserimento di contenuto HTML.

  • Immagine salvata nella libreria delle risorse o su un server accessibile dagli utenti. Vedere Inserimento di immagini.

  • Script eseguito sul lato client e/o sul lato server. Deve essere scritto in JavaScript ed essere compatibile con la maggior parte dei browser per garantire la corretta esecuzione sul lato client.

    NOTA

    Sul lato server, lo script può utilizzare le funzioni definite nella documentazione JSAPI della campagna.

Inserimento di contenuto HTML

È possibile includere il contenuto HTML in una pagina del modulo: collegamenti ipertestuali, immagini, paragrafi formattati, video e così via

L'editor HTML consente di inserire il contenuto da inserire nella pagina del modulo. Per aprire l'editor, fare clic su Static elements > HTML .

Potete immettere e formattare il contenuto direttamente oppure visualizzare la finestra del codice sorgente da incollare in alcuni contenuti esterni. Per passare alla modalità "codice sorgente", fate clic sulla prima icona nella barra degli strumenti:

Per inserire un campo di database, utilizzate il pulsante di personalizzazione.

NOTA

Le stringhe immesse nell'editor HTML vengono convertite solo se definite nella sottoscheda Texts. In caso contrario, non verranno raccolti. Per ulteriori informazioni, vedere Traduzione di un modulo Web.

Compila i campi nella finestra di modifica come illustrato nell’esempio seguente:

Per aggiungere un collegamento ipertestuale, passare a Static elements > Link.

  • Il Label è il contenuto del collegamento ipertestuale così come verrà visualizzato nella pagina del modulo.

  • L' URL è l'indirizzo desiderato, ad esempio: https://www.adobe.com per un sito Web oppure info@adobe.com per inviare un messaggio.

  • Il campo Window consente di selezionare la modalità di visualizzazione del collegamento nel caso di un sito. È possibile aprire il collegamento in una nuova finestra, nella finestra corrente o in un'altra.

  • È possibile aggiungere una descrizione comandi, come illustrato di seguito:

  • Potete scegliere di visualizzare il collegamento come pulsante o immagine. A tal fine, selezionare il tipo di visualizzazione nel campo Type.

Per impostazione predefinita, i collegamenti sono associati a un’azione di tipo URL, in modo che sia possibile inserire un indirizzo di destinazione di collegamento nel campo URL.

Puoi definire altre azioni per il collegamento, in modo che l’utente possa fare clic sul collegamento per effettuare le seguenti operazioni:

  • Aggiornare la pagina

    A tal fine, selezionare l'opzione Refresh page nella casella a discesa del campo Action.

  • Visualizzare la pagina precedente o successiva

    A tal fine, selezionare l'opzione Next page o Previous page nella casella a discesa del campo Action.

    È possibile nascondere i pulsanti Next e/o Back se devono essere sostituiti da un collegamento. Fare riferimento a questa pagina.

    Il collegamento sostituirà il pulsante Next utilizzato per impostazione predefinita.

  • Visualizzare un'altra pagina

    L'opzione Enable a transition consente di visualizzare una pagina specifica associata alla transizione in uscita selezionata nel campo Transition.

    Per impostazione predefinita, una pagina dispone di una sola transizione di output. Per creare nuove transizioni, selezionate la pagina e fate clic sul pulsante Add nella sezione Output transitions, come illustrato di seguito:

    Nel diagramma, l'aggiunta avrà l'aspetto seguente:

    NOTA

    Per ulteriori informazioni sulla sequenza delle pagine in un modulo Web, vedere Definizione della sequenza delle pagine dei moduli Web.

  • Precaricare i campi del modulo con i dati prelevati dal profilo Facebook

    ATTENZIONE

    Questa funzione è disponibile solo se è stata installata l'applicazione Social Marketing. Per utilizzare questa opzione, è necessario creare un'applicazione Facebook con un account esterno di tipo Facebook Connect. Per ulteriori informazioni, consulta questa pagina.

    L'opzione Preload with Facebook consente di inserire un pulsante in un modulo per precaricare i campi utilizzando le informazioni del profilo di Facebook.

    Quando un utente fa clic sul pulsante Fill in automatically, si apre la finestra della richiesta di autorizzazione di Facebook.

    NOTA

    È possibile modificare l'elenco dei diritti estesi durante la configurazione dell'account esterno. Se non immettete alcun diritto esteso, per impostazione predefinita Facebook inoltra le informazioni di base del profilo.
    Per visualizzare l'elenco dei diritti estesi e la relativa sintassi, fai clic qui: https://developers.facebook.com/docs/reference/api/permissions/

    Se l'utente accetta di condividere le proprie informazioni, i campi del modulo vengono precaricati.

Per questo caso di utilizzo, è stata creata un'applicazione Web composta dai seguenti elementi:

  • una pagina contenente il modulo
  • un’attività Record
  • un'attività End

Per aggiungere un pulsante di precaricamento, effettuate le seguenti operazioni:

  1. Creare un modulo.

  2. Passare allo stesso livello dei campi del modulo e aggiungere un collegamento.

  3. Immettere l'etichetta e selezionare il tipo Button.

  4. Andate al campo Action e selezionate Preload with Facebook.

  5. Andate al campo Application e selezionate il tipo di account esterno Facebook Connect creato in precedenza. Per ulteriori informazioni, consulta questa pagina.

Personalizzazione del contenuto HTML

È possibile personalizzare il contenuto HTML di una pagina di modulo con i dati registrati in una pagina precedente. Ad esempio, è possibile creare un modulo Web di assicurazione auto la cui prima pagina consente di fornire informazioni di contatto e il marchio dell'auto.

Utilizzate i campi di personalizzazione per reinserire il nome utente e il marchio selezionato nella pagina successiva. La sintassi da utilizzare dipende dalla modalità di memorizzazione delle informazioni. Per ulteriori informazioni, fare riferimento a Utilizzo delle informazioni raccolte.

NOTA

Per motivi di sicurezza, il valore immesso nella formula <%= viene sostituito con caratteri di escape.

Nel nostro esempio, il nome e il cognome del destinatario sono memorizzati in un campo del database, mentre il marchio della loro auto è memorizzato in una variabile. La sintassi del messaggio personalizzato a pagina 2 sarà la seguente:

<P>Welcome <%= ctx.recipient.@firstName %> <%= ctx.recipient.@lastName %>,</P>
<P>To start your customized study, please select your car <%=ctx.vars.marque%> and its year of purchase.</P>

Questo produce il seguente risultato:

Uso delle variabili di testo

La scheda Text consente di creare campi variabili che possono essere utilizzati nell'HTML tra i caratteri <%= e %> con la sintassi seguente: $(IDENTIFIER).

Utilizzare questo metodo per localizzare facilmente le stringhe. Vedere Traduzione di un modulo Web

Ad esempio, è possibile creare un campo Contact che consente di visualizzare la stringa "Data dell'ultimo contatto:" nel contenuto HTML. Per farlo, segui la procedura indicata di seguito:

  1. Fare clic sulla scheda Text del testo HTML.

  2. Fate clic sull'icona Add.

  3. Nella colonna Identifier, immettere il nome della variabile

  4. Nella colonna Text, immettere il valore predefinito.

  5. Nel contenuto HTML, inserite questa variabile di testo tramite la sintassi <%= $(Contact) %>.

    ATTENZIONE

    Se immettete questi caratteri nell'editor HTML, i campi < e ​verranno sostituiti con i relativi caratteri di escape. In questo caso, è necessario correggere il codice sorgente facendo clic sull'icona Display source code dell'editor di testo HTML.

  6. Aprire l'etichetta Preview del modulo per visualizzare il valore immesso nel codice HTML:

Questa modalità operativa consente di definire il testo dei moduli Web una sola volta e di gestire le traduzioni utilizzando lo strumento di traduzione integrato. Per ulteriori informazioni, vedere Traduzione di un modulo Web.

Inserimento di immagini

Per poter essere incluse nei moduli, le immagini devono essere salvate in un server accessibile dall'esterno.

Selezionare il menu Static elements > Image.

Selezionate la sorgente dell’immagine da inserire: può provenire dalla libreria delle risorse pubbliche o essere memorizzato in un server esterno accessibile dall'esterno.

Se si tratta di un'immagine dalla libreria, selezionarla nella casella combinata del campo; se si trova in un file esterno, immettete il percorso di accesso. L'etichetta viene visualizzata passando il cursore sull'immagine (coincide con un campo ALT in HTML), oppure quando l'immagine non viene visualizzata.

L’immagine può essere visualizzata nella sezione centrale dell’editor.

In questa pagina