# Erklärung von Komponentenbibliotheken

Komponenten sind die einzelnen Bausteine, wie Hero-Bilder und Aufgaben-Karten, aus denen Ihr Widget oder Ihre Microsite besteht. Alle unsere aktuellen Vorlagen werden von unseren Mint- und Bedrock-Komponentenbibliotheken unterstützt.

<details>

<summary>Mint-Komponenten</summary>

Widgets und Microsites, die mit Mint-Komponenten erstellt wurden, bieten Kundenbefürwortern die neuesten Advocate-Erlebnisse. Die meisten der aktuellen Vorlagen verwenden Mint-Komponenten. Wenn Sie sich nicht sicher sind, ob Sie die aktuelle Komponentenbibliothek verwenden, können Sie sie manuell überprüfen, um sicherzugehen, und Ihre Bibliothek bei Bedarf aktualisieren.

Um auf Mint-Komponenten für Ihr **Programm-Widget**:

1. Wählen Sie im linken Navigationsmenü ![](/files/8189ccdb3d6833e64eac05afbd5a6e7ceadce224) **\[Engage] → Inhalt**.
2. Wählen Sie **Widgets bearbeiten** auf dem *Widgets* Karte.
3. Wählen Sie den Namen des Widgets aus, das Sie bearbeiten möchten.
4. Wählen Sie im linken Seitenleistenmenü **Pakete**.
5. Wählen Sie ![](/files/2dce7a714de3b2540fb3c3421aa9c2d75fc643bd) **Paket hinzufügen**.
6. Wählen Sie **Hinzufügen** auf dem *Mint-Komponenten* Karte.

Um auf Mint-Komponenten für Ihr **Microsite**:

1. Wählen Sie im linken Navigationsmenü ![](/files/8189ccdb3d6833e64eac05afbd5a6e7ceadce224) **\[Engage] → Inhalt.**
2. Wählen Sie die **Einstellungen bearbeiten** Schaltfläche auf der *Microsite* Karte.
3. Unter dem *Site-Hosting* Überschrift navigieren Sie zu den *Pakete* Abschnitt.
4. Wählen Sie ![](/files/2dce7a714de3b2540fb3c3421aa9c2d75fc643bd) **Paket hinzufügen**.
5. Wählen Sie **Hinzufügen** auf dem *Mint-Komponenten* Karte.
6. Wählen Sie **Speichern**.

</details>

<details>

<summary>Bedrock-Komponenten</summary>

Alle Vorlagen, die von Mint-Komponenten unterstützt werden, haben auch das Bedrock-Komponentenpaket installiert. Bedrock-Komponenten sind für Teilnehmende nicht sichtbar, bieten aber die Möglichkeit, Ihrem Design erweiterte Logik hinzuzufügen. Sie können andere Komponenten bedingt anzeigen und festlegen, aus welchem Programm eine Komponente Daten bezieht. Sie finden das Bedrock-Komponentenpaket im *Erweiterte Komponenten* Abschnitt innerhalb der *Hinzufügen* Registerkarte im Widget- oder Microsite-Editor.

Im Bedrock-Komponentenpaket gibt es zwei Komponenten:

**Bedingter Abschnitt**

Die *bedingte Abschnitts* Komponente ermöglicht es Ihnen, bedingte Inhalte auf der Grundlage der E-Mail-Adresse, des Landes, des Segments oder eines benutzerdefinierten Felds eines Teilnehmenden einzubinden. Fügen Sie einen JSONata-Ausdruck in das *Bedingung* Feld ein, um die Anzeigebedingungen festzulegen. Verschieben Sie dann alle Inhalte, die für eine bestimmte Gruppe von Teilnehmenden angezeigt werden sollen, in den bedingten Abschnitt.

**Programmabschnitt**

Die *programmabschnitt* Komponente ermöglicht es Ihnen, die Programm-ID ihrer untergeordneten Komponenten zu überschreiben. Verwenden Sie sie, um Inhalte anzuzeigen, die nicht mit einem bestimmten Programm verknüpft sind. Die *Programmabschnitt* Komponente ist standardmäßig in den meisten Widget- und Microsite-Vorlagen enthalten.

</details>

<details>

<summary>Benutzerdefinierte Komponentenbibliotheken</summary>

Sie können Ihre eigenen Komponentenpakete erstellen und verwenden, um Ihr Advocate-Erlebnis weiter anzupassen. Diese Komponenten können zu jeder Vorlage hinzugefügt und neben den von Advocate bereitgestellten Komponenten verwendet werden.

Advocate-Widgets verwenden standardmäßiges HTML und [Webkomponenten](https://www.webcomponents.org/) . Um Ihre eigenen Komponenten in unserem Widget-Editor zu verwenden, müssen sie als Webkomponenten geschrieben sein.

Um mit dem Erstellen Ihres Widgets mit benutzerdefinierten Komponenten zu beginnen, installieren Sie Ihr benutzerdefiniertes Paket:

1. Wählen Sie im linken Navigationsmenü ![](/files/8189ccdb3d6833e64eac05afbd5a6e7ceadce224) **\[Engage] → Inhalt**.
2. Wählen Sie **Widgets bearbeiten** auf der Widgets-Karte.
3. Wählen Sie den Namen des Widgets aus, das Sie bearbeiten möchten.
4. Wählen Sie im linken Seitenleistenmenü **Pakete**.
5. Wählen Sie ![](/files/2dce7a714de3b2540fb3c3421aa9c2d75fc643bd) **Paket hinzufügen**.
6. Wählen Sie ![](/files/2dce7a714de3b2540fb3c3421aa9c2d75fc643bd) **Aus NPM hinzufügen**.
7. Geben Sie das Paket ein *Name*, *Version* und *Dateipfad*.
8. Wählen Sie **Hinzufügen**.

</details>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.impact.com/brand/de/woruber-mochten-sie-mehr-erfahren/advocate-program/manage-advocate-participant-experiences/component-libraries-explained.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
