Add-to-Cart Popup

Learn how the Add-to-Cart popup helps you to capture customers email id and reduce abandoned carts.

Retainful’s 'Add-to-cart popup' feature is a strategic tool for eCommerce platforms. It prompts a popup to collect the customer’s email address as soon as they click “Add to cart”.

What makes it more enticing is the integration of offers within the popup, providing an immediate incentive for customers to share their email, enhancing customer engagement, and reducing cart abandonment.

Now, we have a way to reach out to them.

Step 1: Choose Add-to-Cart Sign-Up Form:

  • Login to your Retainful dashboard.

  • Go to Sign-up Forms and click on 'Create a Form'.

  • Provide a name for the form, and add a description.

  • Choose ‘the Add-to-Cart’ Sign-up form.

  • Click on ‘Create a form’.

Choose Add-to-Cart Signup Form

Step 2: Choose Template:

  • Choose from our pre-designed signup form templates or start from scratch and customize it according to your preferences.

Choose Template

Step 3: Template Customization:

Retainful allows you to customize the popup design. You can change the default text, button text, and more.

Popup Editor
  • Pop-up Blocks:

Retainful Editor offers a range of customizable blocks such as text, images, buttons., etc. These can be seamlessly dragged and dropped into the pop-up template for easy customization.

  • Style Manager:

This allows you to adjust position and do style settings to suit their preferences, enhancing the visual appeal of the pop-up.

  • Page Manager:

Located at the top of the editor, it includes tabs like “Main Page”, “Thank You”, and “Teaser”. These represent different stages in the pop-up transition, from email collection to the display of the thank you page with the coupon.

  • Save the Form at the top right corner, After making all the desired changes.

Step 4: Sign-Up Form Settings:

With the signup form settings, you can set the following:

  • Devices: Options to enable the popup for Desktop and Mobile.

  • Teaser: A toggle to enable or disable the teaser.

  • Edit Template: A button to edit the popup template.

Step 5: Settings Summary:

  1. Choose Audience List: A dropdown menu to add an existing list (or) create a new empty list from 'List and Segments’ for new users (Maximum 5 lists).

The lists created or added can be saved and used for future campaign purposes. This allows users to effectively target their audience in subsequent campaigns, making the process more streamlined and efficient.

Step 5:

  1. When your visitors get the popup?: This setting determines when the popup will be shown.

Note: Choose the trigger(s) that will launch your popup. If you choose more than one, the first one that gets triggered will launch the popup ("OR" condition).

Add ID or Class to Trigger:

  • The ‘Add to cart popup’ will be auto-enabled as we have chosen the Add-to-Cart signup form which it triggers when a customer adds an item to the cart from the product page.

Capture the Class Name from the Product Page:

  1. Go to any product page on your website.

  2. Click on the product to navigate to its details page.

  3. Click on the "Add to Cart" button.

  4. Right-click on the page and select "Inspect".

  5. Locate the HTML code for the "Add to Cart" button within the opened Developer Tools.

  6. Right-click on the highlighted code, representing the button, and choose "Copy" to copy the class name.

  1. Paste the copied class name here for further use. This class name will be used to trigger specific actions related to the "Add to Cart" functionality.

Can add multiple IDs or classes for any specific product by clicking ‘+ Add’.

Other Trigger options:

Unlock flexibility by activating multiple trigger options according to your preferences. Learn how to configure these triggers for optimal engagement: Click here.

Step 6: Tailor Popup Visibility:

Diversify targeting options by activating multiple settings aligned with your preferences. Discover how to configure these targeted options for precise audience engagement: Click here.

This step empowers you to effectively tailor popups, ensuring they reach specific audiences based on your desired criteria.

Analytics: Gain Insight into Viewer Engagement and Form Activity

Explore the analytics feature to obtain comprehensive data on viewer engagement, submissions, and detailed form activity, including essential customer information such as email ID, first name, last name, and phone number.

This valuable data empowers you with the metrics needed to understand viewer behavior and optimize your strategies for enhanced customer interaction and satisfaction.

Step 7: Enable the Form

  • After confirming your settings, take the next step by enabling the form and saving your configurations.

1. When a customer tries to leave your website without purchasing he will see the popup:

2. Upon the customer's entry of their email address and the click on "send me the coupon code," an enticing discount code is revealed in a popup.

This exclusive offer serves as a powerful incentive, motivating the customer to finalize their purchase. It not only adds value to their shopping experience but also enhances the likelihood of completing the transaction.

Last updated