Gestire le modifiche web

Ultimo aggiornamento: 2023-11-09

Argomenti:
Web Channel
Visualizza ulteriori informazioni su questo argomento

Creato per:
Beginner

Intermediate

User

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

Seleziona la Modifiche per visualizzare il riquadro corrispondente a sinistra.
Puoi rivedere tutte le modifiche apportate alla pagina.
Seleziona una modifica indesiderata e fai clic su Elimina modifica opzione dalla Altre azioni per rimuoverlo.

ATTENZIONE

Procedi con cautela durante l’eliminazione di un’azione, in quanto può influire sulle azioni successive.
Per eliminare più modifiche contemporaneamente, fai clic sul pulsante Seleziona sulla parte superiore della Modifiche , verificare le modifiche desiderate e fare clic sul pulsante Elimina icona.
Utilizza il Altre azioni sulla parte superiore della 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ù.
È possibile annullare e ripristinare le azioni utilizzando Annulla/Ripristina in alto a destra.

Fai clic e tieni premuto il pulsante per passare da un’icona all’altra Annulla e Ripeti opzioni. Quindi fai clic sul pulsante stesso per applicare l’azione desiderata.

Aggiungi modifiche dal riquadro dedicato

Quando modifichi una pagina utilizzando il designer Web, puoi aggiungere nuove modifiche al contenuto direttamente dal Modifiche riquadro - senza la necessità di selezionare un componente e modificarlo dall’interfaccia di web designer. Effettua le seguenti operazioni.

Dalla sezione Modifiche , fare clic sul pulsante Altre azioni pulsante.
Seleziona Aggiungi una modifica.
Selezionare il tipo di modifica:
- Selettore CSS - Ulteriori informazioni
- Pagina<Head> - Ulteriori informazioni
Inserisci il contenuto e Salva le tue modifiche.
Fai clic su Altre azioni accanto alla modifica e seleziona Info per visualizzarne i dettagli.

Selettore CSS

Per aggiungere una Selettore CSS modifica del tipo, segui la procedura riportata di seguito.

Seleziona Selettore CSS come tipo di modifica.
Il Selettore elemento CSS Questo campo consente di individuare e selezionare gli elementi HTML (o i nodi nella struttura DOM) su cui si desidera applicare le modifiche.
Seleziona un tipo di azione (Imposta contenuto o Imposta attributo) e inserisci le informazioni/i contenuti richiesti.
- Imposta contenuto: specifica il contenuto da inserire nell’elemento identificato da Selettore elemento CSS campo.
- Imposta attributo: specifica un attributo da associare al selettore CSS corrente in modo che questo selettore possa essere identificato anche da questo attributo. A tale scopo, immetti un nome nel campo Nome attributo e un valore nel campo Contenuto campo. 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>`

Puoi aggiungere codice personalizzato utilizzando Pagina<head> tipo di modifica.

Il <head> è un contenitore per i metadati (dati sui dati) e si trova tra <html> tag e <body> tag. 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.

Il <head> Questo elemento 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 Pagina<head> modifica del tipo, segui la procedura riportata di seguito.

Seleziona Pagina<head> come tipo di modifica.
Aggiungere il codice personalizzato in Contenuto casella.

ATTENZIONE

Puoi aggiungere solo <script> e <style> elementi al <head> sezione. L’aggiunta di tag <div> e di altri elementi potrebbe causare la comparsa di elementi <head> rimanenti nel <body>.
Fai clic su Opzioni di modifica avanzate pulsante. Viene aperto l’editor espressioni.

Puoi sfruttare Journey Optimizer Editor espressioni con tutte le sue funzionalità di personalizzazione e authoring. Ulteriori informazioni

Esempi di codice personalizzato

È possibile utilizzare Pagina<head> tipo di modifica in:

Utilizza JavaScript in linea o collega a un file JavaScript esterno.

Ad esempio, per modificare il colore di un elemento:
```
<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:
```
<style>
.overlay
{ position: absolute; top:0; left: 0; right: 0; bottom: 0; background: red; }
</style>
```

Best practice per il codice personalizzato

Racchiudi sempre il codice personalizzato in un elemento.

Ad esempio:

<script>
// Code goes here
</script>

Nel caso in cui siano necessarie modifiche, apporta modifiche all’interno del contenitore.

Se non è più necessario il codice personalizzato, è sufficiente lasciare vuoto questo contenitore, ma non rimuoverlo. In questo modo, non influisce sulle altre modifiche dell’esperienza.

Non eseguire azioni document.write negli script di codice personalizzato.

Gli script vengono eseguiti in modo asincrono. Questo causa spesso la visualizzazione delle azioni document.write nella posizione sbagliata della pagina. Non è consigliabile utilizzare document.write negli script creati nel codice personalizzato.

Se crei un elemento e lo modifichi, non eliminare l’elemento originale.

Ogni modifica crea un nuovo elemento nel Modifiche pannello. La seconda azione modifica l'elemento 1: se lo elimini, questa azione non avrà più niente da modificare, risultando nella mancata applicazione della modifica.

Presta attenzione quando utilizzi Pagina <head>tipo di modifica per due campagne che influiscono sullo stesso URL.

Se si utilizza Pagina<head> tipo di modifica per due campagne che influiscono sullo stesso URL, il codice 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.

Pagina precedente

Gestire le modifiche web

Utilizzare il riquadro Modifiche