> For the complete documentation index, see [llms.txt](https://docs.globo.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.globo.io/swatch/app-integrations/themes-without-app-blocks.md).

# Themes without app blocks

Place the widgets by editing your theme when app blocks aren't available.

Older themes — and some heavily customised ones — don't support Shopify app blocks. You can still place each widget by adding a container to the theme's product template.

{% hint style="warning" %}
Editing theme code is permanent until you undo it. **Duplicate your theme first** and work on the copy, so you can go back if something breaks.
{% endhint %}

## Steps

{% stepper %}
{% step %}

### Open the code editor

In Shopify admin, go to **Online Store → Themes**. On the theme you're editing, open the **⋯** menu and choose **Edit code**.
{% endstep %}

{% step %}

### Find the product template

Look in **Sections** for the file that renders your product page — usually `main-product.liquid`. Some themes use `product-template.liquid` or a snippet instead.
{% endstep %}

{% step %}

### Paste the container

Paste the container for the widget you want, at the exact spot it should appear:

```html
<!-- Variant swatches -->
<div class="globo-swatch-product-detail"></div>

<!-- Product groups -->
<div class="globo-product-groups-detail"></div>

<!-- Product bundles -->
<div class="globo_color_swatch_bundle_combo"></div>
```

Add only the ones you use. Swatches usually go just above or below the theme's variant picker; bundles go near the add-to-cart button.
{% endstep %}

{% step %}

### Save and preview

Click **Save**, then preview the theme and open a product page. Publish the duplicated theme once you're happy.
{% endstep %}
{% endstepper %}

## Keep the variant picker

Leave your theme's own variant picker in place. The app uses it to tell Shopify which variant is selected. If you end up with two visible pickers, [contact support](/swatch/help/contact-support.md) and we'll hide the duplicate for your theme rather than you removing it.

## Related pages

* [Where swatches appear](/swatch/getting-started/where-swatches-appear.md)
* [App integrations](/swatch/app-integrations/overview.md)