--- title: "Ein Popup und seinen Teaser gestalten" description: "Wählen Sie den Popup-Typ, gestalten Sie Popup, Hintergrundüberlagerung und Schließen-Button und fügen Sie einen Teaser hinzu, der Besucher zum Öffnen einlädt." url: https://scratcher.io/de/help/sharing/popup-design-and-teaser language: de --- 1. [Hilfe-Center](https://scratcher.io/de/help) 2. [Veröffentlichen und teilen](https://scratcher.io/de/help/sharing) 3. Ein Popup und seinen Teaser gestalten # Ein Popup und seinen Teaser gestalten Wählen Sie den Popup-Typ, gestalten Sie Popup, Hintergrundüberlagerung und Schließen-Button und fügen Sie einen Teaser hinzu, der Besucher zum Öffnen einlädt. Eine Popup-Kampagne besteht aus zwei Teilen: dem Popup selbst und einem optionalen Teaser. Der Teaser ist ein kleines Banner auf Ihrer Website, etwa „Drehen und gewinnen 🎁“, das beim Anklicken das Popup öffnet. ## Das Popup gestalten 1. Klicken Sie über der Seite auf **Popup-Einstellungen** oder klicken Sie auf den Rand des Popups. 2. Legen Sie im Tab **Stile** unter **Popup** **Hintergrund**, **Hintergrundüberlagerung** (die abgedunkelte Ebene hinter dem Popup), **Rahmen**, **Größe**, **Form**, **Ausrichtung des Inhalts** und **Außenabstand** fest. Aktivieren Sie **Hintergrundüberlagerung deaktivieren**, wenn die Seite hinter dem Popup nicht abgedunkelt werden soll. 3. Legen Sie unter **Schließen-Button** seinen **Hintergrund**, die **Icon**-Farbe, **Größe**, Ecke (**Ausrichtung**) und **Außenabstand** fest. 4. Wählen Sie im Tab **Effekte**, wie sich das Popup öffnet und schließt, zum Beispiel **Einblenden** oder **Gleiten**. Die Popup-Add-ons: - **Teaser beim Schließen ausblenden**: „Den Teaser ebenfalls ausblenden, wenn dieses Popup geschlossen wird.“ - **Nach dem Absenden des Formulars ausblenden**: „Dieses Popup einem Besucher nicht erneut anzeigen, nachdem er darin ein Formular abgesendet hat.“ ## Popup-Typ und Position Öffnen Sie im Editor **Platzierung** unter **Layout**: - **Typ**: eine Leiste oben oder unten auf dem Bildschirm, ein Standard-Popup, ein Slider an der Seite oder eine ganze Seite. Ist ein Typ ausgegraut, enthält Ihr Plan ihn nicht. - **Ausrichtung**: Leisten können oben oder unten sein, Slider links oder rechts und Standard-Popups an jeder Stelle eines 3 × 3-Rasters. Wenn Sie ein neues Popup zum ersten Mal öffnen, bittet Scratcher Sie unter **Domain auswählen** um die Website, auf der es angezeigt werden soll. Sie können sie später unter **Domain** ändern. Siehe [Eine Kampagne als Popup anzeigen](https://scratcher.io/de/help/sharing/show-a-campaign-as-a-popup). ## Der Teaser Unter **Ablauf** zeigt die Zeile **Teaser** den Teaser. Ihr Menü **Aktionen** enthält: - **Teaser aktivieren** und **Teaser deaktivieren**. Bei einem deaktivierten Teaser steht **Teaser ist deaktiviert**. - **Teaser ändern**: ein anderes Teaser-Design wählen. - **Einstellungen**: die eigenen Einstellungen des Teasers (siehe unten). - **Teaser als Vorlage speichern**: den Teaser in anderen Popups wiederverwenden. Gestalten Sie den Teaser wie eine Seite: Klicken Sie auf seine Texte und Bilder, um sie zu ändern. ## Teaser-Einstellungen - **Aktion**: was beim Klick auf den Teaser passiert: **Popup anzeigen**, **Link** (bei Bedarf mit **Link in neuem Tab öffnen**) oder **Keine**. - **Auf Desktop ausblenden**, **Auf Tablets ausblenden**, **Auf Mobilgeräten ausblenden**. - **Stile**: **Hintergrund**, **Rahmen**, **Größe**, **Form**, **Ausrichtung des Inhalts**, Ecke (**Ausrichtung**) und **Außenabstand** des Teasers sowie sein eigener **Schließen-Button**. Der Teaser erscheint, sobald die Seite geladen ist. Die Auslöser unter **Anzeige** gelten nur für das Popup. Wenn ein Besucher den Teaser mit seinem Schließen-Button schließt, bleibt er für diesen Besucher ausgeblendet. ## Hintergrundbild in Popups Popups haben ein Element **Bildhintergrund**, das eine Seite des Popups mit einem Bild füllt. Legen Sie die **Höhe auf Mobilgeräten** fest, um zu steuern, wie viel vom Bildschirm es auf Smartphones einnimmt. ## Ein Popup über Ihren eigenen Button öffnen Mit dem Auslöser-Add-on **Klick-Auslöser** unter **Anzeige** öffnet sich das Popup, wenn jemand auf Ihrer Website auf ein Element klickt. Geben Sie den CSS-**Selektor** des Elements ein, zum Beispiel `.open-competition`. Fragen Sie Ihre Webentwicklerin oder Ihren Webentwickler, wenn Sie unsicher sind. ## Tipps - Halten Sie das Popup kurz: eine Überschrift, das Spiel und das Formular. Besucher entscheiden in Sekunden. - Testen Sie Popup und Teaser auf einem Smartphone. Nutzen Sie **Auf Mobilgeräten ausblenden** für einen Teaser, der dort zu viel Platz einnimmt. - Ein ganzseitiges Popup bekommt die meiste Aufmerksamkeit, setzen Sie es aber mit Bedacht ein, zum Beispiel mit **Exit-Intent** am Computer. Veröffentlichen und teilen - [Ihren Kampagnenlink und QR-Code teilen](https://scratcher.io/de/help/sharing/share-your-campaign-link) - [Eine Kampagne in sozialen Medien teilen](https://scratcher.io/de/help/sharing/share-on-social-media) - [Eine Kampagne auf Ihrer Website einbetten](https://scratcher.io/de/help/sharing/embed-on-your-website) - [Eine Kampagne als Popup anzeigen](https://scratcher.io/de/help/sharing/show-a-campaign-as-a-popup) - [Ein Popup und seinen Teaser gestalten](https://scratcher.io/de/help/sharing/popup-design-and-teaser) - [Die Webadresse Ihrer Kampagne wählen](https://scratcher.io/de/help/sharing/campaign-url-and-own-domain) - [E-Mails von Ihrer eigenen Domain senden](https://scratcher.io/de/help/sharing/email-sending-domain) - [Kampagnen mit Kampagnenzeitplänen rotieren](https://scratcher.io/de/help/sharing/campaign-schedules) ## Ähnliche Artikel - [So funktionieren die Element-Einstellungen](https://scratcher.io/de/help/elements/element-settings-basics): Die Tabs Inhalt, Stile, Einstellungen und Effekte, Größen, Formen, Rahmen, Farben und Hintergründe, Änderungen für Mobilgeräte und Add-ons. - [Eine Kampagne auf Ihrer Website einbetten](https://scratcher.io/de/help/sharing/embed-on-your-website): Binden Sie eine Kampagne mit dem Einbettungsskript oder einem iframe in eine Seite Ihrer Website ein, prüfen Sie, ob sie funktioniert, und beheben Sie häufige Probleme. - [Eine Kampagne als Popup anzeigen](https://scratcher.io/de/help/sharing/show-a-campaign-as-a-popup): Installieren Sie das Skript einmal, wählen Sie den Popup-Typ und legen Sie fest, auf welchen Seiten, wann, wie oft und für wen es erscheint. ## Brauchen Sie noch Hilfe? Echte Menschen helfen Ihnen gern. Wenn Sie Scratcher bereits nutzen, ist der Chat in der Plattform der schnellste Weg. - **[Chatten Sie mit uns](https://platform.scratcher.io/login)** Melden Sie sich an und klicken Sie unten rechts auf den Chat-Button. Rex antwortet sofort, und unser Team ist nur einen Klick entfernt. - **[Termin buchen](https://scratcher.io/de/book-a-meeting)** Ein kostenloser 30-minütiger Videocall mit unserem Team: eine Tour, Kampagnenideen oder Hilfe bei Ihrer Einrichtung. - **[Schreiben Sie uns](mailto:kontakt@scratcher.io)** Schreiben Sie an kontakt@scratcher.io, und wir melden uns bei Ihnen.