Collection Subcategory Menu Setup Guide

A collection-specific menu helps shoppers move between related subcategories without returning to the home page. This example starts with a lighting department and links to its child collections. Use KOBU collection display rules so the menu appears where those choices are relevant.

Setup tutorial · KOBU · Updated 2026-09-07 · By Activory

Try the storefront example

Select a menu item to inspect its destination. Use Phone width to check the labels and layout. The example paths represent collections or pages you will create in your store.

Storefront example

This example uses KOBU storefront code with sample data and the settings below. Your theme’s fonts and available width can change the result. Example links show their destination; purchase controls use a sample cart. Use the checks below to confirm the finished setup in your store.

Build it in KOBU

  1. Create the destination collections or pages in Shopify. Use the labels and paths below as your example plan. Confirm that each destination is published.
  2. In KOBU, add each menu item to Group 1. Enter its title and destination. Add an SVG icon or your own image. Publish the items.
  3. Open the page template in the Shopify theme editor. Add Kobu - Menu Highlight. Choose menu group 1 and the Circle shape.
  4. Set Menu mode to Rows & Columns. Use 80 px width, 80 px height, 16 px gap, and 14 px label text. Keep the title visible. Save the theme.

Example settings

  • The example uses blue SVG icons on a pale background. Use the same icon style for each item, or replace all icons with consistently framed product images.

Sample data and content

Use these values for a test. Replace them with checked product data, published destinations, and offers that your store can supply.

Menu labelExample destinationImage or iconPurpose
All lighting/collections/lightingDepartment imageParent collection
Pendant lights/collections/pendant-lightsPendant imageFixture type
Table lamps/collections/table-lampsTable lamp imageFixture type
Floor lamps/collections/floor-lampsFloor lamp imageFixture type
Wall lights/collections/wall-lightsWall light imageFixture type

How should a subcategory menu link back to its department?

Keep the current department understandable. Include an all-items destination if customers need a route back to the parent collection. Child collections should use one clear organizing rule, such as fixture type. Mixing fixture types, colours, and prices in one short menu can make choices overlap.

  1. Build the parent and child collections in Shopify. Check their rules and confirm that each child has a distinct purpose.
  2. Create the menu items in KOBU and set their real collection links. Use labels that match the destination headings.
  3. Apply the menu to the intended collection pages through the supported display settings.
  4. Visit an unrelated department and confirm the lighting menu does not appear there by mistake.

Read the KOBU setup guide for the full app controls and placement options.

Check the finished setup

  • Open each child collection and confirm customers can still find the parent range.
  • Check that the same item is not duplicated under two menu labels with identical destinations.
  • Test the visibility rules on both the parent and an unrelated collection page.

Common mistakes

  • Do not treat a visual menu as a replacement for configuring the actual collection rules.
  • Do not show a department-specific menu across the entire store without checking its relevance.

Supported use

KOBU links shoppers to the destinations you configure. A menu label does not create a collection, apply a discount, reserve stock, or make a product suitable for a customer. Confirm each destination and its contents. Keep text labels visible so that images are not the only way to understand a link.

KOBU features, current app plans, and KOBU collection display rules explain the supported setup.

Browse all KOBU tutorials. Read how the examples are made or report a correction.

Was this page helpful?