What’s in This Guide #
This guide gives you example code for “manually” setting a cookie after you submit a form in a popup. Setting a cookie is the “standard” way to stop visitors from seeing the same popup over and over.
Examples of when to manually create a cookie #
You’ll need to “manually” set a cookie when:
- The Popup Maker Form Submission cookie setting doesn’t work.
- You use a confirmation redirect (redirect to a post/page or URL).
Note: Confirmation redirects can bypass how Popup Maker normally sets cookies. If that happens to your popup, try using the example code (below) for your form plugin.
Supported forms #
We’ll cover only the forms we know that support after-submission actions (actions after you hit submit). At the time of writing, these are the forms we can “manually” set a cookie:
Heads up! A more reliable method than before. #
In earlier versions of this doc, we recommended a code snippet that sets a cookie whenever you click the submit button. But that doesn’t guarantee that the form submission was successful before creating the browser cookie.
For example, you can click the submit button without filling in anything (i.e., submitting a blank form). That older code would still create the cookie.
The code in this doc is more reliable because we use the form plugin’s built-in support to signal a successful form submission. That way, your popup’s cookie gets set only after you successfully submit a form.
If you’re new to adding custom code to your WordPress site, please read our Getting Started With Custom Code docs.
Popup Cookie Settings #
For each code snippet below, make sure you define a “manual” cookie in your popup. Here’s an example.
Using the screen capture above as an example, change the cookie name pum-123 to match your popup’s ID number. So, if your popup’s ID number is 456, the manual cookie name must be pum-456.
Contact Form 7 #
This is a code example for CF7 that will redirect your visitors after they submit your CF7 form. It uses the wpcf7mailsent event from CF7.
Since we’re using JavaScript here, we call the Popup Maker JavaScript application programming interface (JS API) to set the cookie that’s defined in the popup. Learn how to add a cookie to a popup trigger in our Add a Popup Trigger guide.
Change the following:
- Redirect URL
- The cookie expiration
- Popup ID 123
/** * Contact Form 7: Add this action with priority 500 */ add_action( 'wp_footer', function () { ?> <script> document.addEventListener( 'wpcf7mailsent', function( event ) { const myRedirectPath = "/my-redirect-page/"; // Change to yours. // Let's hide the form since someone just submitted it. That way you can // see the confirmation message easier. document.querySelectorAll("form.wpcf7-form > :not(.wpcf7-response-output)").forEach(el => { el.style.display = 'none'; }); // Set whatever cookie is defined in the popup. PUM.setCookie(123); //, {expires: "+1 day", path: "/"}); // Change to your popup ID and (optionally) the expiration time. // Redirect on submission setTimeout( () => { location = myRedirectPath; }, 3000 ); // Wait for 3 seconds to redirect so people can read the success message first. }, false ); // addEventListener() // Listen for click events on the submit button. let clickOpenSel = document.querySelector(".click-open-demo"); if ( clickOpenSel ) { const myRedirectPath = "/my-redirect-page/"; // Change to yours. clickOpenSel.addEventListener("click", function (e) { if ( document.cookie.indexOf('pum-123=') === -1 ) return; // Change to your cookie name. // If cookie exists, they already submitted the form, // so redirect right away. setTimeout( () => { location = myRedirectPath; }, 1000 ); // Wait for 1 second to redirect. No need to wait long here. }); // addEventListener() } // if </script> <?php }, 500 );
Gravity Forms #
Here is the Gravity Forms code example. It uses the Gravity Forms gform_after_submission hook.
The snippet calls the PHP setcookie
function. Change the cookie name to yours. Customize the expiration time to what you need.
/** * Call the gform_after_submission hook to do something * after a someone submits Gravity Forms form. * * In this example, we'll set a cookie. */ function set_popup_cookie_on_gf_submission( $entry, $form ) { $gf_id = rgar( $form, 'id' ); // form #5. //if ( absint( $gf_id ) !== 5 ) { // return; //} setcookie('pum-123', 'true', time() + (60), '/'); // Change to your cookie name and expiration time. E.g. 86400 seconds = 1 day } add_action( 'gform_after_submission', 'set_popup_cookie_on_gf_submission', 500, 2 );
Mailchimp for WordPress #
This is the MC4WP code example. It uses the mc4wp_form_subscribed
hook.
The snippet calls the PHP setcookie
function. Change the cookie name to yours. Customize the expiration time to what you need.
/** MC4WP */ function mc4wp_form_setcookie( $form, $subscriber_email_address, $data, $map ) { setcookie('pum-123', 'true', time() + (60), '/'); // Change to your cookie name and expiration time. E.g. 86400 seconds = 1 day } add_action( 'mc4wp_form_subscribed', 'mc4wp_form_setcookie', 500, 4 );
WPForms #
This is the code example for WPForms. It uses the wpforms_process_complete hook from WPForms.
The snippet calls the PHP setcookie
function. Change the cookie name to yours. Customize the expiration time to what you need.
function wpf_dev_process_complete( $fields, $entry, $form_data, $entry_id ) { $wpforms_id = $form_data[ 'id' ]; // Optionally, you can check for a specific form. Below, we set a cookie for only // form #5. //if ( absint( $wpforms_id ) !== 5 ) { // return; //} setcookie('pum-123', 'true', time() + (60), '/'); // Change to your cookie name and expiration time. E.g. 86400 seconds = 1 day } add_action( 'wpforms_process_complete', 'wpf_dev_process_complete', 500, 4 );
AWeber #
Visit our AWeber Integration help guide to learn more about Popup Maker’s integration with AWeber.
The custom PHP and jQuery code below will set the Manual cookie defined in popup 123. You also have 2 options:
- Redirect to a custom success page.
- Stay on the page and automatically close the popup.
Change 123 to your popup’s ID, then uncomment or comment the redirect or close popup code to what you need.
add_action( 'wp_footer', function() {
?>
<script>
jQuery(document).ready(function ($) {
// Listen for the Popup Maker event that signals a successful form submission.
$(document).on('pumNewsletterSuccess', function () {
// Manually set the cookie that's defined in popup 605.
PUM.setCookie(123); // Change 123 to your popup's ID.
// Redirect to a custom success page if you want.
const redirectURL = "https://wildebeest-take.instawp.xyz/my-redirect-page/";
// Either redirect OR stay on the page and close the popup after a delay.
setTimeout(function() {
//window.location.href = redirectURL; // Uncomment this line if you want to redirect.
PUM.close(123); // Close the popup. Change 123 to your ID.
}, 1500); // 1.5 second delay. Change this to what you want.
}); // listener
}); // jQuery
</script>
<?php
} );
Are we missing your favorite form plugin? #
If we are missing your favorite form plugin, please let us know!