User Guide

Search limit to:






Breadcrumb

by Admin on Oct 22, 2025

Breadcrumb section shows the path users take to reach a page,  improving navigation.

1. Section Components

Section Breadcrumb Show the path users take to reach a page.

2. Location & Setup

To add & set up the Breadcrumb section:

  • Open the Shopify Theme Editor (Online store > Themes > Customize)
  • Decide where you want to place the new section (commonly below the header).
  • Click “Add Section”.
  • Select “OT: Breadcrumb”.

3. Highlight Features

  • Customizable appearance: Adjust separator icons, font styles, colors, and spacing to match your theme’s design.
  • Flexible display control: Set the maximum number of breadcrumb levels to keep the trail clean and focused.

4. Common Use Cases

🤔 How to set up Breadcrumb section display?

STEP 1: Add the Breadcrumb section to your desired location. Then click on the section to open its settings panel.

STEP 2: Separator settings

  • Select a Separator icon (e.g., em dash, slash, or arrow)
  • Adjust the Separator size.

STEP 3: Typography and alignment settings

  • Adjust spacing between letters.
  • To use a different font style, enable Use custom font and choose Font.
  • Choose Font size on desktop and mobile.
  • Choose how the Breadcrumb is aligned (Left, Center, Right)

STEP 4: Navigation settings

  • At Show home link, display or hide the Home link at the beginning of the breadcrumb trail.
  • Toggle Use home icon to replace the Home link with an icon for a cleaner look.
  • Limit how many breadcrumb levels are displayed at Max items.

STEP 5: Click “Save” when done.

🤔 How to make advanced customizations to the Breadcrumb section? 

Want to customize the color or desktop/mobile layout for the breadcrumb? Here's how:

STEP 1: Click on the Breadcrumb section to open its settings panel.

STEP 2: Customize color 

At Color settings group, you can choose color for text, separator...

STEP 3: Customize Desktop/Mobile layout

At Desktop/Mobile layout settings group, you can adjust section width and padding.

STEP 4: Click “Save” when done.

5. Layout Recommendations

If you want support to set up the layout, don't hesitate to chat with us!

📂 Breadcrumb

Check out demo here.

6. Layout Recommendations

Need help? Contact our support team at  Omni Themes Support .