> For the complete documentation index, see [llms.txt](https://help.impact.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.impact.com/brand/it/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/edit-your-widget-or-microsite-html-and-css-for-advocate.md).
# Modifica l'HTML e il CSS del tuo widget o microsito per Advocate
Puoi personalizzare i 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 sostituire alcuni componenti predefiniti per una personalizzazione più approfondita.
{% hint style="info" %}
**Nota**: La modifica personalizzata di HTML/CSS è disponibile solo per alcune edizioni di Advocate. Contatta [supporto](mailto:saasquatch-support@impact.com) per aggiornare il tuo account e accedere a questa funzionalità.
{% endhint %}
#### Perché usare HTML o CSS personalizzati?
HTML personalizzato e CSS inline ti consentono di:
* Allinearti più da vicino alle linee guida del brand della tua azienda
* Riformattare il layout e la spaziatura
* Applicare stili oltre quelli disponibili nell'editor predefinito
* Sostituire lo stile di componenti selezionati del widget o del microsito
{% hint style="warning" %}
**Importante**: Il nostro team di supporto fornisce assistenza limitata per problemi introdotti da codice personalizzato. Se non sei sicuro, ti consigliamo di lavorare con il tuo team di implementazione di Advocate o il team post-lancio.
{% endhint %}
#### Modifica l'HTML o il CSS
{% tabs %}
{% tab title="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 problemi relativi ad eventuali modifiche apportate con HTML o CSS personalizzati.
1. Nel menu di navigazione a sinistra, seleziona ![\[Engage\] v2](https://paligoapp-cdn-eu1.s3.eu-west-1.amazonaws.com/impact/attachments/f01cdffa431a4d75ff09c130b66974d4-aa671735ec2b65af79961eaf59ab60af.svg) **\[Engage] → Contenuti**.
2. Nel riquadro del microsito, seleziona **Modifica contenuto**.
3. Nella scheda Microsite, seleziona il layout o la pagina di cui vuoi modificare il codice.
4. Seleziona  **\[Vista 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
* All'inizio della pagina in un `
```
* Inline, per applicare uno stile a uno specifico elemento HTML:
```programlisting
Ricevi una ricompensa quando il tuo amico usa il nostro prodotto
```
7. Seleziona  **\[Pennello]** per visualizzare l'anteprima degli aggiornamenti.
8. Seleziona **Salva bozza** per salvare, oppure **Pubblica** per rendere effettive le modifiche.
{% endtab %}
{% tab title="Modifica il tuo widget" %}
Puoi modificare l'HTML o il CSS per apportare ulteriori personalizzazioni al tuo widget utilizzando l'editor HTML integrato. Sebbene l'editor HTML consenta una maggiore flessibilità nella progettazione del widget, tieni presente che non siamo in grado di risolvere problemi relativi ad eventuali modifiche apportate con HTML o CSS personalizzati.
1. Nel menu di navigazione a sinistra, seleziona ![\[Engage\] v2](https://paligoapp-cdn-eu1.s3.eu-west-1.amazonaws.com/impact/attachments/f01cdffa431a4d75ff09c130b66974d4-aa671735ec2b65af79961eaf59ab60af.svg) **\[Engage] → Contenuti**.
2. Nella *Widget* scheda, seleziona **Modifica widget**.
3. In *Widget del programma*, seleziona il widget che vuoi modificare.
1. Nella barra dei menu superiore, seleziona  **\[Parentesi quadre]**.
2. Aggiungi o modifica il tuo HTML nel corpo della pagina.
3. Il CSS può essere aggiunto in tre modi:
* Importando un foglio di stile CSS esterno
* All'inizio della pagina in un `
```
* Inline, per applicare uno stile a uno specifico elemento HTML:
```programlisting
Ricevi una ricompensa quando il tuo amico usa il nostro prodotto
```
4. Seleziona  **\[Pennello]** per visualizzare l'anteprima degli aggiornamenti.
5. Seleziona **Salva bozza** per salvare, oppure **Pubblica** per rendere effettive le modifiche.
{% endtab %}
{% endtabs %}
#### **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 sostituirne l'aspetto utilizzando le parti CSS, che consentono un controllo più granulare.
Se desideri apportare aggiornamenti avanzati allo stile, il team di impact.com può consigliarti cosa è possibile fare 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 di Advocate o il team di supporto post-lancio.
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.
Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:
```
GET https://help.impact.com/brand/it/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/edit-your-widget-or-microsite-html-and-css-for-advocate.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
