# Passen Sie Microsite-Layouts & Seiten an

Microsites sind einer der wichtigsten Berührungspunkte für Teilnehmer Ihres Empfehlungsprogramms. Dieser Hilfsartikel erklärt, wie Sie das *Microsite-Editor* verwenden, um Ihr bestehendes Microsite in einen Raum zu verwandeln, der Ihre Marke widerspiegelt und ein ansprechendes Erlebnis für Ihre Endbenutzer bietet.

Wenn Sie noch nicht [eingestellt haben](https://help.impact.com/brand/de/advocate-program/manage-advocate-participant-experiences/microsite-experiences/set-up-a-microsite) ein Microsite, müssen Sie dies zuerst tun.

1. Wählen Sie im linken Navigationsmenü ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-230534471fef5f40808e921e41ee44e4a06ded03%2Fe6cb9548999afdc1ed3ce4942e4cb5b45b5cecbd323267aac2a7cd1915fccc09.svg?alt=media) **\[Engage] → Inhalte**.
2. Auf der *Microsite* Karte wählen Sie **Inhalt bearbeiten**.
   * Diese Aktion öffnet den Microsite-Editor und zeigt das *Microsite* Slideout an.
3. Verwenden Sie den Microsite-Editor, um Ihr Branding zu aktualisieren oder neue Inhalte wie Layouts und Seiten hinzuzufügen.

   <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-b86511b064633eb26a6b404d647528e31dcb5a12%2Fb13e0c9a76f7d38a693d8072ff7115433720c38466813323241c794fda4856ca.png?alt=media" alt=""><figcaption></figcaption></figure></div>

{% hint style="warning" %}
**Warnung:** Der Microsite-Editor speichert Ihre Änderungen nicht automatisch. Speichern Sie häufig, damit Sie Ihre Arbeit nicht verlieren.
{% endhint %}

{% stepper %}
{% step %}
**Schritt 1: Ändern Sie das Branding Ihres Microsite (optional)**

{% tabs %}
{% tab title="Farben und Schrift" %}
Ihr Basislayout enthält eine Brand-Container-Komponente, die die Schrift und Markenfarben Ihres Microsite steuert. Markenfarben werden auf verschiedene Teile der Microsite angewendet, einschließlich Hervorhebungsfarben und Schaltflächenfarben.

1. Im *Microsite* Slideout, wählen Sie das **Basislayout**.
2. Links, unter *Aktuelles Layout*, wählen Sie **Ebenen**.
3. Wählen Sie das **Markencontainer**.
4. Auf der rechten Seite, im *Markencontainer* Menü, bearbeiten Sie die **Markenfarbe** und **Markenschrift**.

   <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-f58dfdd168765b914fd22b232cabd8030450c27f%2F6f54642b7524983137442de4c4ecc2a20984c511b5e26423a5edadc0060f9a45.png?alt=media" alt="" width="223"><figcaption></figcaption></figure></div>
5. Wählen Sie **Speichern** in der oberen rechten Ecke.
   {% endtab %}

{% tab title="Seitenkopf" %}
Sie können ein klickbares Kopfzeilenbild hinzufügen, das Ihre Teilnehmer zu einer von Ihnen festgelegten Seite weiterleitet. Richten Sie es im Basislayout ein.

1. Im *Microsite* Slideout, wählen Sie das **Basislayout**.
2. Links, unter *Aktuelles Layout* oder *Aktuelle Seite*, wählen Sie **Ebenen**.
3. Auf der rechten Seite, im *Microsite Frame Header-Inhalt* Menü, geben Sie ein Bild an und passen Sie dessen Höhe und Breite nach Wunsch an.
4. Legen Sie den Weiterleitungspfad fest. Hierhin werden Ihre Teilnehmer weitergeleitet, wenn sie auf das Bild klicken.
5. Wählen Sie **Speichern**.
   {% endtab %}
   {% endtabs %}
   {% endstep %}

{% step %}
**Schritt 2: Erstellen Sie ein Layout oder eine Seite**

{% tabs %}
{% tab title="Seite hinzufügen" %}

1. Im *Microsite* Slideout, wählen Sie **Microsite**.
   * Diese Aktion öffnet die Strukturansicht Ihrer Microsite, die alle Layouts und Seiten anzeigt.
2. Wählen Sie das **Seite hinzufügen** Taste.
3. Optional können Sie das **Geerbtes Layout** Dropdown-Menü verwenden, um das Layout auszuwählen, das als übergeordnetes Layout fungieren soll.

   <div data-gb-custom-block data-tag="hint" data-style="info" class="hint hint-info"><p><strong>Beispiel:</strong> Wenn Sie eine Landingpage zu Ihrer Site hinzufügen möchten, die jeder sehen kann, unabhängig davon, ob er als Teilnehmer angemeldet ist, können Sie eine neue Seite innerhalb des Basislayouts einfügen.</p></div>
4. Geben Sie die **Seitentitel** oder Layoutname.
5. Optional passen Sie den **Seitenschlüssel** für Ihre Seite an. Ein Seitenschlüssel wird automatisch basierend auf dem Seitentitel generiert, kann jedoch bei Bedarf geändert werden.
6. Geben Sie die **URL** für Ihre Seite.
   * Fügen Sie einen Schrägstrich vor dem Namen ein, den Sie verwenden möchten, und verwenden Sie bei mehrteiligen URLs Bindestriche, z. B. `/company-info`.
7. Aus dem **Zugelassene Benutzer** Wählen Sie im Dropdown-Menü die Benutzergruppe aus, die auf die Seite zugreifen kann.
   * **Öffentlich:** Für jeden sichtbar.
   * **Verifiziert:** Nur angemeldete Teilnehmer.
   * **Unverifiziert:** Angemeldete Teilnehmer, die ihre E-Mail-Adressen nicht verifiziert haben.
8. Aus dem **Weiterleitung für nicht zugelassene Benutzer** Wählen Sie im Dropdown-Menü die Seite aus, an die nicht berechtigte Teilnehmer gesendet werden sollen.
9. Wählen Sie **Hinzufügen**.
10. Wählen Sie in der oberen rechten Ecke der Seite **Speichern**.
    {% endtab %}

{% tab title="Layout hinzufügen" %}

1. Im *Microsite* Slideout, wählen Sie **Microsite**.
   * Diese Aktion öffnet die Strukturansicht Ihrer Microsite, die alle Layouts und Seiten anzeigt.
2. Wählen Sie **Layout hinzufügen**.
3. Optional können Sie das **Geerbtes Layout** Dropdown-Menü, um das Layout auszuwählen, das als übergeordnetes Layout fungieren soll. Dies ist hauptsächlich zur Organisation der Site hilfreich.
4. Geben Sie die **Layoutname** für Ihr Layout.
5. Optional passen Sie den **Layout-Schlüssel** für Ihr Layout. Ein Layout-Schlüssel wird automatisch basierend auf dem Seitentitel generiert, kann aber bei Bedarf geändert werden.
6. Wählen Sie **Hinzufügen**.
7. Wählen Sie in der oberen rechten Ecke der Seite **Speichern**.
   {% endtab %}
   {% endtabs %}
   {% endstep %}

{% step %}
**Schritt 3: Wenden Sie eine Vorlage an**

Sie können eine Vorlage auf Ihr neues Layout oder Ihre neue Seite anwenden, wenn Sie nicht von Grund auf neu beginnen möchten.

1. Aus dem *Microsite* Slideout, verwenden Sie die Strukturansicht, um das Layout oder die Seite auszuwählen, für die Sie die Vorlage verwenden möchten.
2. Auf der linken Seite, unter *Aktuelles Layout* oder *Aktuelle Seite*, wählen Sie **Vorlagen**.
3. Durchsuchen Sie die verfügbaren Vorlagen und wählen Sie dann **Vorlage anwenden** auf der Karte der Vorlage, die Sie verwenden möchten.

   <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-a0bfe48f82a572dff145227f203272771f6b739a%2F259af004a6a8f554bcfff90975d56b1ec1ec45ce65356cd232fdd4a091cf8c48.jpg?alt=media" alt="" width="310"><figcaption></figcaption></figure></div>
4. Wählen Sie in der oberen rechten Ecke der Seite **Speichern**.
   {% endstep %}

{% step %}
**Schritt 4: Bearbeiten Sie die Seitenleiste des Microsite**

Dies wird empfohlen, wenn angemeldete Teilnehmer über das Navigationsmenü der Microsite-Seitenleiste auf eine Seite gelangen sollen. Diese Schritte zeigen Ihnen, wie Sie dies tun, können aber angepasst werden, wenn Sie einen Seitenleistenpunkt zu einem anderen Layout hinzufügen möchten.

1. Aus dem *Microsite* Slideout, wählen Sie **Angemeldet-Layouts** aus der Strukturansicht.
   * Wählen Sie ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-90673bb8db696bdefe7b207cfc07c46caf1d43f1%2Fce7a994978f06dd84cc6a31b890071502b4831990afd8fdd73f73c6d2e203660.png?alt=media) **\[Beenden-Symbol]** um das Slideout zu schließen und auf die Bearbeitungsfläche zuzugreifen.
2. Auf der rechten Seite, innerhalb des *Hinzufügen* Menüs, erweitern Sie die *Microsite-Komponenten* Kategorie, und wählen Sie dann **Seitenleisten-Element**.

   <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-87da46ebfa6e69752ed1c574a17d0036746d311d%2F125bfdb46d75238f2772523663950b1311a17055d85a39bca25033bc56a45d5e.jpg?alt=media" alt=""><figcaption></figcaption></figure></div>
3. Innerhalb der Bearbeitungsfläche wählen Sie eine gültige Position, um das *Seitenleisten-Element* Komponente hinzuzufügen. Verfügbare Positionen sind durch eine **Zu Seitenleiste hinzufügen Inhalt** Meldung gekennzeichnet.
   * Auf kleineren Bildschirmen wählen Sie das ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-71ccc0ed9e3023e12691656e4a063341060fe3bd%2F69bc484dc36b22c013f4fde7e0360a7ae9b8d39164beff2b6fabc9ea6d0efb1d.svg?alt=media) **\[Hamburger-Menü]** um auf das **In die Seitenleiste hinzufügen Inhalt** Taste.
4. Auf der rechten Seite, innerhalb des *Bearbeiten* Menü zuzugreifen, wählen Sie ein **Symbol** und **Bezeichnung** aus, um die Seite darzustellen.
5. Aus dem **Navigationspfad** Wählen Sie im Dropdown-Menü den URL-Pfad der Seite aus, zu der die Benutzer geleitet werden sollen.
6. Wählen Sie in der oberen rechten Ecke der Seite **Speichern**.
   {% endstep %}

{% step %}
**Schritt 5: Vorschau und speichern**

{% tabs %}
{% tab title="Vorschau Ihres Microsite" %}
Sie können eine Vorschau anzeigen, wie die Microsite für Ihre Teilnehmer erscheinen wird.

1. Wechseln Sie in der oberen Menüleiste zwischen ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-9a50309ee9d0e10094bf68c9b9ae1999dbec4f48%2F7cf9c6c1f6544aa358de22e77201e216647a70ab22c854c02334f51f45892424.svg?alt=media) **\[Desktop]**, ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-02123f07d293035e9e37f19e086187c0e90e7dd0%2F1b889798dd233ebb71c2adcc44be0e2887772538ce7c6357d7ef1ea246c0e564.svg?alt=media) **\[Tablet]** oder ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-04b329f4eb244c77b35e32d9988afc78f428a88f%2Fe05ee6fbf869c562df0a7fbc8a38b177082975c06ddf6adcda9d4c00bd0e43ac.svg?alt=media) **\[Mobil]** um zu sehen, wie die Microsite auf jedem Gerät angezeigt wird.
2. Um die Vorschau zu betreten, wählen Sie ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-190c6a03e6a68d67509d00452b10fd803bee5c87%2F57c7cba09bd1b97dd75b7c245e517c8d1ca0469d7c57bdc13ee6e427b75a860a.svg?alt=media) **\[Ansicht]** aus der oberen Menüleiste.
3. Um zur Bearbeitungsoberfläche zurückzukehren, wählen Sie ![](https://1698965099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-60e9ace573178da411cb3be9c6f3b0f4b7e5b524%2F4094fadf599e544cfc618c18eb22087defdb9be38a580cd0041a242a88294e1e.svg?alt=media) **\[Bearbeiten]** aus der oberen Menüleiste.
   {% endtab %}

{% tab title="Speichern Sie Ihr Microsite" %}
Der Microsite-Editor speichert Ihre Änderungen nicht automatisch. Speichern Sie häufig, damit Sie Ihre Arbeit nicht verlieren.

1. Nachdem Sie alle relevanten Änderungen vorgenommen haben, wählen Sie **Speichern** in der oberen rechten Ecke.
2. Nach dem Speichern werden die Änderungen sofort in der Live-Version Ihrer Microsite angezeigt.
   {% endtab %}
   {% endtabs %}
   {% endstep %}
   {% endstepper %}

Lesen Sie unseren Artikel über [Widgets und Microsite-Komponenten erklärt](https://help.impact.com/brand/de/advocate-program/manage-advocate-participant-experiences/widget-and-microsite-components-explained) für mehr zu den Komponentenaspekten von Microsites und Widgets.
