> 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/product-groups/show-product-groups-on-your-storefront.md).

# Show product groups on your storefront

Control where the group picker appears on product and collection pages.

## Show or hide a group

Each group has two switches in its **Product group configuration** section:

* **Show on Product** — **Show** or **Do not show**. When shown, the group picker appears on the product page of every product in the group.
* **Show on Collection** — **Show** or **Do not show**. When shown, the group also appears on product cards, so shoppers can switch between related products straight from the grid.

To change several groups at once, tick them on the **Product Groups** list, click **Bulk actions** and choose **Show on collection**, **Hide on collection**, **Show on product** or **Hide on product**.

<figure><img src="https://3138853960-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDsbeTbRNMPUo58YEXkMj%2Fuploads%2Fgit-blob-e69f031d4228f481bd291f8195bea39cc666b6af%2Fproduct-groups-configuration.png?alt=media" alt="The Product group configuration section with the Style, Show on Collection and Show on Product selects"><figcaption><p>Show on Collection and Show on Product control where the group picker appears.</p></figcaption></figure>

## Move the picker on the product page

By default the group picker is placed automatically. To choose its position:

1. In Shopify admin, go to **Online Store → Themes → Customize**.
2. Open a product template.
3. Click **Add block**, choose **Apps**, then **Product Groups**.
4. Drag the block to where you want it and click **Save**.

<figure><img src="https://3138853960-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDsbeTbRNMPUo58YEXkMj%2Fuploads%2Fa7SLAS6DmAW6rjsgpFCO%2Fimage.png?alt=media&amp;token=7ce78d74-0be3-4216-aeb8-fc71adf5c57f" alt=""><figcaption></figcaption></figure>

The block has no settings of its own — the group's own configuration in the app decides everything else.

## Themes and page builders without app blocks

If your theme or page builder can't add app blocks, place this container where the picker should go:

```html
<div class="globo-product-groups-detail"></div>
```

See [Themes without app blocks](/swatch/app-integrations/themes-without-app-blocks.md) and the [page builder guides](/swatch/app-integrations/overview.md).

## Related pages

* [Create a product group](/swatch/product-groups/create-a-product-group.md)
* [Product groups settings](/swatch/settings/product-groups.md)