> 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/recommendations/customize-widget-appearance.md).

# Customize recommendation widget appearance

Rename a recommendation widget's title, switch between grid and carousel layout, and control how many products show per device.

## What this does

Controls how a recommendation widget actually looks and behaves for shoppers once it's on a page — its heading text, whether products sit in a static grid or a swipeable carousel, and how many products show on desktop, tablet, and mobile. For example, switching a "Best sellers" widget from **Grid** to **Carousel** lets shoppers swipe through more products without taking up extra vertical space, which often works better on mobile, while renaming the heading to "Customer favorites" changes only what shoppers read, not which products appear.

These settings live in the Shopify theme editor, once a widget has been added to a page — see [Add recommendation widgets](/recommendations/add-recommendation-widgets.md).

## Steps

1. From the **Recommendations** page, click **Add to theme** on a widget (or open an existing one already on a page in the theme editor).
2. In the theme editor's block settings, configure:
   * **Heading** — the widget's title as shown to shoppers (for example, change "Best sellers" to "Customer favorites").
   * **Layout** — **Grid** or **Carousel**.
   * **Maximum products to show** — up to 10.
   * **Number of columns** — set separately for desktop, tablet, and mobile.
   * **Carousel options** (Carousel layout only) — autoplay, infinite loop, show pagination dots, show next/previous buttons.
3. Click **Save** in the theme editor.

![Theme editor — recommendation widget block settings](https://2009335375-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FKmtdB4I84W3J8hc91H4S%2Fuploads%2Fgit-blob-0531b8e0ce9ec1a0007045c75bb8f2de5ff6b169%2Ftheme-editor-widget-settings.png?alt=media)

## Choosing which products a widget shows

* The **Hand-picked products** widget has its own **Products** field in the theme editor — pick up to 12 products directly, instead of relying on automatic recommendation logic.
* The **Hand-picked related products** widget has a **Type** setting (**Related** or **Complementary**) that chooses which set of per-product recommendations to pull from — configure those sets in [Hand-pick product recommendations](/recommendations/hand-pick-product-recommendations.md).

## Related pages

* [Add recommendation widgets](/recommendations/add-recommendation-widgets.md)
* [Hand-pick product recommendations](/recommendations/hand-pick-product-recommendations.md)
