Would you like to keep shoppers moving toward checkout the moment they add an item? The Added to Cart Popup module in Merchant Pro shows an attractive popup with a product summary and call-to-action buttons whenever a customer adds something to the cart.
In this guide, we’ll walk you through how to set up the Added to Cart Popup module in Merchant Pro.
Before you get started, make sure you’ve installed and activated the Merchant plugin on your WordPress site. If you’re using premium modules, ensure you have Merchant Pro installed and active. This feature requires Merchant Pro.
You can pair this module with the Recently Viewed Products module to show recently viewed items in the popup, exclude any products or categories you don’t want it to appear for, and choose which elements show inside. Here’s an Added to Cart popup on a WooCommerce product page:
1. Open the Added to Cart Popup module
First, open your Merchant dashboard by clicking the Merchant menu in the left sidebar of your WordPress admin area. Find the Boost Revenue section, and click the Added To Cart Popup module to open its settings page.
2. Find the module settings
Like all Merchant modules, the Added to Cart Popup module comes with sensible defaults that look good out of the box, and you can change any of them. On the module’s admin page, you’ll find two groups of settings:
- Popup Settings: Configure the module’s behavior and the layout of the popup.
- Look and Feel: Customize the design of the popup.
As you configure the settings, the Preview section next to them updates in real time:
3. Configure the popup settings
In the Popup Settings section, you get the following options:
- Select layout: Choose from three popup layouts.
- Popup size: Set the width of the popup.
- Popup message: The title at the top of the popup (default value: “Added to cart”).
- Show product info: Choose whether to show the product thumbnail, title and price, and description.
- Maximum product description length: The number of words shown from the product description (default value: 15).
- Show cart details: Show or hide three price details: Cart total, Shipping cost, and Tax amount.
- Show view cart button: Show or hide the View Cart button and change its label (default value: “View Cart”).
- Show continue shopping button: Show or hide the Continue Shopping button and change its label (default value: “Continue Shopping”).
- Show checkout button: Show or hide the Checkout button in the popup.
- Show suggested products: Toggle the suggested products section on or off. When on, choose between two recommendation types:
- Related Products: Automatic recommendations based on your product tags and categories.
- Recently Viewed Products: Recommendations from Merchant Pro’s Recently Viewed Products module, which must be enabled on your site.
- Exclusion List: Exclude specific products or categories so the popup doesn’t appear for them. Start typing a product name to add it.
- Show on pages: Choose the page types where the popup is active: Homepage, Product Single, and Product Archive (Shop, category, and tag pages).
- Show on devices: Enable or disable the popup for desktop and mobile.
If you changed any default settings, click the Save button in the top-right corner of the page:
4. Customize the look and feel of the popup
Find the Look and Feel section below Popup Settings, where you can customize these design options:
- Popup background color: The background color of the popup (default value: #fff).
- Popup corner radius: The corner radius of the popup (default value: 0px).
- Popup overlay color: The color of the overlay that covers the page while the popup is open (default value: rgba(0,0,0,0.5)).
- Borders color: The color of the popup’s border (default value: #d9d9d9).
- Close button color: The color of the close icon (default value: #000).
- Message text color: The color of the popup title (default value: #000).
- Product name color: The color of the product name (default value: #000).
- Product description color: The color of the product description (default value: #000).
- Product price color: The color of the product price (default value: #000).
- Product price font size: The font size of the price (default value: 18px).
- Cart details color: The color of the cart details section (default value: #000).
- Buttons corner radius: The corner radius of the call-to-action buttons (default value: 25px).
- Buttons main color: The background of the View Cart button and the border and text of the other buttons (default value: #3858e9).
- Buttons alternate color: The text of the View Cart button and the background of the other buttons (default value: #fff).
- Suggested products section title color: The color of the suggested products title (default value: #000).
- Suggested products name color: The color of the product names in the suggested section (default value: #000).
- Suggested products price color: The color of the price tags in the suggested section (default value: #8e8e8e).
If you made any changes, click the Save button in the top-right corner of the page.
5. Enable the Added to Cart Popup module
To activate the module, click the Enable button at the top of the page.
Video walkthrough
Check out the video below for a live demo of the Added to Cart Popup module:
Frequently asked questions
Below, we’ve answered some of the most common questions about the Added to Cart Popup module.
Can I stop the popup from showing for certain products?
Yes. Use the Exclusion List in the Popup Settings section to exclude specific products or categories, so the popup won’t appear when those items are added to the cart.
Where do the suggested products come from?
You can show Related Products, generated automatically from your tags and categories, or Recently Viewed Products, which require Merchant Pro’s Recently Viewed Products module to be enabled.
That’s it! You’ve successfully set up the Added to Cart Popup module in Merchant Pro to keep shoppers engaged after every add to cart.
Next, would you like to reward bigger carts? Check out our guide on the Free Gifts module to learn more.
