Wix Editor: Ein Vollbild-Pop-up-Menü erstellen
4 min
In diesem Artikel
- Schritt 1 | Eine Lightbox zu deiner Website hinzufügen
- Schritt 2 | Dein Lightbox-Menü einrichten
- Schritt 3 | Einen Button hinzufügen, um das Menü zu öffnen
- Schritt 4 | Den Button von deiner mobilen Website ausblenden
Verwende eine Lightbox, um ein professionelles Vollbild-Pop-up-Menü zu erstellen. Wenn Besucher auf den Menü-Button klicken, öffnet sich das Menü über dem Inhalt deiner Website.
Schritt 1 | Eine Lightbox zu deiner Website hinzufügen
Beginne, indem du eine Lightbox aus dem Panel Elemente hinzufügen zu deiner Website hinzufügst. Diese wirst du später neu gestalten.
Um eine Lightbox hinzuzufügen:
- Öffne deinen Editor.
- Klicke auf der linken Seite des Editors auf Hinzufügen
. - Klicke auf Interaktiv.
- Wähle eine Lightbox aus, um sie zu deiner Website hinzuzufügen.
Schritt 2 | Dein Lightbox-Menü einrichten
Nachdem du eine Lightbox hinzugefügt hast, richte sie so ein, dass sie nicht jedes Mal automatisch angezeigt wird, wenn Besucher deine Website aufrufen. Gestalte dann die Lightbox nach deinen Wünschen und füge ein vertikales Menü hinzu.
Um die Lightbox einzurichten:
- Klicke in deinem″ Editor auf die Lightbox.
- Klicke auf das Symbol für Einstellungen
. - Benenne deine Lightbox in einen wiedererkennbaren Namen wie „Menü“ um.
- Wähle unter Lightbox automatisch anzeigen die Option Nein.
- Lösche alle Elemente innerhalb der Lightbox. Lösche nicht das „X“-Symbol.
- Füge deiner Lightbox ein vertikales Menü hinzu.
- Gestalte dein Menü. Wir empfehlen für das Menü große und zentrierte Schriftarten.
- Wenn du fertig bist, klicke oben auf Lightbox-Modus verlassen.
Tipp:
Du kannst auch den Hintergrund der Lightbox und die Hintergrund-Überlagerung anpassen, sodass sie zu deiner Website passen. Mache die Hintergründe leicht transparent, um einen tollen Effekt zu erzielen.
Schritt 3 | Einen Button hinzufügen, um das Menü zu öffnen
Nachdem deine Lightbox und das Menü fertig sind, füge einen Button hinzu, damit Besucher auf das Menü zugreifen können. Verlinke danach den Button mit der Lightbox.
Um einen Button hinzuzufügen:
- Klicke auf der linken Seite des Editors auf Hinzufügen .
- Wähle Dekorativ aus.
- Wähle Formen aus.
- Klicke auf Weitere Formen.
- Gib „Menü“ in das Suchfeld ein und drücke die Eingabetaste.
- Wähle ein Design für einen Menübutton aus und klicke auf Hinzufügen.
- Klicke in deinem Editor auf den Menü-Button.
- (Optional) Klicke auf das Symbol für Design
, um deinen Menü-Button zu gestalten. - Klicke auf das Symbol für Link
. - Wähle links die Option Lightbox aus.
- Wähle deine Lightbox aus dem Aufklappmenü aus.
- Klicke Fertig.
Tipps:
- Platziere den Menü-Button gut sichtbar auf deiner Website. Du kannst ihn in die Kopfzeile setzen, oder die Funktion Position fixieren verwenden, um ihn oben auf deiner Website zu fixieren. Wenn sich dein Menü-Button nicht in der Kopfzeile befindet, solltest du sicherstellen, dass er auf allen Seiten angezeigt wird.
- Du kannst auch deinen eigenen Menü-Button gestalten. Das kann ein Textbutton, ein Symbolbutton oder ein Button mit einer anderen Form sein – ganz nach deinen Vorstellungen. Hier siehst du einige Beispiele:
Schritt 4 | Den Button von deiner mobilen Website ausblenden
Blende den Button, den du gerade erstellt hast, auf deiner Mobile-Website aus, die bereits über ein voreingestelltes Vollbild-Menü verfügt.
Um den Button auszublenden:
- Öffne deinen Mobile-Editor.
- Klicke auf den Menübutton, der mit deiner Lightbox verknüpft ist.
- Klicke auf das Symbol für Ausblenden
.
