Fixing Side Cart Refresh Issue for Free Gift Addition

How to fix Side cart refresh issue - Kite app ?

This guide addresses a common issue encountered by stores when adding a free gift to their cart. The problem arises when the free gift is claimed but not updated on the side cart. This is typically a side cart refresh issue, which can be resolved using two methods: side cart selectors or events.

Step 1: Identify the issue

On the product page, add a product to the cart to unlock the free gift. Try to claim the free gift. Notice that the free gift is claimed but not updated on the side cart. Refreshing the screen adds the free gift to the side cart.

Method 1: Using Side Cart Selectors

Step 1: Open Developer Tools

Press Control + Shift + I to open the developer tools.

Step 2: Inspect the Side Cart

Inspect the side cart page to identify a unique class that could help resolve the issue.



Step 3: Copy the Unique Class

Find and copy a unique class, such as "drawer inner".



Step 4: Verify the Uniqueness of the Class

Press Control + F and search for the class to ensure its uniqueness.



Step 5: Implement the Class

Navigate to the settings page and locate the custom seasons in JavaScript settings. Scroll down to find the side cart selector. Add the copied class here, preceded by a dot.





Step 6: Find a Unique ID

Inspect the side cart again to find a unique ID. Copy this ID and paste it in the settings, without adding a dot before it. Save the settings.

Step 7: Test the Solution

Clear the cart and repeat the process of adding a product and claiming the free gift. The cart should now refresh with the claimed gift, but it may not keep the side cart open by default.

Method 2: Using Events

If the side cart selectors and IDs method does not work, use events to solve the issue.

Step 1: Locate the Events Section

Find the section labeled "execute custom logic after free gift addition".



Step 2: Add the Side Cart Refresh Event

Request your theme developer to access the side cart refresh event and add it to this section. This will allow the side cart to refresh on its own.



For further assistance or if you don't have a theme developer, reach out to us via chat. This is a fixable issue and we're here to help.### If you have a developer in your team then STEPS would help as well:

Issue Description:

When a product is added to the cart and the threshold for a free gift is met, the free gift does not load or appear in the side cart as expected.

Example:
You add a product to your cart, and there's a promotion offering a free gift when you reach a certain spending threshold. Despite meeting this threshold, the free gift does not show up in the side cart as it should - Check the image below



Debugging:


Open the Side cart - Right click on your mouse - Click on Inspect element

Move your mouse pointer over the items in the cart, and you'll notice a class called "drawer_content." This class is associated with the content displayed in the side cart.

Note that various themes may use different classes. Identify the class specifically related to the items added in the side cart. Look for the one that corresponds to the content inside the cart on the side of the page.




Go to Kite app and Click on Custom CSS and Javascript settings




Paste the "drawer_content" in Side cart selector and Save it. Note: Don’t forget to add a . before the selector without any space.




To ensure the side cart stays open after adding the free gift, find the parent section ID by hovering over the entire side cart. In the given image, the section ID is "mini-cart." This ID is crucial for maintaining the visibility of the side cart when the free gift is added.




Paste the "mini-cart" in Side cart section id and Save it. Note: For ID, you don’t have to add . before the id name.




You can see after adding the product the FREE gift gets added - its visible and the Side cart stays open.

Updated on: 25/11/2024