Gestire le modifiche web manage-web-modifications
Puoi gestire facilmente tutti i componenti, le regolazioni e gli stili aggiunti alla pagina web. Puoi anche aggiungere modifiche direttamente dal riquadro dedicato.
Utilizzare il riquadro Modifiche use-modifications-pane
-
Seleziona l'icona Modifiche per visualizzare il riquadro corrispondente a sinistra.
-
Puoi rivedere tutte le modifiche apportate alla pagina.
-
Seleziona una modifica indesiderata e fai clic sull'opzione Elimina modifica dal pulsante Altre azioni per rimuoverla.
note caution CAUTION Procedi con cautela durante l’eliminazione di un’azione, in quanto può influire sulle azioni successive. -
Se si sta creando un'applicazione a pagina singola, è possibile applicare qualsiasi modifica ad altre visualizzazioni. Ulteriori informazioni
-
Per eliminare più modifiche contemporaneamente, fai clic sul pulsante Seleziona sopra il riquadro Modifiche, controlla le modifiche e fai clic sull'icona Elimina.
-
Utilizza il pulsante Altre azioni sopra il riquadro Modifiche per eliminare tutte le modifiche contemporaneamente.
-
Puoi anche eliminare solo le modifiche non valide, ovvero quelle ignorate da altre modifiche. Ad esempio, se si modifica il colore di un testo e successivamente si elimina tale testo, la modifica del colore non sarà più valida in quanto il testo non esiste più.
-
Puoi annullare e ripristinare le azioni utilizzando il pulsante Annulla/Ripristina in alto a destra dello schermo.
Fai clic e tieni premuto il pulsante per passare dalle opzioni Annulla alle opzioni Ripristina. Quindi fai clic sul pulsante stesso per applicare l’azione desiderata.
Aggiungi modifiche dal riquadro dedicato add-modifications
Quando modifichi una pagina utilizzando il designer Web, puoi aggiungere nuove modifiche al contenuto direttamente dal riquadro Modifiche, senza dover selezionare un componente e modificarlo dall'interfaccia del designer Web. Segui i passaggi seguenti.
-
Nel riquadro Modifiche fare clic sul pulsante Altre azioni.
-
Seleziona Aggiungi una modifica.
-
Selezionare il tipo di modifica:
- Selettore CSS - Ulteriori informazioni
- Pagina
<Head>- Ulteriori informazioni
-
Inserisci il contenuto e Salva le modifiche.
-
Fai clic sul pulsante Altre azioni accanto alla modifica e seleziona Informazioni per visualizzarne i dettagli.
Selettore CSS css-selector
Per aggiungere una modifica del tipo Selettore CSS, effettua le seguenti operazioni.
-
Seleziona Selettore CSS come tipo di modifica.
-
Il campo Selettore elemento CSS consente di trovare e selezionare gli elementi HTML (o i nodi nella struttura DOM) su cui si desidera applicare le modifiche.
-
Selezionare un tipo di azione (Imposta contenuto o Imposta attributo) e inserire le informazioni/il contenuto richiesti.
-
Imposta contenuto: specifica il contenuto da inserire nell'elemento identificato dal campo Selettore elemento CSS.
-
Imposta attributo: specifica un attributo da associare al selettore CSS corrente in modo che possa essere identificato anche da questo attributo. A tale scopo, immettere un nome nel campo Nome attributo e un valore nel campo Contenuto. Se l’attributo esiste già, il valore viene aggiornato; in caso contrario viene aggiunto un nuovo attributo con il nome e il valore specificati.
-
Pagina <head> page-head
È possibile aggiungere codice personalizzato utilizzando il tipo di modifica Pagina<head>.
L'elemento <head> è un contenitore per metadati (dati sui dati) e si trova tra il tag <html> e il tag <body>. In questo caso, il codice non attende gli eventi di caricamento del corpo del testo o della pagina, ma viene eseguito all’inizio del caricamento della pagina.
L'elemento <head> viene comunemente utilizzato per aggiungere codice JavaScript o CSS nella parte superiore della pagina. I selettori per le azioni visive successive dipendono dagli elementi HTML aggiunti in questa scheda.
Per aggiungere una modifica del tipo Pagina<head>, eseguire la procedura seguente.
-
Selezionare Pagina
<head>come tipo di modifica.
-
Aggiungi il codice personalizzato nella casella Contenuto.
note caution CAUTION È possibile aggiungere solo <script>e<style>elementi alla sezione<head>. L'aggiunta di<div>tag e di altri elementi potrebbe causare la comparsa di<head>elementi rimanenti in<body>. -
Fai clic sul pulsante Opzioni di modifica avanzate. Viene aperto l’editor di personalizzazione.
Puoi sfruttare l'editor di personalizzazione Journey Optimizer con tutte le sue funzionalità di personalizzazione e authoring. Ulteriori informazioni
Esempi di codice personalizzato custom-code-examples
È possibile utilizzare il tipo di modifica Pagina<head> per:
-
Utilizza JavaScript in linea o collega a un file JavaScript esterno.
Ad esempio, per modificare il colore di un elemento:
code language-none <script type="text/javascript"> document.getElementById("element_id").style.color = "blue"; </script> -
Configurare uno stile in linea o un collegamento a un foglio di stile esterno.
Ad esempio, per definire una classe per un elemento di sovrapposizione:
code language-none <style> .overlay { position: absolute; top:0; left: 0; right: 0; bottom: 0; background: red; } </style>
Best practice per il codice personalizzato custom-code-best-practices
Ad esempio:
| code language-none |
|---|
|
Nel caso in cui siano necessarie modifiche, apporta modifiche all’interno del contenitore.
Se non hai più bisogno del codice personalizzato, lascia vuoto questo contenitore, ma non rimuoverlo. In questo modo, non influisce sulle altre modifiche dell’esperienza.
<head><>per due campagne che interessano lo stesso URL.<head> per due campagne che interessano lo stesso URL, il JavaScript viene inserito nella pagina da entrambe le campagne. Journey Optimizer determina automaticamente l'ordine del contenuto consegnato. Assicurati che il codice non dipenda dal posizionamento. Sta a te verificare che il codice non contenga conflitti.