How to place Free Shipping Upsell inside the Cart Drawer/Cart Page

Placing the Free Shipping Upsell inside the cart is one of the most effective ways to encourage customers to increase their order value. This article explains how to correctly display the Free Shipping Upsell in the Cart Drawer or on the Cart Page, depending on your theme setup ๐Ÿ›’

Plan availability

Cart Page and Cart Drawer types for the Free Shipping Upsell are not available on the Free plan.

This feature is available only on the Essential and Professional plans.

If youโ€™re using the Free plan, you will not be able to publish the booster.

Create a Cart Page type of booster

Before placing the Free Shipping Upsell in the cart, you must first create a booster with the Cart page type.

When creating a new booster in the app, select Cart page as the order value booster type, as shown below:

How Cart Page Placement Works by Default ๐Ÿ“

When the Cart page is selected in the Placement tab of the Essential Free Shipping Upsell app:

  • The booster is displayed on the main cart page
  • The booster is also intended to appear inside the cart drawer, if your theme supports it

No separate placement selection is required for the cart drawer.

Showing the Free Shipping Upsell Only on the Cart Page ๐ŸŽฏ

If you want the Free Shipping Upsell to be displayed only on the Cart Page (and not inside the Cart Drawer), this can be easily achieved by using the Custom Position option.

How Custom Position Works ๐Ÿ“

When Custom Position is selected in the Placement tab of the Essential Free Shipping Upsell app:

  • The booster is not automatically injected into the cart or cart drawer
  • You gain full control over where the booster appears
  • The Free Shipping Upsell will be displayed only where you manually place it

This option is ideal if you want to keep the Cart Drawer clean and show the booster exclusively on the Cart Page.

Placing the Booster on the Cart Page Using an App Block ๐Ÿงฑ

After selecting Custom Position, you can place the Free Shipping Upsell directly on the Cart Page and change its position using the App Block:

  1. Go to Online Store โ†’ Themes โ†’ Customize
  2. Open the Cart Page
  3. Add the Free Shipping Upsell App Block
  4. Add the Cart Page Booster ID into the App block
  5. Move the block to your preferred position (above the cart items, near totals, below the cart, etc.)

Once added, the Free Shipping Upsell will be visible only on the Cart Page, exactly where you want it.


When the Booster Appears on the Cart Page but Not in the Cart Drawer โš ๏ธ

Some themes use a custom cart drawer structure that does not automatically detect the booster.

In this case, the Free Shipping Upsell may appear correctly on the main cart page but not inside the cart drawer.

This does not indicate an issue with the app โ€” it simply means the cart drawer requires a manual placement.


Manual Implementation Using a Snippet (Advanced Setup) ๐Ÿงฉ

If the booster is not visible inside the cart drawer, it can be added manually using the following snippet:

<div class="order-value-booster-side-cart"></div> 

Important Notes:

  • This snippet should be used only for the side/drawer cart
  • The Placement in the app must remain set to Cart Page
  • The snippet must be added to the correct cart drawer file in your theme

Once placed correctly, the Free Shipping Upsell will render inside the cart drawer.


Need Help? Weโ€™ll Do It for You ๐Ÿ’™

We understand that editing theme files and working with snippets can feel overwhelming โ€” and thatโ€™s completely okay.


If youโ€™re not comfortable implementing this yourself, simply reach out to our support team at support@essential-apps.com.

Weโ€™ll be happy to:

  • Locate the correct cart drawer file
  • Add the snippet for you
  • Ensure the Free Shipping Upsell displays correctly inside the cart drawer
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us