# Erste Smart Page (https://webmetic.de/docs/smart-pages/erste-smart-page)

In dieser Anleitung personalisieren Sie eine Seite Ihrer Website von Anfang bis Ende. Am Ende haben Sie:

- eine Smart Page für eine Seite Ihrer Website, im Status **Live**
- mindestens ein Element, dessen Text sich für erkannte Unternehmen ändert
- den Smart-Pages-Code auf Ihrer Website
- einen Test auf Ihrer echten Seite

![Die Seite von Nordhafen Anlagenbau mit den Texten für Bergquell Mineralbrunnen und der eingeklappten Testbox](https://webmetic.de/docs/media/de/light/smart-pages-ergebnis.webp)

## Bevor Sie beginnen [#bevor-sie-beginnen]

- **Plan**: In jedem Plan können Sie Smart Pages entwerfen, in der Vorschau ansehen und auf der Website testen. Live schalten und die Methode **KI-Text pro Unternehmen** wählen können Sie nur in der Testphase, im Plan Growth und in Enterprise. White-Label-Kunden eines Partners sehen den Tab nicht.
- **Rechte**: Jeder Benutzer Ihres Kontos kann Smart Pages anlegen, bearbeiten, live schalten und löschen, auch ohne Admin-Rechte.
- **Kosten**: Smart Pages kosten keine Credits.
- **Smart Page**: Die Seite, die Sie personalisieren, muss öffentlich erreichbar sein und zu der Website gehören, die Sie im Dashboard gewählt haben. Subdomains dieser Website sind ebenfalls möglich.
- **Bildschirm**: Der Editor braucht einen Bildschirm ab 1.024 Pixel Breite. Auf kleineren Bildschirmen sehen Sie nur die Liste Ihrer Smart Pages.
- **Tracking-Code**: Der Tracking-Code ist nur für die Vergleichszahlen der [Auswertung](https://webmetic.de/docs/smart-pages/auswertung) nötig, nicht für den Austausch der Texte.

## 1. Smart Pages öffnen [#1-smart-pages-öffnen]

Die Übersicht [Smart Pages](https://webmetic.de/docs/smart-pages) beschreibt, wo Sie den Tab auf jedem Gerät finden. So öffnen Sie die Liste Ihrer Smart Pages:

1. Klicken Sie oben auf den Tab [**Smart Pages**](https://app.webmetic.de/?menu=smart_pages). Webmetic zeigt die Liste Ihrer Smart Pages.
2. Wenn Sie mehrere Websites haben, wählen Sie oben die Website, auf der Ihre Seite liegt.

In einem schmaleren Fenster zeigt der Tab nur sein Symbol und den Namen erst, wenn Sie darauf zeigen. Auf dem Smartphone wählen Sie **Smart Pages** in der Auswahlliste oben.

## 2. Seite aus einer URL anlegen [#2-seite-aus-einer-url-anlegen]

Eine Smart Page gehört zu genau einer Seitenadresse. Webmetic lädt eine Kopie dieser Seite in den [Editor](https://webmetic.de/docs/smart-pages/editor), und Ihre Website ändert sich dabei nicht.

1. Klicken Sie auf **Neue Smart Page**. Der Dialog **Neue Smart Page** öffnet sich.
2. Ergänzen Sie unter **URL der Unterseite** hinter Ihrer Domain den Pfad, zum Beispiel `leistungen`. Für die Startseite lassen Sie das Feld unverändert.
3. Klicken Sie auf **Seite laden & scannen**. Webmetic legt die Smart Page als **Entwurf** an und öffnet den Editor.

![Der Dialog Neue Smart Page mit ausgefüllter URL der Unterseite](https://webmetic.de/docs/media/de/light/smart-pages-neue-seite.webp)

Beim ersten Öffnen lädt Webmetic die Seite, und ein Countdown zeigt die Wartezeit. Wenn sich die Seite nicht laden lässt, prüfen Sie, ob die URL öffentlich erreichbar ist, und klicken Sie auf **Erneut versuchen**.

## 3. Erkannte Elemente prüfen [#3-erkannte-elemente-prüfen]

Elemente sind die Texte, die Webmetic austauscht, aber keine Bilder. Auf einer neuen Smart Page markiert Webmetic bis zu drei Elemente: die Hauptüberschrift, den ersten längeren Absatz darunter und einen kurzen Button oder Link. Mehr dazu unter [Editor](https://webmetic.de/docs/smart-pages/editor).

1. Klicken Sie in der Vorschau auf ein markiertes Element oder wählen Sie es rechts unter **Element auswählen** aus.
2. Optional: Klicken Sie in der Vorschau auf einen anderen Text, um ihn als Element hinzuzufügen.

![Der Editor mit drei vorgeschlagenen Elementen](https://webmetic.de/docs/media/de/light/smart-pages-elemente-erkannt.webp)

Wählen Sie Texte ohne Links und ohne Fettdruck im Text, denn beim Austausch geht diese Formatierung verloren.

## 4. Neuen Text für ein Element festlegen [#4-neuen-text-für-ein-element-festlegen]

In der Seitenleiste fragt Webmetic: **Wie soll der neue Inhalt entstehen?** Für jedes Element wählen Sie eine der beiden Methoden, die [KI-Text pro Unternehmen](https://webmetic.de/docs/smart-pages/ki-text-pro-unternehmen) und [Zielgruppen](https://webmetic.de/docs/smart-pages/zielgruppen) ausführlich beschreiben:

- **KI-Text pro Unternehmen**: Webmetic schreibt für jedes erkannte Unternehmen eine eigene Version. Diese Methode steht für Texte ab 45 Zeichen bereit, nicht für sehr lange Texte und nicht für Buttons und Links.
- **Eigener Text pro Zielgruppe**: Sie schreiben den Text selbst und legen fest, welche Zielgruppe ihn sieht.

![Die Seitenleiste mit den Methoden KI-Text pro Unternehmen und Eigener Text pro Zielgruppe](https://webmetic.de/docs/media/de/light/smart-pages-methode.webp)

So legen Sie einen Text mit **KI-Text pro Unternehmen** fest:

1. Klicken Sie auf **KI-Text pro Unternehmen**.
2. Wählen Sie oben unter **Vorschau als** ein Unternehmen aus.
3. Klicken Sie auf die Schaltfläche **Vorschau für** mit dem Namen des Unternehmens. Die Vorschau zeigt den Text, den dieses Unternehmen auf Ihrer Seite liest, sofern die automatische Prüfung ihn nicht verwirft.
4. Klicken Sie auf **Personalisierung speichern**.

Niemand prüft die Texte vor der Auslieferung. Webmetic prüft jeden Text danach automatisch und zeigt bei einem Fehler wieder den Originaltext.

So legen Sie einen Text mit **Eigener Text pro Zielgruppe** fest:

1. Klicken Sie auf **Eigener Text pro Zielgruppe**.
2. Wählen Sie unter **Wer soll diesen Text sehen?** eine Zielgruppe aus oder klicken Sie auf **+ Neue Zielgruppe anlegen**.
3. Geben Sie unter **Welcher Inhalt soll stattdessen angezeigt werden?** Ihren Text ein.
4. Klicken Sie auf **Text speichern**.

Wenn Sie oben unter **Vorschau als** ein Unternehmen auswählen, sehen Sie das Ergebnis, und mit **Original anzeigen** schalten Sie zurück.

## 5. Smart-Pages-Code einbinden [#5-smart-pages-code-einbinden]

Der Smart-Pages-Code tauscht die Texte auf Ihrer Website aus und ist getrennt vom Tracking-Code. Ohne ihn zeigen weder der Test noch die live geschaltete Seite Ihre Texte. Mehr dazu unter [Smart Pages einbinden](https://webmetic.de/docs/smart-pages/einbinden).

1. Klicken Sie im Editor oben auf **Integration**. Der Dialog **Smart Pages einbinden** öffnet sich.
2. Kopieren Sie den Code im Dialog.
3. Fügen Sie ihn in den Kopfbereich jeder Seite mit einer Smart Page ein, möglichst als erstes Skript. Sonst geben Sie den Code an die Person, die Ihre Website betreut.
4. Klicken Sie auf **Integration prüfen**. Wenn alles richtig ist, zeigt Webmetic nach bis zu einer Minute die Meldung **Snippet korrekt eingebunden**.

Das WordPress-Plugin und die Vorlage für den Google Tag Manager bauen nur den Tracking-Code ein, nicht den Smart-Pages-Code.

## 6. Auf der Website testen [#6-auf-der-website-testen]

Der Test zeigt Ihre Texte auf der echten Website, auch für einen Entwurf und in jedem Plan. Mehr dazu unter [Testen und live schalten](https://webmetic.de/docs/smart-pages/testen-und-live-schalten).

1. Klicken Sie oben auf **Auf der Seite testen**. Ihre Seite öffnet sich mit einem Test-Link in einem neuen Tab.
2. Prüfen Sie auf der Seite die Testbox von Webmetic, die das erkannte Unternehmen, die passende Zielgruppe und die Zahl der geänderten Texte zeigt.
3. Optional: Wählen Sie in der Auswahlliste der Testbox eines der erkannten Unternehmen Ihrer Website aus. Die Seite lädt neu und zeigt die Texte für dieses Unternehmen.

Da der Test-Link keinen Login braucht, kann ihn jeder, der den Link kennt, 10 Stunden lang öffnen. Testbesuche zählen nicht in der Auswertung.

## 7. Smart Page live schalten [#7-smart-page-live-schalten]

Solange Ihr Plan Smart Pages enthält, führt kein Weg zurück zum Entwurf. Sie können einzelne Texte pausieren, während die Seite live bleibt. Wenn Sie die Smart Page ganz stoppen möchten, bleibt nur das Löschen. Mehr dazu unter [Testen und live schalten](https://webmetic.de/docs/smart-pages/testen-und-live-schalten).

In Free und Starter steht statt **Live schalten** die Schaltfläche **Veröffentlichen ab Growth**.

1. Klicken Sie oben auf **Live schalten**. Der Dialog **Prüfen & live schalten** zeigt jedes Element mit dem neuen Inhalt und gibt an, wer ihn sieht.
2. Klicken Sie auf **Smart Page live schalten**. Die Smart Page steht jetzt auf **Live**.

![Der Dialog Prüfen & live schalten mit aktiven und pausierten Texten](https://webmetic.de/docs/media/de/light/smart-pages-pruefen-live.webp)

Wenn Sie später etwas ändern, speichern Sie die Änderung im Editor und müssen die Seite nicht erneut live schalten. Ihre Besucher sehen die Änderungen nach kurzer Zeit.

## Was Sie eingerichtet haben [#was-sie-eingerichtet-haben]

- Ihre Smart Page ist live und gilt für genau eine Seitenadresse.
- Erkannte Unternehmen lesen dort einen eigenen Text.
- Besucher ohne erkanntes Unternehmen sehen das Original.
- Der Smart-Pages-Code läuft auf Ihrer Website.

## Nächste Schritte [#nächste-schritte]

- [Zielgruppen](https://webmetic.de/docs/smart-pages/zielgruppen): Texte nach Branche, Größe, Region oder Kampagne unterscheiden.
- [Auswertung](https://webmetic.de/docs/smart-pages/auswertung): Sehen, wie oft Ihre Texte erscheinen und wie die Seite im Vergleich zum Original abschneidet.