Category chips

Category chips is a compact row of pill-shaped shortcuts — icon plus name — leading to your collections.

What it does

Use it right under the hero as a quick “where to?” — it takes one line and moves shoppers to a shelf fast. It can build itself from your store’s collections, or you place chips by hand.

Add it to a page

1. In Shopify admin, go to Online Store → Themes and click Edit theme. (Older admin versions label this button Customize.)
2. Open the template where you want the section.
3. Click Add section and choose Category chips.
4. Either let it auto-build from your collections, or add Category chip blocks by hand.
5. Save.

Choose a style

There is no layout setting — the choice is automatic or hand-placed:

• With no chips added, Auto-build from store collections shows your store’s real collections (up to the number you set). Collections that have an image use it as the chip’s icon.
• Once you add Category chip blocks, your hand-placed chips take over and the automatic list steps aside.

Two more switches: horizontal scrolling on phones, and the “View all” link.

Set it up: quick start

1. Add the section — it auto-builds from your collections immediately.
2. For a curated row, add Category chip blocks: pick a Collection and an Icon per chip.
3. Turn on Horizontal scrolling on mobile if you have many chips.
4. Save.

Settings

Section settings

Setting	Default	Options	What it does
Heading	“Shop by category”	Text	Section title; leave empty for no title
Auto-build from store collections	On	On / Off	Shows your store’s collections automatically — only when no chips are added. Collections with an image use it as the chip icon
Number of collections (auto mode)	6	2–8, step 1	How many collections the automatic row shows
Horizontal scrolling on mobile	Off	On / Off	Below 750 px: one swipeable row. Off wraps the chips onto multiple rows
Show “View all” link	On	On / Off	Link to your catalog after the chips

Blocks

Block	Limit	What it adds
Category chip	Add one per collection	One pill shortcut

Category chip settings

Setting	Default	Options	What it does
Icon	Paw	Dog / Cat / Bird / Fish / Paw / Heart / Gift / Bone	The chip’s little picture
Label	Empty	Text	The chip’s name. Defaults to the picked collection’s title when empty
Collection	Empty	Collection picker	Where the chip leads
Highlight	Off	On / Off	Marks the chip with the theme’s accent color

Images and content tips

• Auto mode borrows collection images as icons — give your collections square cover photos (around 400×400 px) for crisp chips.
• Chip labels are plain text — keep them to one word or two.
• Mark one chip with Highlight to point at your current campaign.

Good to know

• Hand-placed chips win. As soon as one Category chip block exists, the automatic collection list is replaced — remove all blocks to go back to auto.
• Chips are links, not product rows — they lead to collection pages.
• On phones the default is a wrapped grid of pills; switch on horizontal scrolling for a single swipeable line.

Example setups

Auto row. No blocks, auto-build on, 6 collections, “View all” on — zero-maintenance category row.

Campaign chips. Three hand-placed chips: “Toys”, “Treats”, “Sale” (highlighted), horizontal scrolling on for phones.

Common questions

My hand-picked chips don’t show the automatic collections anymore. That’s how it works — blocks replace the auto list. Delete the blocks to return to automatic.

A chip shows a generic icon instead of the collection photo. Only auto mode uses collection images as icons; hand-placed chips use the chosen icon. Pick Collection cover isn’t available here — the built-in icons are the options.

The row wraps onto two lines on my phone. Turn on Horizontal scrolling on mobile for one swipeable row, or accept the wrap — both are fine.