How to Create and Manage a Pop-Up on Your Website

This guide provides step-by-step instructions on creating, configuring, editing, and disabling a pop-up on your website using Elementor.

Creating a Pop-Up

1. Navigate to the Pop-Up Settings:

   • On the left-hand panel, scroll down to Templates and Pop-ups.

2. Purpose of Pop-Ups:

   • Pop-ups can be used for events, news updates, promotions, special deals, loyalty program communication, and more.

3. Using a Template:

   • A pop-up template may already be available in your back-end system.

   • If not, you can create a new pop-up using an image or a custom layout.

4. Editing the Pop-Up Content:

   • Adding a Heading: Click on the plus sign (+), type “Heading,” and insert it.

   • Adding Text: Click on the plus sign (+), type “Text Editor,” and insert the text block.

   • Adding a Button: Click on the plus sign (+), type “Button,” drag it to the desired location.

   • Customizing the Button: Change the text (e.g., “Shop 420 Deals Now”), set the link (e.g., Specials page), and adjust style settings (alignment, color, background color, etc.).

   • Changing the Image: Click on the image, choose a new one from the media library, or upload a new file.

5. Publishing the Pop-Up:

   • Click Publish to save changes.

Configuring Display Settings

1. Setting Display Conditions:

   • Click Add Condition and select Entire Site to display the pop-up on all pages.

   • This ensures the pop-up appears no matter where visitors enter your website.

2. Adjusting Display Timing:

   • Set the delay before the pop-up appears (e.g., 2 seconds on page).

   • Choose frequency settings (e.g., one time per session).

3. Finalizing the Pop-Up:

   • Verify all settings before confirming the pop-up is live.

   • Click the preview (eyeball icon) to check the appearance.

Disabling a Pop-Up

1. Log in and Navigate to Pop-Ups:

   • Scroll to Templates and Pop-ups and open the pop-up in Elementor.

2. Disable the Pop-Up:

   • In the upper-right corner, click Display Conditions.

   • Remove the Entire Site condition by clicking X.

   • Click Save & Close.

3. Clear Cache to Apply Changes:

   • Go to Elementor and select Purge All Cache.

   • If you do not see this option, scroll to the bottom and select Hummingbird Caching to clear the cache.

Editing an Existing Pop-Up

• If the pop-up is already configured, simply update text, images, or buttons as needed.

• Publish the changes and clear the cache to reflect updates.

Need Help?

If you have any questions, please reach out to your Digital Strategist for further assistance.