> For the complete documentation index, see [llms.txt](https://wishlist.nativeappco.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wishlist.nativeappco.com/install-and-setup/checkout-upsell-widget.md).

# Checkout Upsell Widget

Fish Wishlist has a Checkout Upsell widget to encourage logged in customers to add to their order from within the checkout.

### Instructions

* In Shopify, go to your Checkout Editor (Find it under Settings -> Checkout -> [Customize](https://admin.shopify.com/settings/checkout/editor/))
* Open the Apps tab in Checkout Editor <img src="https://1134778209-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMp2ekCAtVgFUnsQlGWfX%2Fuploads%2FCQ3WfpYZmT0SsgoxoWt3%2Fimage.png?alt=media&amp;token=df0d4114-dd79-4051-9e22-9b05fe2c9696" alt="" data-size="line">
* Add the **Wishlist Checkout Upsell** app block\
  ![](https://1134778209-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMp2ekCAtVgFUnsQlGWfX%2Fuploads%2F1CVmdlAX6IKdv8CGKZDQ%2Fimage.png?alt=media\&token=446be899-8a80-40fe-ae81-3559a5ed1909)
* Navigate to the Sections tab in Checkout Editor
* Choose a position for your Wishlist Checkout Upsell. For best user experience we recommend positioning it under **Items in cart**\
  ![](https://1134778209-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMp2ekCAtVgFUnsQlGWfX%2Fuploads%2Fu5jzrp0okqFxWn1hlpPa%2Fimage.png?alt=media\&token=d7504cd6-c147-4cc0-8c97-490050f67669)
* Save your checkout
* Customers will start seeing the widget if they are logged in. It looks like this:<br>

  <figure><img src="https://1134778209-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMp2ekCAtVgFUnsQlGWfX%2Fuploads%2FSn4IYNr0VJSD7zh0gdk1%2Fimage.png?alt=media&amp;token=52a66d18-624f-49d7-bd92-c8874e704eb1" alt=""><figcaption><p>Fish Wishlist Checkout Widget Example</p></figcaption></figure>

:grey\_exclamation:**Note:** The Checkout Upsell widget only appears for logged in customers. Don't be worried if you don't see it appear in the Checkout Editor.

### Settings

Configure these from the app block's settings panel in the Checkout Editor:

* **Wishlist to display** — which saved list feeds the widget: **Wishlist**, **Previously Purchased**, or **Abandoned Cart**. The latter two must first be enabled under Settings > Wishlist settings in the Fish Wishlist app.
* **Layout** — how upsell products are displayed: **List**, **Compact list**, **Carousel**, or **Featured**.
* **Enable quantity picker** — lets customers adjust the quantity for each upsell product before adding it to cart. Applies to the List layout only.
* **Custom message** — optional text shown alongside the upsell (e.g. "Free gift wrapping on wishlist items"). Leave blank to hide it. Pair it with **Custom message placement** to show it above the products, below them, or beside the header.
* **Show free-shipping / milestone bar** — displays a progress bar toward a cart-subtotal milestone (e.g. free shipping at $100). Set the **Milestone amount**, plus the message shown before and after the milestone is reached (use `{{remaining}}` in the "before" message to show the amount still needed).