# Überblick über den Widget-Editor

Ihr Advocate-Programm bietet einen Pick-and-Plop-Editor, mit dem Sie das Aussehen und den Inhalt der Widgets, die Ihren Kundenadvokaten präsentiert werden, anpassen können.

#### Widget-Editor-Oberfläche

Der Self-Service-Widget-Editor hat vier Hauptbereiche:

<div data-with-frame="true"><figure><img src="https://1698965099-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="Obere Menüleiste" %}
Die Menüleiste oben auf der Seite ist der Ort, an dem Sie Aktionen rückgängig machen, den HTML-Code anzeigen und das fertige Widget in der Vorschau ansehen können. Verwenden Sie die Symbole für Desktop, Tablet oder Mobilgerät, um zu sehen, wie Ihr Widget auf Geräten mit unterschiedlichen Bildschirmgrößen angezeigt wird.
{% endtab %}

{% tab title="Leinwand" %}
Die Leinwand zeigt alle Komponenten, die Ihr Widget ausmachen. Sie können einzelne Komponenten auswählen, um sie zu bearbeiten, oder neue hinzufügen und auf einen Blick sehen, wie sie für Ihre Teilnehmer angezeigt werden.
{% endtab %}

{% tab title="Linkes Ausklappmenü" %}
Das linke Ausklapp-Einstellungsmenü ist ein zusammenklappbares Panel links von der Leinwand. Hier können Sie auswählen **Ebenen** um eine detaillierte Ansicht aller Komponenten in Ihrem Widget zu sehen, oder wählen Sie **Vorlagen** um eines unserer vorgefertigten Widgets zu verwenden. Die **Einstellungen** Taste führt Sie zum Untermenü der Paketinstallation.

Für noch weitergehende Gestaltung auf Markenebene wählen Sie die Option Widget-Stil. Siehe [Widgets und Microsites mit dem Content-Editor anpassen](https://help.impact.com/brand/de/advocate-program/manage-advocate-participant-experiences/customize-widgets-and-microsites-with-the-content-editor) für weitere Informationen zu den Ihnen zur Verfügung stehenden Stiloptionen.
{% endtab %}

{% tab title="Komponente" %}
Das Komponentenmenü ist ein Panel rechts von der Leinwand. Verwenden Sie die **Fügen Sie** Registerkarte, um neue Komponenten in die Leinwand einzufügen, und verwenden Sie die **Bearbeiten** Registerkarte, um Anpassungen an bereits vorhandenen Elementen vorzunehmen.
{% endtab %}
{% endtabs %}

#### Fehlerbehebung

Das Widget verfügt über zwei Validierungsebenen, um Fehler bei der Platzierung von Komponenten und deren Eigenschaften zu überprüfen. Häufige Gründe für eine Fehlermeldung sind:

* Ein erforderliches Feld fehlt
* Auswahl einer ungültigen Farbe
* Eingabe einer ungültigen URL

Wenn Sie ungelöste Fehler haben, wird oben rechts auf der Leinwand eine Warnmeldung angezeigt, die Sie darüber informiert, wie viele Fehler gefunden wurden.

<div data-with-frame="true"><figure><img src="https://1698965099-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>

Erfahren Sie mehr über [Programm-Widgets anpassen](https://help.impact.com/brand/de/advocate-program/manage-advocate-participant-experiences/widget-experiences/customize-program-widgets).

**Ungeklärte Fehlermeldungsdetails anzeigen**

1. Wählen Sie **Details** in der Warnmeldung für eine kurze Erklärung dessen, was schiefgelaufen ist.
2. Gehen Sie zur Komponente mit dem Fehler auf eine der folgenden Weisen:
   * Auswählen **Ebenen öffnen**
   * Auswählen der Fehlermeldungserklärung
3. Finden Sie die Komponente mit dem Fehler. Sie wird mit einem roten Ausrufezeichen-Symbol markiert sein.
4. Wählen Sie die Komponente aus, um die Eigenschaften in der **Bearbeiten** Leiste zu öffnen.
5. Nehmen Sie die erforderlichen Änderungen vor.
