Get 15% off Mageplaza extensions & subscriptions! Use code HIMAY at checkout.

How to Configure AJAX Add to Compare in Magento 2

Summer Nguyen | 07-04-2019

The Most Popular Extension Builder for Magento 2

With a big catalog of 224+ extensions for your online store

Before making any decision like performing orders, calling for price or bargaining for mass orders, visitors just want to search and compare to have enough information. Web browsers often use Quick View function to narrow down the range of products and add them to a comparison list showing characteristics of several products in one place to view quickly their pros and cons.

AJAX Add to Compare module in Magento 2 is an effective way for customers to make an informed purchase because they don’t need to remember information related to the product, take notes, open multiple tabs and windows to consider different products. Making buyers satisfied with their shopping journey helps online stores increase conversion rates and customer experience. Otherwise, adding products to the wishlist is a common step used by customers. To know how to utilize this function, you can refer the link.

Table of Contents

What is AJAX and why apply AJAX to add to compare

AJAX is an advanced technology keeping customers in the current shopping page when they select any attributes of a product, instead of reloading the whole page.

With AJAX technology, AJAX Cart extension developed AJAX Add to Cart, AJAX Add to Compare and AJAX Add to Wishlist. Click via Add to Compare icon to put the preferred products in a table showing their related information without reloading the whole page or redirecting to the compare list page. A notification will appear to notify for adding successfully. Shoppers can smartly consider their list because columns will display products or services while rows show their attributes.

This function is especially useful for buying mid and high-priced products, in which the characteristics of products play an essential role like electronics and household appliances, sports equipment, goods for health, for children. Comparing function is not necessary for some kinds of products such as simple products or services. For example, people don’t need to think much when they buy coffee mugs, books, etc. Cheap or easy to replace products or services also don’t make people spend much time analyzing alternatives like pens, paper, pencils, etc. The last case is the product or service, which is unique and hard to compare with others, such as pictures or handicraft products.

Benefits of the AJAX add to compare function

Allow adding a product to compare list without redirecting

Shoppers can easily choose Add to Compare icon in the Product page to save their interesting items from considering and purchasing later. The selected product appears immediately in the compare list, and customers are still on the same page that they view before. They can continue to go shopping without any disturb.

Adding a product to compare list

A message appeared while completing to add the selected product in the list. Shoppers manage the number of items chosen without navigating to the comparison list page as they will be shown on the top or in the left corner of the page.

Completing to add the selected product

Besides, with the support of Quick View extension, shoppers have more chance to investigate products before adding them to the comparison list by previewing their details and rating shortly right on Product list Page. The notification of adding a product in the comparison list will appear on the top of the popup. The purchaser can close the popup and continue your shopping journey easily.

The comparison list

Save time on online shopping

Firstly, thanks to AJAX technology, visitors can freely choose the leading product attributes such as color, a size that they want to view in Quick view Popup message, then click Add to Compare button and continue shopping without turning back the sites. Time-consuming at this step lasts a few seconds, which reduces incredibly compared to the Magento Default.

Secondly, purchasers can view the details of their compared items instantly via the compare list appeared on the top or in the corner of all pages while they are shopping. Moreover, if they want to delete some items in the list, they can choose the X button to release it quickly or delete all concerned items with Clear all button with no impact on their shopping journey.

Thirdly, with the comparison list, visitors don’t need to spend time taking notes, moving between tabs and windows to compare different products. A comparative list appears with all information related to products, which helps them to make decisions quickly.

Increase conversion rates and customer experience

Since every customer prefers the convenience and minimum-effort when they spend time on online shopping. They want to buy the most suitable product with no regret after considering different products. Product comparison helps your shop users make an informed choice. Purchasing the right product at a reasonable price always makes shoppers satisfied, which contributes to improve customer experience and boost sales for e-commerce stores.


AJAX Cart for Magento 2

Speed up your shopping experience with the add-to-cart pop-up function and AJAX loading

Check it out!

How to configure AJAX add to compare in Magento 2


For the Admin Panel, go to Stores -> Settings -> Configuration -> MAGEPLAZA -> Quick View

1. General

Enable: Choose “Yes” to use the feature of this module

2. AJAX Cart Configuration

AJAX Cart Configuration

  • In the Enable box, please choose “Yes” to display the function of AJAX Cart.
  • In Apply for Actions section, you can select to display the popup of AJAX Cart in 4 positions: Product Listing Page, Home Page, Product Detail Page, Quick View Popup. Otherwise, you can show this pop up on many pages by choosing four options.
  • In Apply for Actions part, you can apply to display the popup when shoppers press on what kind of buttons like Add To Cart, Add To Compare, Add To Wishlist. In the next row, by choosing Yes, you enable animate Add To Cart. You can fill the time amount in seconds to display the popup AJAX Cart in the Countdown time section.


The Compare Products will be displayed on the top of the page or in the left corner of any pages, which helps visitors compare products whenever they want. The list of all chosen products also appears below the title Compare Products in the left corner of the page.


Via one click on Compare button, the comparison table will show products or services’ name by column, use rows for their attributes. It allows customers to compare quickly between different characteristics of products. Add to Cart button below each product supports shop users to purchase after analyzing.

The comparison table

Final words

AJAX Add to Compare is a useful tool that any store owner wants to apply to their online shop. This module by Mageplaze not only helps customers find their suitable products quickly but also increases conversion rates for online stores by making their visitor satisfied during their shopping journey.

EXPLORE AJAX Cart for Magento 2 NOW!


Marketing Manager of Mageplaza. Summer is attracted by new things. She loves writing, travelling and photography. Perceives herself as a part-time gymmer and a full-time dream chaser.

Related Post

Website Support & Maintenance Services

mageplaza services

Make sure your store is not only in good shape but also thriving with a professional team yet at an affordable price.