Ajax Cart

By Shopify default, when clicking on the Add to cart button on the Product page, customers will be redirected to the cart page. With the Ajax cart extension, you will have more choices like showing a cart popup, reloading the page, going to the checkout page, or a cart message… So your customers can easily select product options and avoid wasting time on annoying page reloads. This function surely encourages customers to shop more hence increasing your revenue.

Let’s step forward to see more clearly how it works and what exactly the app will bring to you with EComposer App.

1. How to install the Ajax Cart extension?

Note: When you finish installing the Ajax Cart extension, it will automatically show when you publish.

To open the Extension popup, you have two ways:

• Click on the Extension icon at the top left corner.
• Under the Extension tab, click Add more.

Below is the way for installing the Ajax Cart extension:

2. How to set the Ajax Cart extension?

Notice: This feature only work on the live page

2.1 General

In this tab of this extension, we have:

• Enable ajax cart: To let it be shown or not, you can turn it on without uninstalling the extension.

• Enable order note: Allow customer to fill in the Order Special instructions before Checkout.

• Trust Seal Image/ Trust Seal Image Size: You will upload the image for this option and have flexible changes in the size for it.

2.2 Checkout Button

You can change the Label of the Checkout Button as well as the Text color and Background color for it on both NORMAL and HOVER mode

2.3 Continue shopping button

You can change the Label of the Continue Shopping Button as well as the Text color and Background color for it on both NORMAL and HOVER mode

2.4 Button style

You can change the Typography, Width, Border radius, and Spacing for both the Checkout Button and the Continue Shopping Button

Then click the “Save” button to view it from the Live Page.

This extension will be used on the Add to cart button. After setting the extension, you can decide on the action after adding the product to the cart by clicking on the Add to cart button:

• Show cart popup
• Reload page
• Show a message
• Redirect to the cart page
• Go to the checkout page
• Go Special URL

Here is the example as you can see in the video below:

3. How to change the text on the cart popup

After installing the extension, our app will add the Ajax cart template to your theme. So if you want to change the text of the cart popup, please follow my guide below:

Go to Theme => Edit content.

Open the Sections tab.

Find the text option you want to edit. For example, if you want to edit the Checkout button, you can find the Checkout text like this: