[Horizon] Display a "free shipping progress" bar on the cart page

This is a setup example for displaying a "X more to free shipping" bar on the cart page. No theme files need to be edited — just paste the code into a Custom Liquid section. It supports Horizon's Section Hydration (cart:update event), so the amount updates instantly when items are added or removed without a page reload.

Preview

The remaining amount is shown above the checkout button. Once the free shipping threshold is reached, it switches to "Free shipping unlocked!"

Setup Steps

Add a Custom Liquid block to the cart template in the theme editor and paste in the sample code. Only 2 values need to be configured.

Configuration Values

• FREE_SHIPPING_THRESHOLD — The free shipping threshold amount (in JPY). Default: 15000
• LINK_URL — The destination URL for the "Browse more items" link. Set to '' to hide the link

Notes

• The bar re-renders correctly when the page is restored from bfcache (browser back/forward cache)
• The bar is injected immediately before .cart__ctas (the checkout button wrapper). If the theme update changes this class name, a code update will be needed