Finestra di dialogo reattiva

FINESTRA DI DIALOGO REATTIVA Finestra di dialogo reattiva

La finestra di dialogo reattiva è un tipo di intercettazione guidata disponibile per i progetti Approfondimenti su sito web e app. Le Finestre di dialogo reattive consentono di creare overlay conformi all'accessibilità per il proprio sito web, in grado di adattarsi alle diverse dimensioni dei dispositivi.

Una volta ottenuto l'accesso a questa funzione, la finestra di dialogo reattiva sarà disponibile insieme alle altre creatività.

Creazione di una finestra di dialogo reattiva

Creare un'intercetta guidata.

Mantenere la piattaforma impostata su Sito web.
 

---

×

close

Selezionare Sovrapposizione.

Fare clic su Crea intercettazioni.

Nella pagina Impostazione, selezionare Aspetto.
 

---

×

close

Per utilizzare l'editor di intercettazione classico, scorri verso il basso e seleziona " Finestra di dialogo reattiva". A questo punto, segui i passaggi 7 e 8 per personalizzare l'aspetto del tuo intercettatore.

---

×

close

Consiglio Q: Abbiamo introdotto il nuovo Appearance Studio per la creazione di layout di intercettazione. Questo editor offre le stesse opzioni di personalizzazione descritte in questa pagina, ma con funzionalità più avanzate e un'interfaccia più flessibile. Per iniziare, utilizza il modello "Popover centrale" o "Notifica nell'angolo".

Completare la procedura descritta di seguito in questa pagina di supporto:

• Taglia & Stile
• Messaggio
• Pulsanti
• Loghi e immagini
• Animazione

Aggiungere le traduzioni, se necessario.

Fare clic su Aggiungi collegamento per aggiungere un collegamento o un sondaggio personalizzato alla finestra di dialogo.
 

---

×

close

Selezionare una delle seguenti opzioni:
 

---

×

close

• Scegliete un sondaggio esistente: Collegamento al sondaggio a cui si ha accesso. Assicurarsi che il progetto che si vuole utilizzare sia aperto e abbia un collegamento anonimo disponibile.
• Aggiungere un link esterno: Incollare un URL completo.

Fare clic su Salva connessione.

Aggiungere la logica di destinazione.
 

---

×

close

Aggiungere dati integrati.

Regolare le impostazioni dell'intercetta, come la visualizzazione dell'intercetta e la connessione alla Directory XM.

Testate la vostra intercetta.

Pubblica le modifiche.

Distribuire le modifiche.

Consiglio Q: per le ultime fasi di configurazione e i dettagli sul lancio, è possibile consultare anche la sezione Creazione di intercettazioni guidate.

Taglia & Stile

Nella sezione "Dimensioni e stile" è possibile personalizzare l'aspetto e il tema della creatività come segue:

Dimensioni standard & opzioni di stile

Queste sono le opzioni che vengono visualizzate se non si utilizza una destinazione incorporata e si lascia deselezionata l'opzione " Visualizza il sondaggio" direttamente nella finestra di dialogo.

---

×

close

• Spaziatura del contenuto: Configurare la densità del testo sull'editor di intercettazioni. Puoi scegliere tra " Compatto", " Medio " o " Spazioso".
• Colore: configurare il colore di sfondo dell'editor di intercettazioni scegliendo dalla tavolozza di selezione dei colori.
• Forma del bordo: Configurare il raggio del bordo dell'editor di intercettazioni. Determina il grado di arrotondamento degli angoli. Si può scegliere tra Nessuna, Leggermente arrotondata, Moderatamente arrotondata, Molto arrotondata.
• Ombra: configurare l'ombra che circonda l'editor di intercetta. È possibile scegliere tra Nessuna, Leggera, Media e Pesante.

Visualizzazione del sondaggio direttamente nella finestra di dialogo

Se selezioni l'opzione " Visualizza il sondaggio direttamente nella finestra di dialogo", il sondaggio verrà incorporato nella creatività, anziché essere collegato tramite un pulsante. Per testare l'esperienza completa e accurata del sondaggio in ambito creativo, utilizzare il bookmarklet. Per saperne di più, vedere Intercettazioni di prova.

Consiglio Q: questa impostazione sovrascrive le opzioni di visualizzazione impostate sui set di azioni collegati a questa creativa. Per ulteriori informazioni sulle opzioni di visualizzazione delle serie di azioni, vedere Opzioni di visualizzazione.

Selezionando questa opzione, le schede "Messaggio " e "Pulsanti " verranno rimosse, poiché nella finestra di dialogo reattiva non saranno più presenti né un messaggio né pulsanti, ad eccezione di quelli già impostati nel sondaggio di destinazione. Selezionando questa opzione si hanno anche diverse impostazioni di Dimensione e Stile:

---

×

close

• Ridimensionamento automatico della finestra di dialogo per adattarla al sondaggio: Ridimensiona automaticamente la finestra di dialogo reattiva per adattarla al sondaggio che si sta visualizzando nella finestra. La finestra si ridimensiona automaticamente in base alla lunghezza della prima pagina del sondaggio.

  

  Consiglio Q: il ridimensionamento automatico è limitato dall'altezza della finestra del browser. Se nella prima pagina del sondaggio sono presenti molte domande, è possibile accorciarla, ad esempio spostando alcune domande o inserendo un’interruzione di pagina. La soluzione migliore per evitare che il tuo sondaggio venga interrotto, tuttavia, è quella di attivare la nuova esperienza di compilazione dei sondaggi.

• Colore: configurare il colore di sfondo dell'editor di intercettazioni scegliendo dalla tavolozza di selezione dei colori.
• Forma del bordo: Configurare il raggio del bordo dell'editor di intercettazioni. Determina il grado di arrotondamento degli angoli. Si può scegliere tra Nessuna, Leggermente arrotondata, Moderatamente arrotondata, Molto arrotondata.
• Ombra: configurare l'ombra che circonda l'editor di intercetta. È possibile scegliere tra Nessuna, Leggera, Media e Pesante.
• Accessibilità

  • Titolo dell'iframe: Questo testo verrà letto da uno screenreader quando il visitatore navigherà verso la finestra incorporata.

    

    Consiglio Q: specificare i titoli degli iframe durante la creazione delle finestre di dialogo garantisce che queste siano accessibili agli utenti.

Consiglio Q: fare clic sulla freccia in basso a sinistra per visualizzare le etichette delle sezioni. Per visualizzare solo le icone delle sezioni, fare clic su Nascondi etichette.

UTILIZZARE UN MODELLO

Se desideri importare un tema del sondaggio nelle impostazioni di stile della creatività, fai clic su " Usa un modello".

---

×

close

I temi sono creati dal Brand Administrator per l'utilizzo da parte degli utenti del proprio brand. Selezionare un brand dal menu a discesa, quindi fare clic su Importa. Se desiderate aggiungere un tema a questa lista, contattate il vostro Brand Administrator per maggiori informazioni.

---

×

close

L'importazione di un modello di tema regolerà le seguenti impostazioni per il creativo:

• Colore primario
• Colore secondario
• Colore sfondo
• Dimensione del testo della domanda
• Dimensione del testo della risposta
• Spaziatura domande
• Contrasto primo piano
• Logo

Consiglio Q: le impostazioni del contenuto creativo non sono collegate al tema utilizzato come modello. Le impostazioni della creativa non si aggiornano se il tema del modello cambia e la modifica delle impostazioni della creativa non cambia il tema del modello.

CSS personalizzato

È possibile personalizzare il codice CSS della finestra di dialogo reattiva a proprio piacimento facendo clic sul pulsante "Personalizza CSS ". È possibile aggiungere classi e proprietà personalizzate oltre a quelle predefinite. Le modifiche apportate qui potrebbero non riflettersi nell'anteprima; ricordarsi di testare l'intercetta prima della distribuzione completando la configurazione guidata.

Attenzione: Il codice seguente è fornito così com'è e richiede conoscenze di programmazione per essere implementato. Il Supporto Qualtrics non offre assistenza o consulenza riguardo alla programmazione personalizzata. Puoi invece provare a domandare alla nostra community di utenti esperti.

Messaggio

Nella sezione " Messaggio " puoi configurare il titolo e la descrizione che appariranno sulla tua creatività. L'headline deve essere generalmente una frase breve che catturi l'attenzione del visitatore, mentre la descrizione fornisce maggiori dettagli sul motivo per cui l'editor di intercetta è apparso.

Il carattere sarà adottato dal sito web che visualizza la creatività. Sia per il titolo che per la descrizione, è possibile personalizzare il testo effettivo, la dimensione e la ponderazione dei caratteri.

---

×

close

Pulsanti

Nella sezione " Pulsanti " è possibile configurare le opzioni relative al numero, all'aspetto e alla destinazione di ciascun pulsante.

---

×

close

Consiglio Q: i font dei pulsanti devono essere impostati esplicitamente nel CSS del sito. Se il carattere non è specificato, i pulsanti utilizzeranno i caratteri predefiniti impostati dal browser dell'utente.

Loghi e immagini

Nella sezione " Loghi e immagini" puoi specificare una o più immagini/loghi da includere nella tua creatività.

---

×

close

È possibile scegliere di caricare un'immagine diversa per i dispositivi mobili e per i computer desktop, in modo che vengano visualizzate immagini diverse a seconda che la creatività venga visualizzata su un browser mobile o su un browser desktop. È anche possibile caricare la stessa immagine ma con risoluzioni diverse per ottimizzare la visualizzazione su entrambi i tipi di browser.

Consiglio Q: se si carica un'immagine solo per i dispositivi mobili, questa verrà utilizzata sia per i browser mobili che per quelli desktop. Tuttavia, se si carica un'immagine solo per il desktop, questa verrà utilizzata solo per i browser desktop.

Per rendere l'immagine conforme alle norme di accessibilità, è inoltre possibile specificare il testo alternativo da associare alle immagini. (Il testo alternativo è una funzione che consente agli screen reader di descrivere un'immagine agli utenti con problemi di visualizzazione)

Animazione

Nella sezione "Animazione" puoi scegliere il tipo di animazione (Fade o Slide In)  che desideri per la tua creatività quando appare sullo schermo.

---

×

close

• Visualizza finestra di dialogo dopo: il numero di secondi che devono trascorrere dal momento in cui l'utente soddisfa le condizioni di intercettazione (ad esempio, quando clicca all'interno dell'app) prima che questa finestra di dialogo venga visualizzata.
• Imposta il timer per la chiusura della finestra di dialogo: Stabilisce dopo quanto tempo la finestra di dialogo deve chiudersi da sola. Deselezionare questa opzione per costringere l'utente a chiudere la finestra di dialogo per rimuoverla dallo schermo.

• Tipo di transizione: Scegliere se l'editor di intercettazioni sfuma o scorre sullo schermo quando appare. Se si sceglie l'animazione Slide In, è possibile selezionare anche la posizione finale dell'editor di intercetta sullo schermo (in alto a sinistra, in alto a destra, in basso a sinistra, in basso a destra).

  

  Consiglio Q: utilizzando il tipo di transizione Slide In , questa creatività si comporta come un Editor di intercettazioni.

  

  Consiglio Q: la funzione " Fade" visualizza una finestra a schermo intero e mantiene il focus della tastiera all'interno della finestra di dialogo. La funzione "Slide In" su desktop non si sovrappone alla pagina e non blocca il focus, consentendo così agli utenti che utilizzano la tastiera di continuare a spostarsi nella pagina con il tasto Tab. Sui dispositivi mobili, Slide In utilizza un overlay e mantiene il focus proprio come Fade.

• Sfondo sfumato: il colore dello schermo del dispositivo che fa da sfondo alla creatività (Nessuno, Chiaro, Medio o Scuro).
• Visualizzazione del sondaggio: Dove verrà visualizzato il sondaggio (Nuova finestra, Finestra incorporata, Finestra corrente, Finestra popunder o Nuova scheda).

Se necessario, puoi visualizzare in anteprima le impostazioni dell'animazione anche in questa schermata, cliccando su "Anteprima animazione".