Opzioni del Compositore esperienza visivo

Quando si fa clic su un elemento di pagina nel Adobe Target Visual Experience Composer (VEC), un menu mostra le opzioni disponibili per tale tipo di elemento. Inoltre, nella parte inferiore della pagina viene visualizzato un percorso DOM che consente di navigare facilmente nella struttura della pagina.

Le varie azioni di Visual Experience Composer (VEC) sono raggruppate nelle opzioni di menu appropriate per rendere il processo più veloce ed efficiente:

Edit

Sono disponibili le seguenti opzioni:

Text/HTML edit-text-html

Modifica il codice HTML per l'elemento, ad esempio il testo per un'area di testo, un pulsante o collegamento.

Oltre al codice HTML, puoi modificare e inserire codice JavaScript personalizzato.

Sono disponibili diverse opzioni di formattazione per modificare testo e HTML per le attività A/B e Experience Targeting. Puoi scegliere font e stile, l’allineamento del testo e altre opzioni standard per la formattazione del testo. Quando modifichi l’HTML, puoi passare dalla visualizzazione del codice alla visualizzazione per modifica Rich Text dell’HTML.

I seguenti tag HTML5 possono essere nidificati:

Background Color

Utilizza il settore colori per selezionare o configurare un colore di sfondo. È possibile selezionare un campione di colore e regolarlo utilizzando i valori RGB o i codici esadecimali. La x rossa nel selettore colore rende lo sfondo trasparente.

Nota: questa opzione non è disponibile se è impostata un’immagine di sfondo.

Styles styles

Utilizzare il pannello Styles per visualizzare o modificare il valore degli stili esistenti per l'elemento selezionato. Inoltre, è possibile aggiungere ulteriore formattazione.

Per accedere al pannello Styles, fai clic su un elemento di pagina nel Compositore esperienza visivo, quindi su Edit > Styles.

Il pannello Styles viene visualizzato sul lato destro del Compositore esperienza visivo. Il pannello contiene un elenco di stili che consente di modificare o aggiungere formattazione all’elemento selezionato. Se hai familiarità con l’utilizzo di Cascading Style Sheet (CSS) o se ricevi del codice dallo sviluppatore, un editor CSS in tempo reale consente di visualizzare le modifiche e aggiungere stili.

Quando si applicano stili diversi, è sempre possibile ripristinare le modifiche facendo clic sull'icona Revert visualizzata nell'angolo in alto a destra del pannello Styles dopo aver modificato una sezione. Facendo clic sull'icona Revert vengono ripristinate tutte le modifiche nel pannello della sezione corrente.

Espandi ogni sezione per modificare o aggiungere stili, come descritto di seguito. Per salvare le modifiche, fai clic sull'icona Back nella parte superiore del pannello per tornare alla visualizzazione principale del pannello, quindi fai clic su Save.

I punti blu nel pannello principale e accanto a ogni opzione nei vari pannelli di sezione indicano che sono stati modificati gli stili corrispondenti. Questo indicatore visivo semplifica la revisione delle modifiche prima di fare clic su Save.

CSS Class

Specifica la classe CSS predefinita utilizzata per l’elemento. Se vengono selezionati più elementi, separa le classi CSS con uno spazio.

Disponibile per A/B, Automated Personalization e Multivariate Test attività.

Link

Modifica l’URL nel collegamento.

Utilizza Modifica collegamento per aggiornare il selettore in modo che indirizzi allo stesso elemento immagine. Tuttavia, il collegamento a un elemento immagine diverso non è supportato. Per collegare un elemento immagine diverso, eliminare l'azione originale dall'editor di codice e utilizzare Visual Experience Composer per applicare l'azione all'altro elemento immagine.

Insert Before

Sono disponibili le seguenti opzioni:

Offer Decision

Aggiungi un'offerta creata in Adobe Journey Optimizer per presentare ai clienti l'offerta e l'esperienza migliore utilizzando offer decisioning.

Nota: questa opzione è disponibile solo per la modifica o la creazione di attività manuali A/B Test o Experience Targeting (XT). Questa opzione non è disponibile per altri tipi di attività.

Per ulteriori informazioni, consulta Utilizzare le decisioni sulle offerte.

Image, HTML e Text

Consente di aggiungere qualsiasi tipo di elemento alla pagina, e di modificare il contenuto esistente. Puoi aggiungere testo, codice, elenchi e così via per creare esperienze diverse da testare.

Selezionare un elemento nella pagina, quindi fare clic su Insert Before e scegliere se si desidera inserire un'immagine, un HTML o un testo. L’elemento inserito viene visualizzato prima dell’elemento selezionato.

Il comportamento dell’elemento inserito dipende dalla struttura della pagina, dal CSS e da altre opzioni di configurazione della pagina. Per la corretta visualizzazione della pagina è necessario un codice HTML valido. Verifica sempre la pagina dopo l’inserimento di un elemento per essere certo che venga visualizzata come previsto.

Recommendations supporta Insert Before il contenuto dei tag DIV, SECTION e ARTICLE.

Nota: l’inserimento di un’immagine richiede che Adobe Scene7 Publishing System sia attivato, in modo da avere accesso alla libreria delle immagini.

Consiglio

Includi consigli all’interno di attività di test A/B (tra cui Allocazione automatica e Targeting automatico) e targeting delle esperienze (XT). Per ulteriori informazioni, consulta Consigli come offerta.

Experience Fragment

Inserisci frammenti esperienza creati in Adobe Experience Manager (AEM) nelle attività di Target per aiutare l’ottimizzazione o la personalizzazione. Per ulteriori informazioni, consulta Frammenti esperienza AEM.

Insert After

Sono disponibili le seguenti opzioni:

Offer Decision

Aggiungi un'offerta creata in Adobe Journey Optimizer per presentare ai clienti l'offerta e l'esperienza migliore utilizzando offer decisioning.

Nota: questa opzione è disponibile solo per la modifica o la creazione di attività manuali A/B Test o Experience Targeting (XT). Questa opzione non è disponibile per altri tipi di attività.

Per ulteriori informazioni, consulta Utilizzare le decisioni sulle offerte.

Image, HTML e Text

Consente di aggiungere qualsiasi tipo di elemento alla pagina, e di modificare il contenuto esistente. Puoi aggiungere testo, codice, elenchi e così via per creare esperienze diverse da testare.

Selezionare un elemento nella pagina, quindi fare clic su Insert After e scegliere se si desidera inserire un'immagine, un HTML o un testo. L’elemento inserito viene visualizzato dopo l’elemento selezionato.

Il comportamento dell’elemento inserito dipende dalla struttura della pagina, dal CSS e da altre opzioni di configurazione della pagina. Per la corretta visualizzazione della pagina è necessario un codice HTML valido. Verifica sempre la pagina dopo l’inserimento di un elemento per essere certo che venga visualizzata come previsto.

Recommendations supporta Insert After il contenuto dei tag DIV, SECTION e ARTICLE.

Nota: l’inserimento di un’immagine richiede che Adobe Scene7 Publishing System sia attivato, in modo da avere accesso alla libreria delle immagini.

Consiglio

Includi consigli all’interno di attività di test A/B (tra cui Allocazione automatica e Targeting automatico) e targeting delle esperienze (XT). Per ulteriori informazioni, consulta Consigli come offerta.

Experience Fragment

Inserisci frammenti esperienza creati in Adobe Experience Manager (AEM) nelle attività di Target per aiutare l’ottimizzazione o la personalizzazione. Per ulteriori informazioni, consulta Frammenti esperienza AEM.

Replace Content

Sono disponibili le seguenti opzioni:

Offer Decision

Aggiungi un'offerta creata in Adobe Journey Optimizer per presentare ai clienti l'offerta e l'esperienza migliore utilizzando offer decisioning.

Nota: questa opzione è disponibile solo per la modifica o la creazione di attività manuali A/B Test o Experience Targeting (XT). Questa opzione non è disponibile per altri tipi di attività.

Per ulteriori informazioni, consulta Utilizzare le decisioni sulle offerte.

Image

Consente di selezionare una diversa immagine dalla libreria Contenuto. Le immagini disponibili per la sostituzione includono le immagini caricate nella cartella delle risorse di Experience Cloud o nella libreria di contenuti in Target.

Durante la creazione dell’attività iniziale, l’URL visualizzato non è l’URL utilizzato per la consegna. Dopo l’attività di sincronizzazione, tale URL viene aggiornato a un URL Scene7 di produzione.

Ad esempio, l’URL iniziale potrebbe essere simile all’esempio seguente:

https://test.marketing.adobe.com/content/dam/mac/scholasticinc/Aug_MBM.jpeg?ch_ck=1470774943867

Dopo la sincronizzazione dell’attività, l’URL di consegna potrebbe essere simile al seguente:

http://s7d2.scene7.com/is/image/TargetTest/Aug_MBM?tm=1470768352933&fit=constrain&hei=173&wid=300

La funzione Consigli supporta la funzione Sostituisci con nei tag DIV, SECTION e ARTICLE.

Nota: lo scambio delle immagini richiede un account Adobe Scene7 Publishing System.

HTML Offer

Selezionare un'offerta diversa da Content Library.

Nota: ​Target le offerte HTML sono memorizzate sui server di

Un’offerta HTML può avere una dimensione massima di 256 KB.

Consiglio

Includi consigli all’interno di attività di test A/B (tra cui Allocazione automatica e Targeting automatico) e targeting delle esperienze (XT). Per ulteriori informazioni, consulta Consigli come offerta.

Experience Fragment

Inserisci frammenti esperienza creati in Adobe Experience Manager (AEM) nelle attività di Target per aiutare l’ottimizzazione o la personalizzazione. Per ulteriori informazioni, consulta Frammenti esperienza AEM.

Layout

Sono disponibili le seguenti opzioni:

Rearrange

Trascina l’elemento in un’altra posizione nello stesso elemento padre o DIV. Gli altri elementi vengono spostati per fare spazio all’elemento ridisposto.

Nota: il tracciamento dei clic non funziona sugli elementi ridisposti.

Attualmente, alcune azioni del Compositore esperienza visivo, come Rearrange e Move, presuppongono che gli elementi di pari livello degli elementi padre di origine e di destinazione siano completamente caricati. Se si verifica un caricamento lento sotto gli elementi DOM principali (sorgente o destinazione), queste azioni del Compositore esperienza visivo possono causare un comportamento incoerente. Stiamo lavorando a un approccio più affidabile per far funzionare le azioni del Compositore esperienza visivo in elementi DOM caricati lentamente. Come soluzione alternativa temporanea, puoi utilizzare Custom Code in questi scenari per eseguire il rendering delle esperienze.

Resize

Consente di ridimensionare un elemento nella pagina. Quando si seleziona Resize, nell'angolo inferiore destro dell'elemento viene visualizzato un quadratino che consente di trascinare l'angolo per ridimensionarlo. Tieni premuto il tasto Maiusc per mantenere le stesse proporzioni.

Nota: gli elementi in linea non possono essere ridimensionati.

Move move

Consnete di spostare gli elementi nella pagina. A differenza dell'opzione Rearrange, Move non sposta altri elementi per lasciare spazio all'elemento da spostare. Utilizza i tasti freccia per regolare meglio lo spostamento. (Miglioramento pianificato: supporto per garantire che gli elementi spostati non siano nascosti dietro altri elementi.)

In alcune situazioni, ad esempio quando una limitazione CSS richiede che un elemento resti all’interno del suo elemento padre, non puoi spostare l’elemento al di fuori di quest’ultimo. Un elemento non può essere spostato all’esterno di un contenitore seguito dalla proprietà CSS overflow: hidden.

Vedere Rearrange sopra per ulteriori informazioni sul comportamento incoerente con le azioni Move e Rearrange a causa del caricamento lento degli elementi DOM.

Hide

Consnete di nascondere l’elemento. Lo spazio vuoto viene conservato, ma il contenuto viene rimosso.

Remove

Rimuovi l’elemento. Lo spazio vuoto dietro l'immagine viene rimosso e lo spazio in cui l'elemento si trovava viene compresso.

Nota: gli elementi di una mbox classica (una mbox creata in una campagna di Target Classic) non possono essere rimossi con questa opzione.

Expand Section

Consente di selezionare l’elemento padre in aggiunta all’elemento selezionato originariamente. Quando selezioni un elemento padre, tutti i relativi figli vengono selezionati automaticamente. Puoi espandere la selezione più volte.

Navigate to Link

Consente di aprire la destinazione del collegamento.

Undo/Redo

Annulla le modifiche apportate alle attività durante una sessione di modifica. Puoi inoltre ripristinare le modifiche precedentemente annullate.

Considerazioni considerations

Supporto per elementi personalizzati custom

Il Compositore esperienza visivo supporta Componenti Web per consentire di creare e testare offerte ed esperienze personalizzate su elementi personalizzati e su elementi al loro interno. Questa funzionalità è disponibile nel Compositore esperienza visivo per tutti i tipi di attività Target.

La maggior parte delle azioni del Compositore esperienza visivo è supportata su eventi personalizzati e all’interno di eventi personalizzati, con le seguenti eccezioni:

Le seguenti azioni non sono disponibili sugli elementi personalizzati:

La seguente azione non è disponibile all’interno di elementi personalizzati:

Navigare tra gli elementi utilizzando il percorso DOM dom-path

Facendo clic su un elemento della pagina, viene visualizzato il menu delle opzioni del Compositore esperienza visivo. Inoltre, quando fai clic su un elemento, il percorso DOM corrispondente viene visualizzato nella parte inferiore della pagina.

Puoi utilizzare il percorso DOM per vedere rapidamente le informazioni sull’elemento selezionato (tipo, ID e classe) e spostarti verso l’alto o il basso nel percorso DOM per selezionare l’elemento desiderato.

Quando passi il cursore del mouse sul percorso DOM, una casella blu evidenzia l’elemento corrispondente nel Compositore esperienza visivo. Se fai clic sull’elemento, una casella arancione evidenzia l’elemento e viene visualizzato il menu delle opzioni del Compositore esperienza visivo, come illustrato in precedenza.

Utilizzando il percorso DOM, è possibile passare facilmente a qualsiasi elemento principale, di pari livello o secondario all’interno del Compositore esperienza visivo.

La funzione Percorso DOM è disponibile anche quando si imposta il tracciamento dei clic.