# Where to place the progress bar in a Shopify theme: cart drawer, cart page, product page

> Click Place progress bar, then click the spot in your theme where the bar should go. App blocks, a code snippet and a free custom integration cover the rest.

Updated 2026-09-25 · https://www.yaco.studio/docs/theme-placement

## Place the bar in the cart drawer or anywhere else

The recommended method is **Place progress bar**: you point at the spot in your theme, and the app remembers it. It works for the cart drawer, the cart page, the product page or any other part of the theme.

1. In the app, open **Theme integration**, tab **Placements**.
2. Under **Themes**, check the theme you are working on (**Choose a theme**). The live theme carries the badge **(current theme)**. Placements are saved per theme.
3. In the **App embed activation** section, click **Enable** if the app embed is not on yet, turn on **Yaco Progress Bar** in the theme editor and save.
4. In **Cart drawer & general placements**, click **Place progress bar** (or **Manage progress bar placements** once a placement exists).
5. The theme editor opens with the menu **Integrate Yaco progress bar**. Click **Add progress bar**, then click on the element of the page where the bar should appear.
6. Adjust the form if needed, then click **Save**.

If Shopify's theme inspector is on, the Yaco menu asks you to turn it off first: placement does not work while it is active.

## Placement settings

Each placement has its own settings, in the theme editor or from the **Theme integrations** list on the same page:

- **Reference element** and **Position relative to the reference element**: where the bar goes (before, after, first child, last child or in place of the element).
- **Visibility condition**: always visible, only when the cart contains items, or only when it is empty.
- **Show on templates**: limit the placement to some page templates. All templates by default.
- **Goal filter**: show all tiers, only some, or hide some on this placement.
- **Design**: which [design](https://www.yaco.studio/docs/design) this placement uses.
- **CSS class names** and **Wrapper CSS**: fine-tune the spacing around the bar.

A placement can be switched off without being deleted with **Disable integration**.

## Reuse placements from another theme or store

- **Import**, in the **Theme integrations** card, copies the placements of another theme of this store, or of another store where you use Yaco with the same Shopify account. A store shows up once you have opened Yaco on it with that account. Placements already used on the theme are never added twice.
- When other Yaco stores run the same theme at the same version, a card **placements ready for** your theme offers their placements. They are anonymized, and badged **Same version** or **Close version**. Check the ones you want and review the result.
- When you duplicate a theme in Shopify, its placements are copied to the new theme automatically.

## Alternative methods

The **Alternative methods** tab covers other ways to add the bar:

- **Product page & Cart page**: click **Go to Product page template**, then in **Template › Product information** click **Add block** and choose **Yaco Progress Bar**. For the cart page, use **Go to Cart's page template** and the **Template › Subtotal** section.
- **I'm a developer**: copy the line of code with **Copy to clipboard** and paste it into any Liquid template. **Edit code** opens the theme code editor.
- **Auto Cart drawer integration** (**Top of Cart drawer** or **Bottom of Cart drawer**): an older method, marked **Deprecated**, which does not work on all themes. Prefer **Place progress bar**.

For the checkout, see [progress bar in checkout](https://www.yaco.studio/docs/checkout).

## Ask for a free custom integration

If you cannot find the right spot, click **Contact us** in the banner **Need help placing the progress bar on your theme?**. The Yaco team places the bar for you, for free. Adding your **Collaborator request code** is optional but speeds things up. Most integrations are done the same day or the next business day.

If the bar is placed but stays invisible, read [bar not showing](https://www.yaco.studio/docs/bar-not-showing) or [cart drawer issues](https://www.yaco.studio/docs/cart-drawer-issues).