Bedingtes Öffnen des Popup Maker-Popups in WordPress mit jQuery

Lesezeit: 4 Minuten

BMM

Ich versuche, ein Popup in WordPress bedingt zu laden. Das Popup wird im Plugin konfiguriert Popup-Maker und hat eine CSS-Klasse von “popmake-2503”.

Ich habe eine Funktion in der functions.php meines Themes erstellt, die ein Skript bedingt lädt:

// open popup
function open_popup() {
if( is_user_logged_in() && is_page('checkout') )
    {
    wp_enqueue_script(
        'open-popup',
        get_stylesheet_directory_uri() . '/open-popup.js',
array( 'jquery' )
            );
        }
    }
add_action( 'wp_footer', 'open_popup' );

In der Datei open-popup.js habe ich Folgendes:

jQuery(document).ready(function($) {
    alert ('running');
    $('#popmake-2503').popmake('open');
});

Ich habe die gelesen API aber ich kann das Popup immer noch nicht zum Auslösen bringen, und in der Konsole wird kein Fehler angezeigt. Die grundlegende Javascript-Warnung funktioniert.

Vielen Dank.

EDIT1: umgekehrt funktioniert, dh

$('#popmake-2503').popmake('close');

funktioniert, um das Popup effektiv zu schließen, nachdem es automatisch geladen wurde (wie in den Popup Maker-Konfigurationen in WP Admin definiert).

Daniel Iser

Ihre Lösung ist korrekt, aber derzeit verzögert Popup Maker das Laden von js, sodass Ihr Code ausgeführt wird, bevor die Funktion .popmake(‘open’) geladen und die Popups initialisiert wurden.

Wir werden uns bald darum kümmern, aber versuchen Sie, ein kurzes Timeout hinzuzufügen, bevor Sie es öffnen:

jQuery(document).ready(function($) {
    setTimeout(function() {
        $('#popmake-2503').popmake('open');
    }, 2000);
});

oder noch besser einhaken in die pumInit Veranstaltung so. Auf diese Weise öffnet es sich, sobald das Popup tatsächlich fertig ist. Dies kann auch sicher in den Kopf geladen werden, da es .on-Ereignisbindung verwendet

jQuery(document).on('pumInit', '#popmake-2503', function () {
    PUM.open(2503); // Newer method than $('#popmake-2503').popmake('open'); and uses internal selector caching.
});

Und schließlich, wenn Sie eine wiederverwendbare Lösung wünschen, können Sie das tun benutzerdefinierte Bedingungen erstellen die in unserem Popup-Bedingungseditor verwendet werden können. Sie benötigen nur eine Bedingung, um sowohl True als auch False zu überprüfen. Das folgende Dokument enthält mehrere vollständige Beispiele, die Sie verwenden können:

PS Ich bin der leitende Entwickler für PM, also ist dies die defacto beste Antwort;)

Bei mir funktioniert Delay, Listener nicht. Ich habe nicht genug Geschick, um zu verstehen, warum.

– Ramón K.

12. September 2017 um 1:30 Uhr
Aus irgendeinem seltsamen Grund schließt sich das Popup direkt nach dem Öffnen, wenn die Verzögerungsmethode verwendet wird.

– DasYaXxE

29. November 2017 um 10:06 Uhr
Wir verwenden den neuesten Download von Popup Maker (und lieben es übrigens). Für die obige Ereignis-Listener-Methode erhalte ich das Ereignis nicht, wenn wir das zweite Argument (‘#popmake-2503’) übergeben. Wenn wir das pumInit-Ereignis ohne die explizite ID anvisieren, funktioniert es.

– matt Lummus

16. Februar 2018 um 18:27 Uhr

Sie versuchen, das Popup mit dem ID-Selektor zu erfassen #popmake-2503aber ich habe deine Frage gesehen, dass es Klasse hat popmake-2503. Versuchen Sie also, diese Zeile zu ändern:

jQuery(document).ready(function($) {
   alert ('running');
   $('.popmake-2503').popmake('open'); //class selector
});

Vielen Dank. Es hat sich etwas geändert, ja. Das Popup wird immer noch nicht angezeigt, aber ich erhalte die folgende Fehlermeldung von der Konsole: “Uncaught TypeError: Cannot read property ‘meta’ of undefined” (was aus der Plug-in-Datei popup-maker-site.min.js stammt)…

– BMM

22. Januar 2016 um 10:26 Uhr
Wie bei ihrer API glaube ich, dass ich wirklich “#” verwenden muss, um das Popup über jQuery auszulösen.

– BMM

22. Januar 2016 um 10:36 Uhr
Ja, natürlich, wenn Sie eine ID zu Ihrem Element haben, ist es besser, es für die Auswahl zu verwenden. Wichtig ist, den Artikel richtig auszuwählen. Aber weil Sie in Ihrer Frage nicht erwähnt haben, dass das ausgewählte Element eine ID hat, sondern Klasse anzeigen, habe ich entschieden, dass Sie das benötigte Element nicht richtig ausgewählt haben. Sie können versuchen, Ihren Code zu debuggen, um sicherzustellen, dass Sie das Element durch Platzieren richtig ausgewählt haben console.log( $('#popmake-2503'), 'test');. Wenn Sie Ihren Code irgendwo einfügen können, kann ich versuchen, Ihnen mehr zu helfen 🙂

– pgk

22. Januar 2016 um 12:16 Uhr
Vielen Dank. Über die Konsole bekomme ich folgendes Log: [div#popmake-2503.popmake.theme-2382.responsive.size-medium, context: document, selector: “#popmake-2503”] 0: div#popmake-2503.popmake.theme-2382.active.size-medium.fixed.responsive.custom-position Kontext: Dokumentlänge: 1 Selektor: “#popmake-2503” proto: m[0]

– BMM

22. Januar 2016 um 12:46 Uhr
Die Auswahl war also ok. Aber ich habe es geschafft, das Problem andersherum zu lösen (zumindest vorerst): Das Popup öffnet sich automatisch, schließt sich dann aber automatisch (ohne dass der Benutzer es merkt), wenn er/sie angemeldet ist. Das bedeutet, dass $(‘#popmake-2503 ‘).popmake(‘öffnen’); funktionierte nicht zum Öffnen des Popups, aber $(‘#popmake-2503’).popmake(‘close’); gearbeitet, um es zu schließen.

– BMM

22. Januar 2016 um 12:48 Uhr

Sie können die Verwendung von jQuery vermeiden. Dadurch kann das Plugin deaktiviert werden, wenn eine Bedingung nicht zutrifft.

add_action('wp', 'disablePopup');

function disablePopup () {
    if (/*Some condition is not true*/) return remove_action( 'wp_enqueue_scripts', 'popmake_load_site_scripts');
}

Überhaupt nicht zu empfehlen. Die meisten Benutzer haben nicht nur ein Popup, dies würde effektiv alle Popups auf einmal deaktivieren. Das OP scheint ein bestimmtes Popup öffnen zu wollen.

– Daniel Iser

20. Juni 2017 um 22:43 Uhr

13530300cookie-checkBedingtes Öffnen des Popup Maker-Popups in WordPress mit jQuery

#Abfrage #aufpoppen #WordPress