Elementor Tipps und Tricks
WPC - Dein WordPress Blog

Elementor Popup Menü für einen One Pager

Elementor Popup schließen nach dem Klick auf einen Link oder Button (Navigation One Pager)

Hier erfährst du, wie du ein Elementor Popup schließen kannst, nachdem der User einen Link oder einen Button auf dem Popup geklickt hat.

Für diesen Elementor Tipp nehmen wir Folgendes an:

Du hast ein Menü mit einem Elementor Popup erstellt. Nun möchtest du eine klassische Navigation für einen One Pager realisieren. Das bedeutet, du verlinkst die Buttons oder die Links auf dem Popup mit den entsprechenden Abschnitten auf der gleichen Seite und die Seite wird nach dem Klick nicht neu geladen. Weiterhin nehmen wir an, dass du diese Funktion bereits erfolgreich mit einer CSS ID und dem dazugehörigen #-Link umgesetzt hast. Wenn nicht, hilft dir eine kurze Google-Suche oder natürlich mein Elementor Kurs weiter.

Das Problem aber ist:

Nach dem Klick scrollt zwar die Seite zu dem richtigen Abschnitt aber das Popup verschwindet nicht – es bleibt weiterhin offen. Wie kannst du nun das Elementor Popup automatisch nach dem Klick schließen?

Vielen Dank an Steffen Wildt, dass er diesen Code hier auf dem WPC Blog gepostet hat.

Dafür fügst du einfach den folgenden Code in ein HTML Elementor Widget irgendwo auf deinem Popup ein. Hier ist der vollständige Code für ein Elementor Popup Menü bei einen One Pager Design:

<script>
document.addEventListener('DOMContentLoaded', function() {
  jQuery(function($){
    $(document).on('click','.elementor-location-popup a', function(event){
    elementorProFrontend.modules.popup.closePopup( {}, event);
    });
  });
});
</script>

Für mehr Elementor Tipps besuche die Seite Elementor Tutorials oder hol dir meinen Elementor Praxis Kurs – Der Nr. 1 WordPress Page Builder.

5/5 - (3 votes)
Vielen Dank fürs Teilen dieser Seite

7 Kommentare zu „Elementor Popup Menü für einen One Pager“

  1. C
    Christian Cambule

    Hi, habe den Code reinkopiert.. mobil auch funktioniert, aber auf dem Desktop verschwindet dann mein ganzen pop up.. ich habe ein vertical popup drin.. kann mir jemand sagen warum das verschwindet?

  2. B

    Hallo Danjiel,
    danke für den nützlichen Artikel! Was ist mit Usern, die mit Browsereinstellungen Popups blocken. Wird das Menü trotzdem funktionieren?
    Wäre prima, wenn du da was zu sagen könntest.
    LG Beate

  3. T

    Hallo Danijel,

    wenn mein Kommentar hier nicht reinpasst, bitte löschen.
    Ich habe folgendes Problem. Ich nutze das PopUp von Elementor, passt so weit auch alles. Mein Problem ist nur, dass wenn man das PopUp schließt, taucht es auf einer anderen Seite wieder auf. Das Schließen wird nicht gespeichert, also kein Cookie gesetzt. Wie kann man das einstellen, dass der User nur einmal das PopUp auf der ganzen Webseite nach dem Schließen sieht?

    Grüße TImo

    1. D

      Hallo Timo,
      wird das Popup über ein Button / Link getriggert oder hast du Conditions für das Popup eingestellt? Vielleicht kannst du die Conditions nochmal überprüfen, damit es nicht so eingestellt ist, dass es einmal pro Seitenaufruf geladen wird.
      Schöne Grüße, Danijel

      1. T

        wird nach 50% der Seite geöffnet. Da finde ich leider nix. Wenn per Klick, wäre das ja kein Problem. Es muss also irgendwie gehen? Hast du eine Ahnung evtl. Screenshot wo man das einstellt?
        Danke für deine Hilfe.

        1. D

          Dann liegt es wahrscheinlich an den „Advanced Rules“. Die Standard-Einstellung für das Erscheinen eines Popups ist 3-mal. Wenn du es hier auf „1-mal“ einstellst, sollte es passen.
          Elementor Popup erscheint auf jeder Unterseite erneut - Advanced Rules
          Schöne Grüße, Danijel

Schreibe einen Kommentar zu Danijel Kommentieren abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht.

Related Posts

Ähnliche Beiträge

Elementor SEO Tipps
Website SEO
7 SEO Tipps für Elementor User

Elementor SEO Tipps – Erfahre welche Elementor Einstellungen & Widgets dir helfen, typische SEO-Fehler zu vermeiden und Ranking-Vorteile zu erzielen!

Zum Beitrag »
Elementor als Backup Plugin und für Migration
Elementor Tipps
Website Backup mit Elementor erstellen

Wie gut eignet sich Elementor dafür, einen Website-Backup oder einen Website-Umzug durchzuführen? Kann Elementor sogar etablierte WordPress Backup- und Migrations-Plugins wie z. B. UpdraftPlus ersetzen?

Zum Beitrag »