Articles on: Kite - Free Gift App

How to Fix Side Cart Refresh Issue for Free Gift Addition

Problem: You add a product that qualifies for a free gift. The gift is technically added to the order (backend), but it does not appear in your Side Cart (Drawer Cart) until you manually refresh the page.

Cause: This happens because your theme's "AJAX Cart" or "Side Cart" does not automatically detect when an external app (like Kite) modifies the cart. You need to tell Kite specifically which part of your website to refresh.

This method forces Kite to target and reload your specific cart container.

1. Find your Cart's Unique Class or ID

  • Open your storefront and open the Side Cart/Drawer.
  • Right-click on the cart area and select Inspect (Chrome DevTools).
  • Look for the main container div that holds the cart items.
  • Copy the Class name (e.g., drawer__inner or cart-drawer).
  • Validation: Press Ctrl + F in the Inspector and paste the class. If it shows "1 of 1", it is unique and safe to use.

2. Update Kite Settings

  • Go to Kite > Settings > Widget Settings.
  • Scroll to Cart Refresh Settings.
  • Sidecart Selector: Paste the Class you found.
    • Important: You must add a dot (.) before the name (e.g., .cart-drawer).
  • Sidecart Section ID: Paste the ID (if available).
    • Important: Do not add a hashtag or dot here. Just the text (e.g., CartDrawer).

3. Save & Test

  • Click Save.
  • Clear your cart on the storefront and try to trigger the gift again. It should now appear instantly.

Method 2: Custom JavaScript (Advanced)

If Method 1 does not work, your theme may require a specific command to trigger a refresh (common in highly custom themes).

1. Identify the Refresh Script

  • You need the specific JavaScript code that your theme uses to re-fetch the cart (e.g., ajaxCart.load(), document.documentElement.dispatchEvent(new CustomEvent('cart:refresh'))).
  • Note: This varies entirely by theme. Check your theme documentation or ask your developer.

2. Apply the Script in Kite

  • Go to Kite > Settings > Custom JS Scripts.
  • Locate the field: "Execute Custom logic after free gift addition".
  • Paste your theme’s specific refresh code here.
  • Click Save.

Need Help?

If you are unable to find the correct Class/ID or the JS code:

  • Check Examples: We have listed common refresh events in the settings page for reference.
  • Contact Support: Reach out to us via chat. We can inspect your store and provide the correct selector or script for you.

Updated on: 21/01/2026

Was this article helpful?

Share your feedback

Cancel

Thank you!