Ein Popup für eine Inhaltsseite erstellen
In diesem Beitrag zeigen wir dir, wie du ein Popup für eine Inhaltsseite erstellen kannst. Wir zeigen dir, welche einzelnen Schritte dafür nötig sind, wie du dein Popup individuell gestalten und es vor allem auf der passenden Seite einbinden kannst.
Dauer: 6 Minuten
Zuerst musst du dich als Admin in der cloud software anmelden. Für das Popup müssen wir jetzt drei Schritte befolgen.
Schritt 1: Eine Inhaltsseite für das Popup erstellen
Dafür navigierst du dich im Backend deiner Seite zum Bereich “Webseite” und klickst auf “Seiten”. Wir zeigen dir anhand unserer bestehenden Beispielseite einmal, wie du die Popup-Seite aufbauen musst.
Zuerst legst du dir eine ganz normale Inhaltsseite mit den Infos und Namen an, die du verwenden willst. Nehmen wir mal an, wir wollen unseren Kunden via Popup mitteilen, dass wir bis Ende des Jahres 20% Rabatt auf Zimmerpflanzen gewähren. Dann würden wir unsere Seite so aufbauen:
- Name: Popup 20% auf Zimmerpflanzen
- Schlüssel: popup20prozentzimmerpflanzen
- URL: /popup-20prozent-auf-zimmerpflanzen
Anschließend kannst du dich in den Design-Modus der Seite navigieren und dein Popup individuell anpassen.
Du kannst das Popup genau so gestalten, wie eine normale Inhaltsseite. Wie du das machst, hast du vielleicht bereits in den Beiträgen “Inhaltsseiten befüllen und designen” und “Snippets für Inhaltsseiten einfach erklärt” gelernt. Falls nicht, kannst du dort nochmal nachsehen, wie du die verschiedenen Snippets verwendest.
Wir haben uns für unser Beispiel für eine klassische Kachel mit Hintergrund, Bild und Text entschieden. Du kannst also nun das Bild austauschen und hast dafür 3 Möglichkeiten. Entweder du lädst ein Foto von deinem Rechner hoch, oder du suchst dir ein Foto aus der Mediathek deiner Webseite aus. Oder: du stöberst in unserer Foto-Datenbank und fügst über “Extern hinzufügen” ein passendes Foto hinzu.
Außerdem kannst du den Text anpassen und so deine ganz eigenen Infos eingeben. Damit hast du die Möglichkeit, deine Kunden über Aktionen oder Termine zu informieren und mit einem passenden Popup Aufmerksamkeit zu generieren.
Wenn du mit der Gestaltung deines Popups fertig bist, speicherst und veröffentlichst du deine Anpassungen. Das ist wichtig, damit das Popup auch richtig angezeigt wird. Im Designmodus kannst du dein Popup später immer wieder anpassen und bearbeiten.
Schritt 2: Die Popup-Seite im Inhaltscontainer hinterlegen
Normalerweise solltest du den Popup-Inhaltscontainer bereits aus dem Template in deiner cloud software haben. Navigiere dich einmal in den Bereich “Inhalte” unter “Webseite” und such nach “Popup”. Sollte der Container bei dir nicht erscheinen, kannst du einfach einen leeren Container mit der Option eine Seite zu verlinken erstellen. Wie man Inhaltscontainer erstellt, hast du ja vielleicht bereits im Beitrag “Inhalte oder Container erstellen und bearbeiten” gelernt. Falls nicht, schau dort nochmal alle wichtigen Schritte nach.
Navigiere dich dann in die Inhalte des Containers. Ist hier bereits ein Eintrag, kannst du den Bestehenden einfach bearbeiten. Wenn nicht, legst du einfach einen neuen Inhalt mit Klick auf das “+” an. Wähle dann einfach nur unter “Seite” deine Seite aus, die du für das Popup vorhin erstellt hast. Mehr musst du hier nicht machen.
Hinterlege immer nur einen Eintrag je Inhaltscontainer. Oder vergib eine Gültigkeit für die unterschiedlichen Popups, denn das System kann immer nur ein Popup, also einen Inhalt gleichzeitig anzeigen.
Schritt 3: Das Popup-Snippet verwenden
Navigiere dich jetzt im Frontend auf die Seite, in der du das Popup einbinden willst. Wir nehmen für unser Beispiel mal unsere Startseite, weil das die klassische Wahl für ein Popup ist. Du kannst aber auch jede andere Seite nehmen.
Navigiere dich dann in den Designmodus und suche rechts in der Liste nach dem Popup-Snippet. Zieh es einfach an den Anfang deiner Seite und klicke auf den “Bearbeiten”-Button, um deinen Container auszuwählen. Das machst du jetzt, indem du bei “Container” auf “Wählen” klickst und den Popup-Container auswählst. Bei “Verzögerung” kannst du jetzt noch einstellen, wie schnell das Popup nach Öffnen der Startseite angezeigt werden soll. Denk dran, dass je nach Cookie-Einstellungen noch die Datenschutz-Infos und Einwilligungen aufploppen und wähle daher eine etwas längere Zeit für dein Popup, um den Kunden nicht mit sich öffnenden Fenstern zu nerven.
Dann kannst du auch schon auf “Speichern” klicken und anschließend die Seite veröffentlichen. Nachdem sich der Designmodus automatisch geschlossen hat, musst du die Seite einmal aktualisieren. Das machst du mit der Tastenkombination Strg und F5. Manchmal kann es sein, dass du den Cache noch löschen musst. Wie du den HTTP-Cache der Seite löschen kannst, erfährst du im Beitrag “Erste Schritte - Cache leeren”.
Und schon wird dein Popup angezeigt. Auf dieser Basis kannst du jede Menge unterschiedlicher Popups erstellen und für deine Bedürfnisse individuell anpassen.
Du möchtest deine Erfahrungen und Tipps mit uns teilen? Dann schreib uns gerne einen Kommentar. Wir sind schon ganz gespannt, was du uns zu erzälen hast!