Articles on: Custom extensions

How to automatically open a popup after N seconds in a blog post

In this guide, we'll walk you through the steps to set up an automatic popup to appear N-seconds after opening a blog post.

Our popups function globally, meaning they exist on all pages regardless of whether they're utilized or not. All you need to do is create the desired popup, and it will be present on all your blog posts.
You might find this guide useful: How to create popups

Once you've created the popup you want, you can then configure it to open on your blog after a specified number of seconds have elapsed.

Step 1



Copy this code:

<script>
const time = 3000;
const popupId = "popup-01-60831";

window.onload = () => {
  const openAutoPopup = ($popup) => {
    $popup.fadeIn(150);
    $(".js-custom-popup-mask").fadeIn(200);
    const popupExists = $popup.length !== 0;
    if (popupExists) {
      $("body").addClass("state-fixed-body_popup");
    }
  }
  const $autoPopup = $(`#${popupId}`);
  setTimeout(()=>openAutoPopup($autoPopup),time);
}
</script>



Step 2



Paste this code into Blog > Each blog post </body>



Step 3



Replace the popup ID in the code with the ID of your popup (without #)



You can locate the popup's ID at the top of the popup editor



Step 4



Castomize the delay after which the popup will appear (in milliseconds)



Done!



Your blog posts will now feature a popup with the delay you've configured.

Updated on: 18/12/2023

Was this article helpful?

Share your feedback

Cancel

Thank you!