Modifica l'HTML e il CSS del tuo widget o microsite per Advocate

Puoi personalizzare i tuoi widget Advocate e il microsito con HTML e CSS aggiuntivi per allinearli meglio all’aspetto e allo stile del tuo brand. Utilizzando l’editor HTML integrato di Advocate, puoi aggiungere struttura, stile e persino sovrascrivere alcuni componenti predefiniti per una personalizzazione più avanzata.

Nota: La modifica HTML/CSS personalizzata è disponibile solo per specifiche edizioni di Advocate. Contatta supporto per aggiornare il tuo account e accedere a questa funzionalità.

Perché usare HTML o CSS personalizzati?

L'HTML personalizzato e il CSS inline ti consentono di:

• Allinearti più da vicino alle linee guida del brand della tua azienda
• Riformattare layout e spaziatura
• Applicare stili oltre quelli disponibili nell'editor predefinito
• Sovrascrivere lo stile di alcuni componenti del widget o del microsito

Importante: Il nostro team di supporto fornisce assistenza limitata per i problemi introdotti da codice personalizzato. Se non sei sicuro, ti consigliamo di collaborare con il tuo team di implementazione Advocate o con il team post-lancio.

Modifica l'HTML o il CSS

Modifica il tuo microsito

Puoi modificare l'HTML o il CSS per apportare ulteriori personalizzazioni al tuo microsito utilizzando l'editor HTML integrato. Sebbene l'editor HTML consenta una maggiore flessibilità nella progettazione del microsito, tieni presente che non siamo in grado di risolvere eventuali problemi relativi alle modifiche apportate con HTML o CSS personalizzati.

1. Nel menu di navigazione a sinistra, seleziona [Engage] → Contenuto.
2. Sulla scheda del microsito, seleziona Modifica contenuto.
3. Nella scheda Microsito, seleziona il layout o la pagina di cui desideri modificare il codice.
4. Seleziona [Visualizzazione codice] nella barra dei menu in alto.
5. Aggiungi o modifica HTML e CSS secondo necessità.
6. Il CSS può essere aggiunto in tre modi:

   • Importando un foglio di stile CSS esterno
   • Nella parte superiore della pagina in un <style> tag:

   <style>
     p {
       color: blue;
     }
   
     .exampleClass {
       color: green;
       font-size: 25px;
       text-align: center;
     }
   
     #exampleId {
       color: red;
       font-size: 30px;
     }
   </style> 

   • In linea, per applicare uno stile a uno specifico elemento HTML:

   <h3 style="font-size:30px;color:blue;">Ricevi una ricompensa quando il tuo amico utilizza il nostro prodotto</h3> 

7. Seleziona [Pennello] per visualizzare in anteprima gli aggiornamenti.
8. Seleziona Salva bozza per salvare, oppure Pubblica per rendere effettive le modifiche.

Modifica il tuo widget

Modifica i componenti usando le parti CSS

Alcuni componenti integrati nel tuo widget o microsito non possono essere completamente stilizzati tramite l'editor visuale. In alcuni casi, puoi sovrascriverne l'aspetto usando le parti CSS, che consentono un controllo più granulare.

Se desideri apportare aggiornamenti di stile avanzati, il team di impact.com può consigliarti su ciò che è possibile e condividere eventuali selettori di parti CSS pertinenti. Se sei interessato a modificare i componenti con le parti CSS, contatta il tuo team di implementazione Advocate o il team di supporto post-lancio.