# Panoramica dell'editor di widget

Il tuo programma Advocate offre un editor drag-and-drop che ti consente di personalizzare l'aspetto e i contenuti dei widget presentati ai tuoi sostenitori/clienti.

#### Interfaccia dell'editor dei widget

L'editor dei widget self-service ha quattro aree principali:

<div data-with-frame="true"><figure><img src="https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-f343272a45c0ebe8a90036c489173dbdc96cb155%2F692288b3de9942b25196de77402f176c0b491974bcb06f24239e69499e3dca88.jpg?alt=media" alt=""><figcaption></figcaption></figure></div>

{% tabs %}
{% tab title="Barra del menu superiore" %}
La barra del menu nella parte superiore della pagina è dove puoi annullare le azioni, visualizzare il codice HTML e anteporre il widget completato. Usa le icone desktop, tablet o mobile per vedere come apparirà il tuo widget su dispositivi con diverse dimensioni dello schermo.
{% endtab %}

{% tab title="Tela" %}
La tela mostra tutti i componenti che compongono il tuo widget. Puoi selezionare singoli componenti per modificarli, oppure aggiungerne di nuovi e vedere a colpo d'occhio come verranno visualizzati per i tuoi partecipanti.
{% endtab %}

{% tab title="Pannello a scomparsa sinistro" %}
Il menu delle impostazioni a scomparsa sinistro è un pannello comprimibile a sinistra della tela. Qui, puoi selezionare **Livelli** per vedere una vista dettagliata di tutti i componenti nel tuo widget, oppure selezionare **Modelli** per usare uno dei nostri widget predefiniti. Il **Impostazioni** pulsante ti porta al sottomenu di installazione del pacchetto.

Per un ulteriore livello di personalizzazione a livello di branding, seleziona l'opzione Stile del Widget. Visualizza [Personalizza widget e micrositi con l'editor di contenuti](https://help.impact.com/brand/it/cosa-vorresti-imparare/advocate-program/manage-advocate-participant-experiences/customize-widgets-and-microsites-with-the-content-editor) per maggiori informazioni sulle opzioni di stile disponibili.
{% endtab %}

{% tab title="Componente" %}
Il menu dei componenti è un pannello a destra della tela. Usa la **Aggiungi** scheda per inserire nuovi componenti nella tela, e usa la **Modifica** scheda per apportare modifiche a ciò che è già presente.
{% endtab %}
{% endtabs %}

#### Risoluzione dei problemi

Il widget dispone di due livelli di convalida per controllare errori nel posizionamento dei componenti e nelle proprietà dei componenti. Le ragioni comuni per ricevere un messaggio di errore includono:

* Mancata compilazione di un campo obbligatorio
* Scelta di un colore non valido
* Inserimento di un URL non valido

Quando ci sono errori non risolti, un messaggio di avviso viene visualizzato in alto a destra della tela per notificarti il numero di errori rilevati.

<div data-with-frame="true"><figure><img src="https://1043985218-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-511216419b1ffaa7cf19cda9c94f06eedbbdaabc%2Fb0790ca38faffb4d36e8ed5d551995d0231df77a9958ffb98e857740cd207626.jpg?alt=media" alt=""><figcaption></figcaption></figure></div>

Scopri di più su [Personalizzazione dei widget del programma](https://help.impact.com/brand/it/cosa-vorresti-imparare/advocate-program/manage-advocate-participant-experiences/widget-experiences/customize-program-widgets).

**Visualizza dettagli degli errori non risolti**

1. Seleziona **Dettagli** sul messaggio di avviso per una breve spiegazione di ciò che è andato storto.
2. Vai al componente con l'errore in uno dei seguenti modi:
   * Selezionando **Apri Livelli**
   * Selezionando il messaggio di spiegazione dell'errore
3. Trova il componente con l'errore. Sarà contrassegnato con un'icona di punto esclamativo rossa.
4. Seleziona il componente per aprire le proprietà nella **Modifica** barra.
5. Apporta le modifiche richieste.