help center

On this page

Create a shopping cart popup

Last Update: August 10, 2023

Create an engaging Elementor Popup on your checkout page that helps users make buying decisions.

You will learn how to create a popup that:

  1. Keeps the visitor in the shopping loop
  2. Encourages sharing your product with others
  3. Earns visitor trust by not pushing for a purchase

Design The Popup and Its Content

  1. Go to Templates > Popups > Add New and give your new Popup a name. (An alternative method is to press CMD+E or CTRL+E to open Finder, search for Popup, choose Add New Popup, and give it a name.
  2. Choose a pre-designed Popup template or close the Library overlay and design your Popup from scratch.
  3. For this example, we’ll design our own, and add a heading, some text, an image or animated gif, and some social share buttons .
  4. Style the text and icons as desired.
  5. Now let’s give our popup an Entrance Animation by going to Popup Settings > Entrance Animation > Slide In Right, and set the Animation Duration to 1
  6. Click Publish
file X6RpIFwKAN Create a shopping cart popup 1

Set The Publish Options

Now let’s set Conditions and Triggers. We’ll show the Popup only on the Checkout page, and only after the user has been inactive on the page for 20 seconds.

  1. Conditions > Singular > All Pages > Choose Page – Enter the name of page where you want the popup to pop – In this example, we typed checkout
  2. Triggers > After Inactivity > 20 (seconds)
  3. For this example, we don’t need to set any Advanced Rules, so click Save and Close.
file uuDLEk7e5U Create a shopping cart popup 3

All done. Now go to your checkout page, and view your Popup in action.

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article