Utilizzare web designer work-with-web-designer

In Journey Optimizer, l'authoring Web visivo è basato sull'estensione browser Effetto cromatura Visual Helper Adobe Experience Cloud. Ulteriori informazioni

CAUTION
Per poter accesso e creare pagine Web nell'interfaccia Journey Optimizer utente, assicurarsi di seguire i prerequisiti elencati in questa sezione.

Inizia l'authoring dell'esperienza web

Per iniziare a creare la tua esperienza web utilizzando il web designer visivo, seguire i passaggi seguenti.

CAUTION
L'SDK 🔗 Web Adobe Experience Platform deve essere incluso nella pagina Web. Ulteriori informazioni
  1. Dalla schermata Modifica contenuto, fare clic su Modifica pagina Web per aprire la finestra di progettazione Web.

    note note
    NOTE
    Se il caricamento di un sito Web non riesce, viene visualizzato un messaggio per suggerirti di installare l'estensione del browser Helper per editing video. Consulta alcuni suggerimenti per la risoluzione dei problemi in questa sezione.
    Puoi anche modificare il contenuto web senza caricare l’editor visivo. Per eseguire questa operazione, deselezionare l'opzione Editor visivo per utilizzare la modalità di modifica non visiva. Ulteriori informazioni
  2. Una volta nella finestra di progettazione web, seleziona qualsiasi elemento dall’area di lavoro, ad esempio immagine, pulsante, paragrafo, testo, contenitore, intestazione, collegamento e così via. Ulteriori informazioni

  3. Per modificare un elemento, puoi utilizzare:

    • Il menu contestuale per modificarne il contenuto, il layout, l’inserimento di collegamenti o la personalizzazione, ecc.

    • Le icone sopra il pannello di destra per modificare, duplicare, eliminare o nascondere ogni elemento.

    • Pannello a destra che cambia dinamicamente in base all’elemento selezionato. Ad esempio, puoi modificare lo sfondo, la composizione tipografica, il bordo, le dimensioni, la posizione, la spaziatura, gli effetti o gli stili in linea di un elemento.

NOTE
Il designer del contenuto web è per lo più simile al designer e-mail. Scopri di più su come progettare contenuto con Journey Optimizer.

Dopo aver modificato il contenuto Web, puoi gestire le modifiche. Ulteriori informazioni

Utilizzare i componenti content-components

  1. Dal riquadro Componenti a sinistra, selezionare un elemento. È possibile aggiungere i seguenti componenti alla pagina Web e modificarli in base alle esigenze:

    • Divisore
    • HTML
    • Immagine
    • Intestazione - L'utilizzo di questo componente è simile all'utilizzo del componente Testo nella finestra di progettazione e-mail. Ulteriori informazioni
    • Paragrafo - L'utilizzo di questo componente è simile all'utilizzo del componente Testo nella finestra di progettazione e-mail. Ulteriori informazioni
    • Collegamento

  2. Passa il mouse sulla pagina e fai clic sul pulsante Inserisci prima o Inserisci dopo per aggiungere il componente a un elemento esistente nella pagina.

    note note
    NOTE
    Per deselezionare un componente, fare clic sul pulsante ESC nel banner contestuale blu visualizzato sopra l'area di lavoro.
  3. Modifica il componente in base alle esigenze direttamente nel contenuto della pagina.

  4. Regola gli stili visualizzati dal riquadro contestuale a destra, ad esempio sfondo, colore del testo, bordo, dimensione, posizione e così via. - a seconda del componente selezionato.

Aggiungere personalizzazione

Per aggiungere la personalizzazione, seleziona un contenitore e fai clic sull’icona di personalizzazione dalla barra dei menu contestuale visualizzata. Aggiungi le modifiche utilizzando l’editor di personalizzazione. Ulteriori informazioni

Questa sezione descrive in dettaglio i diversi modi in cui è possibile navigare attraverso il web designer. Per visualizzare e gestire le modifiche aggiunte alla tua esperienza web, consulta questa sezione.

Utilizzare il breadcrumb breadcrumbs

  1. Seleziona un elemento qualsiasi dal quadro.

  2. Fai clic sull'pulsante Espandi/Comprimi breadcrumb nella parte inferiore sinistra dello schermo per visualizzare rapidamente le informazioni sull'elemento selezionato.

  3. Quando passi il cursore del mouse sulle breadcrumb, l’elemento corrispondente viene evidenziato nell’editor.

  4. Utilizzando questo elemento è possibile passare facilmente a qualsiasi elemento padre, di pari livello o figlio all’interno dell’editor visivo.

Passare alla modalità sfoglia browse-mode

È possibile passare dalla modalità predefinita Progettazione alla modalità Sfoglia utilizzando il pulsante dedicato.

Dalla modalità Sfoglia, puoi passare alla pagina esatta dalla configurazione selezionata che desideri personalizzare.

È particolarmente utile quando si tratta di pagine che sono dietro l’autenticazione o che non sono disponibili dall’inizio a un determinato URL. Ad esempio, potrai eseguire l'autenticazione, passare alla pagina dell'account o alla pagina del carrello e quindi tornare alla modalità Progettazione per eseguire le modifiche nella pagina desiderata.

L'utilizzo della modalità Sfoglia consente inoltre di spostarsi tra tutte le visualizzazioni del sito Web durante la creazione di applicazioni a pagina singola. Ulteriori informazioni

Cambia dimensione dispositivo change-device-size

È possibile modificare le dimensioni del dispositivo della visualizzazione del Web designer impostando una dimensione predefinita, ad esempio Tablet o Orizzontale mobile, oppure definire una dimensione personalizzata immettendo il numero di pixel desiderato.

È inoltre possibile modificare il concentrarsi di zoom, dal 25% al 400%.

La possibilità di modificare le dimensioni del dispositivo è progettata per siti dinamico che eseguono correttamente il rendering su vari dispositivi, finestre e dimensioni dello schermo. I siti reattivi si adattano automaticamente e si adattano a qualsiasi dimensione dello schermo, inclusi desktop, laptop, tablet o telefoni cellulari.

CAUTION
Puoi modificare un'esperienza web con una specifica dimensione dispositivo. Tuttavia, finché i selettori sono gli stessi, queste modifiche si applicano a tutte le dimensioni e dispositivi, non solo alle dimensioni dispositivo in cui si sta lavorando. Analogamente, la modifica di un'esperienza nella normale visualizzazione desktop applica le modifiche a tutte le dimensioni dello schermo, non solo alla visualizzazione desktop.
Attualmente, Journey Optimizer non supporta le modifiche di pagina specifiche per le dimensioni del dispositivo. Ciò significa che, ad esempio, se si dispone di un sito Web mobile separato con una struttura del sito separata, è necessario apportare le modifiche specifiche per il proprio sito mobile in una campagna diversa.

Video introduttivo video

Il video qui sotto mostra come creare un'esperienza web utilizzando il web designer nelle Journey Optimizer campagne.

recommendation-more-help
b22c9c5d-9208-48f4-b874-1cefb8df4d76