Blocko

Top 29 Navigation Blocks for Shopify (Updated Oct 2026)

Blocko has 29 free navigation blocks for Shopify Online Store 2.0, from 15 themes across beauty. 28 ship as Shopify Liquid with merchant settings; 14 need no JavaScript at all. Each one has a live demo and a one-line prompt for your coding agent.

The list is ranked with Shopify-ready items first, then by the least JavaScript. Open any item to see its sections, settings and prompt, or use all blocks by type to compare other kinds. Not affiliated with Shopify.

Compare at a glance

#NameThemeIndustryShopifyJavaScriptSettings
1BreadcrumbBalmBeautyLiquid + HTML0 KB2
2BreadcrumbBareBeautyLiquid + HTML0 KB2
3BreadcrumbBlushBeautyLiquid + HTML0 KB2
4BreadcrumbClipBeautyLiquid + HTML0 KB2
5BreadcrumbDewBeautyLiquid + HTML0 KB2
6BreadcrumbIsleBeautyLiquid + HTML0 KB2
7BreadcrumbLatherBeautyLiquid + HTML0 KB2
8BreadcrumbPrismBeautyLiquid + HTML0 KB2
9BreadcrumbShelfBeautyLiquid + HTML0 KB2
10BreadcrumbStubbleBeautyLiquid + HTML0 KB2
11BreadcrumbTideBeautyLiquid + HTML0 KB2
12BreadcrumbTintBeautyLiquid + HTML0 KB2
13BreadcrumbTwistBeautyLiquid + HTML0 KB2
14BreadcrumbVeilBeautyLiquid + HTML0 KB2
15Back-to-top buttonBalmBeautyLiquid + HTML9.3 KB1
16Back-to-top buttonBareBeautyLiquid + HTML9.3 KB1
17Back-to-top buttonBlushBeautyLiquid + HTML9.3 KB1
18Back-to-top buttonClipBeautyLiquid + HTML9.3 KB1
19Back-to-top buttonDewBeautyLiquid + HTML9.3 KB1
20Back-to-top buttonIsleBeautyLiquid + HTML9.3 KB1

Navigation blocks

Frequently asked questions

What are the best navigation blocks for Shopify?

Blocko lists 29 free, MIT-licensed navigation blocks from 15 themes. 28 of them ship as Shopify Liquid today and the rest are complete HTML demos. The list is ranked with Liquid-ready items first, then by the least JavaScript, so Breadcrumb from Balm comes first.

Are these navigation blocks free to use?

Yes. Every item is MIT licensed, free to copy and edit, and needs no app or subscription. Blocko is not affiliated with Shopify.

How do I add one of these navigation blocks to my Shopify store?

Open an item, copy its one-line prompt into your coding agent, or connect the Blocko MCP server at https://blocko.ai/mcp. The agent asks where the block should go before it changes any code.

Which industries do these navigation blocks cover?

Beauty. Every industry with at least three matching items has its own list.

How much JavaScript do these navigation blocks ship?

14 of 29 ship 0 KB of JavaScript. The heaviest is Back-to-top button in Balm at 9.3 KB, registered as an idempotent Custom Element.

Related lists

Filter by industry

Other blocks

Markdown version for agents · Browse the full library · Connect your agent