How to use the side cart with GemPages

Wide Hello!

In this article we will see how to open the side cart on GemPages when a customer adds a WideBundle offer to his cart.

Before we start, you should know that it is necessary to have a side cart, either through your theme or through an application.

WideBundle will not create a cart on the side itself.

Let's get started!

If you prefer to have the explanation in video you can watch it right here 👇

1) Add the variant selector, the add-to-cart button and the quantity selector

The first step is to add various elements on GemPages that are necessary for the cart to work properly on the side. WideBundle needs to synchronize with the following elements: The variants selector, the quantity button, the add-to-cart button.

Once added, WideBundle will detect them and will hide them automatically so they don't appear in double with WideBundle!

1. Open your page on GemPages where you have WideBundle
2. Look for the "(P) Variants" module for the variant selector and place it on your page just above WideBundle if you don't have it yet

3. Do the same by placing the "(P) Cart Button" module for the add-to-cart button just below the variant selector if you don't have it yet

4. Then finish with the "(P) Quantity" module for the quantity selector to put under the variant selector if you don't have it yet

2) Configure your add-to-cart button to open the cart on the side

Now we need to configure the GemPages add-to-cart button to open the cart from the side.

We will then make sure that the add-to-cart button opens the cart on the side without WideBundle.

1. Click on the add-to-cart button module you added
2. Activate the "Ajax Cart" mode

3. Save and Publish your page.

3) Test the opening of the cart on the side without WideBundle

We will now make sure that the sidebar opens without WideBundle before continuing.

1. Open the WideBundle application
2. Disable the display of WideBundle for a few minutes (to test the opening of the sidebar without WideBundle)

3. Go to your store and open the product page where you added the variant selector, the add-to-cart button and the quantity selector
4. Try to add the product to the cart and see if the cart on the side opens as configured

4) Configure WideBundle to open the sidebar

1. Go back to the WideBundle application
2. Activate WideBundle again

3. Click on Settings & Design in the left panel

4. Click on Add to Cart Button.

5. Change the redirection of the add-to-cart button to "Side Cart"!

And that's it!

You can test again but there should be no problem

Updated on: 16/11/2024