A/B Test or Randomly Display Popups

If you want to randomly display one of several selected popups, this doc will walk you through the setup process.

The JavaScript code below saves a cookie so that only the chosen option can be viewed by the same user. In other words, this is generic, basic split test functionality for Popup Maker. In order to take full advantage of this capability, you will need the Popup Analytics Extension to monitor your results.

If you're new to using JavaScript with Popup Maker, check out our Getting Started with Custom JavaScript Doc.

Make sure to customize the code variables as shown in the code sample below.

(function ($, document) {

    // Customize these variables.
    // ----------------------------------
    var popups = [163, 165], // Comma separated popup IDs.
        cookie_name = 'pum-split-test', // Cookie name for the test only.
        cookie_time = '1 month', // Cookie timer.
        // ------------------------------
        // End Customizations.
        chosen_popup = false; // Empty placeholder.

    function random_popup() {
        return popups[Math.floor(Math.random() * popups.length)];
    }

    function get_chosen_popup() {
        var popup,
            cookie;

        if ($.pm_cookie === undefined) {
            return 0;
        }

        cookie = parseInt($.pm_cookie(cookie_name)) || false;

        // If the cookie contains a value use it.
        if (cookie > 0 && popups.indexOf(cookie) !== -1) {
            popup = cookie;
        } else if (!cookie) {
            popup = random_popup();
            $.pm_cookie(cookie_name, popup, cookie_time, '/');
        }

        return popup;
    }

    // Prevent non chosen popups from opening.
    $(document).on('pumBeforeOpen', '.pum', function () {
        var $this = $(this),
            ID = $this.popmake('getSettings').id;

        if (!chosen_popup) {
            chosen_popup = get_chosen_popup();
        }

        if (popups.indexOf(ID) >= 0 && ID !== chosen_popup) {
            $this.addClass('preventOpen');
        } else {
            $this.removeClass('preventOpen');
        }
    });
}(jQuery, document));

View the source on GitHub.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.