Pop-up-Fenster hinzufügen

Wix Header Wix Header Wix Header

Sie sind Fluch und Segen auf einer Website zu gleich: sogenannte „Pop-ups“. Ein Pop-up ist ein Fenster, das plötzlich auftaucht (englisch „to pop up“) und dabei die eigentliche Website quasi überdeckt. Solch ein visuelles Element wird in der Regel eingesetzt, um zusätzliche Inhalte anzuzeigen oder eine bestimmte Interaktion abzufragen.


Für den gemeinen Nutzer können solche Pop-up Fenster ein Fluch sein, vor allem wenn sie unerwünschte Werbung beinhalten und es nicht auf den ersten Blick klar ist, wie man diese Fenster wieder schließen kann. Clever eingesetzt, kann die Funktion eines Pop-up Fensters jedoch auch ein Segen sein – sowohl für Website-Betreiber als auch für die Seitenbesucher.


Zum Beispiel, wenn dadurch die Aufmerksamkeit der Besucher auf bestimmte exklusive Dinge geleitet wird: Sei es, um über wichtige Änderungen oder neue Angebote zu informieren, Besucher zu einer bestimmten Seite zu leiten oder diese dazu aufzufordern, sich in einem Newsletter einzutragen. Daher ist ein wichtiger Rat bei Pop-up Fenstern: Weniger ist mehr. Sonst sind die Besucher schnell genervt und kommen nicht mehr wieder.


Wix bietet hierfür die App „Lumifish Pop-Up“ an. In der folgenden Anleitung zeigen wir Dir am Beispiel dieser App, wie Du eine Pop-Up-Funktion auf Deiner Website hinzufügst. Dabei wird vorausgesetzt, dass Du bereits angefangen hast, eine Website bei Wix zu erstellen.

Aufwand im Überblick:
Mit Zusatzkosten verbunden?
Nein
Schwierigkeitsgrad?
Sehr einfach
Zeitaufwand
5 Minuten

1 App hinzufügen

Id 739 01 Bearbeitungsmodus Id 739 01 Bearbeitungsmodus Id 739 01 Bearbeitungsmodus

Melde Dich mit Deinen Zugangsdaten bei Wix an und gehe in den Bearbeitungsbereich Deiner Website (Website-Editor). Auf der linken Seite findest Du sechs Symbol-Buttons (runde Schaltflächen, die per Überfahrt mit dem Mauszeiger aufklappen). Klicke auf das dritte Symbol („App Markt“) um den Wix App Markt zu öffnen. Gib nun in das Suchfeld den Begriff „Pop up“ ein und klicke auf die Lupe.

Id 739 02 Wix App Markt Id 739 02 Wix App Markt Id 739 02 Wix App Markt

Als Suchergebnis wird Dir unter anderem die App „Lumifish Pop-Up“ angezeigt. Klicke auf den Button „ + Hinzufügen“ auf der rechten Seite.


2 Pop-Up Fenster bearbeiten

Id 739 03 Pop Up Id 739 03 Pop Up Id 739 03 Pop Up

Das Pop-up Fenster erscheint nun in der Ecke unten rechts. Um das Fenster zu bearbeiten, kannst Du mit der Maus einen Doppelklick auf das Pop-up Fenster direkt machen, oder Du klickst auf den Button „Einstellungen“.

Id 739 04 Einstellungen Id 739 04 Einstellungen Id 739 04 Einstellungen

Es öffnet sich dann ein neues Fenster, wo Du verschiedene Änderungen vornehmen kannst. Lass uns ein paar davon näher anschauen, sie sind sehr interessant und nützlich.


3 Einstellungen des Pop-Ups ändern

Id 739 05 Vorlagen Id 739 05 Vorlagen Id 739 05 Vorlagen

Schauen wir uns zunächst die Vorlagen an, die Du im Reiter „Vorlagen“ findest. Hier gibt es insgesamt 15 Vorlagen aus denen Du wählen kannst. Allerdings sind in der kostenfreien Version nur zwei Vorlagen verfügbar. Eine Vorschau erhältst Du, wenn Du mit der Maus über die Vorlage fährst. Dann verändert sich zeitgleich auch Dein Pop-up Fenster unten rechts im Bild. Willst Du die Vorlage aktivieren, reicht ein Mausklick auf die Vorlage. Du erkennst an dem grünen Rand, welcher der Vorlagen aktiviert ist.

Hinweis: Willst Du eine der Premium-Vorlagen verwenden (erkennbar an dem lilafarbenen Symbol an der Vorlage), musst Du einen Premium-Upgrade durchführen. Die Premium-Version gibt es ab 2,99 € pro Monat.


4 Inhalt bearbeiten

Id 739 06 Inhalt Id 739 06 Inhalt Id 739 06 Inhalt

Was in Deinem Pop-up Fenster drin stehen soll, das kannst Du im Reiter „Inhalt“ bearbeiten. Hier hast Du die Möglichkeit, einen Titel, einen Haupttext und einen Hilfstext zu verfassen. Willst Du darüber hinaus bestimmte Zusatzoptionen innerhalb des Pop-up Fensters, wie zum Beispiel das Hinzufügen eines Links oder das Sammeln von E-Mailadressen für einen Newsletter, musst Du wiederum den Tarif upgraden. Das gleiche gilt für das Verwenden eines anderen Bildes im Hintergrund oder das Anzeigen oder Ändern des Symbols.

Unter dem Reiter „Einstellungen“ kannst Du nun auswählen, wie, wann, wo und wie oft das Pop-up-Fenster auftauchen soll. Auch hier empfiehlt sich ein Upgrade zum kostenpflichtigen Tarif, da dadurch viel mehr Möglichkeiten entstehen: Beispielsweise ein Ablaufdatum des Pop-ups festzulegen oder die Dauer des Erscheinens des Pop-up Fensters. Auch auf welchen Seiten das Pop-up angezeigt werden soll, kann dann hier eingestellt werden.


Bei den Reitern „Farben“ und „Schriftarten“ kannst Du das Pop-Up ganz nach Deinem Geschmack beliebig ändern.

Id 739 07 Mobile Pop Up Id 739 07 Mobile Pop Up Id 739 07 Mobile Pop Up

Willst Du, dass Dein Pop-up Fenster auch auf mobilen Endgeräten angezeigt wird, dann klicke auf den Reiter „Mobil“ und auf den Button „Popup-Widget zur Mobil-Website hinzufügen“. Es öffnet sich ein kleineres Fenster namens „popup mobile“. Auch hier kannst Du die Einstellungen über den Button „Einstellungen“ ändern.

Hinweis: Alle Einstellungen und Inhalte Deines Pop-up Fensters werden auf das Mobil-Widget übertragen. Allerdings musst Du die Farben, die Schriftarten und die Schriftgrößen separat einstellen.


5 Speichern und veröffentlichen

Um zu sehen, wie das Pop-up Fenster auf Deiner Website aussehen wird, wechsle einfach in den „Vorschaumodus“ (oben rechts auf den Button „Vorschau“ klicken). Gefällt Dir, was Du siehst? Dann speichere und veröffentliche Deine Seite. Deine Seite verfügt nun über ein Pop-up Fenster.


Der Autor
Soeren Theussig Soeren Theussig Soeren Theussig
Sören Theussig
Ich arbeite seit 2012 als (fester und freier) Online- und Social-Media-Redakteur und verfasse Artikel über innovative Technologien und Web-Trends.