# Top 14 PDP Bundle Pages for Shopify (Updated Oct 2026)

> Compare 14 free pdp bundle page templates for Shopify across 14 themes: 14 ship as Liquid, 0 need 0 KB JS. Live demos, agent prompts. Updated Oct 2026.

Page: https://blocko.ai/type/pdp-bundle/
MCP: https://blocko.ai/mcp
License: MIT. Not affiliated with Shopify.

## Items

1. [Build Your Routine](https://blocko.ai/library/balm/pages/pdp-bundle/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/balm/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/balm/, HTML in demo/balm/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
2. [Build Your Routine](https://blocko.ai/library/bare/pages/pdp-bundle/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/bare/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/bare/, HTML in demo/bare/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
3. [Build Your Everyday](https://blocko.ai/library/blush/pages/pdp-bundle/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/blush/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Everyday" (template `pdp-bundle`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/blush/, HTML in demo/blush/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
4. [Build Your Style](https://blocko.ai/library/clip/pages/pdp-bundle/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/clip/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Style" (template `pdp-bundle`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/clip/, HTML in demo/clip/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
5. [Build Your Routine](https://blocko.ai/library/dew/pages/pdp-bundle/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/dew/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/dew/, HTML in demo/dew/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
6. [Build Your Routine](https://blocko.ai/library/isle/pages/pdp-bundle/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/isle/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/isle/, HTML in demo/isle/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
7. [Build Your Routine](https://blocko.ai/library/lather/pages/pdp-bundle/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/lather/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/lather/, HTML in demo/lather/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
8. [Build Your System](https://blocko.ai/library/prism/pages/pdp-bundle/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/prism/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your System" (template `pdp-bundle`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/prism/, HTML in demo/prism/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
9. [Build Your Concern](https://blocko.ai/library/shelf/pages/pdp-bundle/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/shelf/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Concern" (template `pdp-bundle`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/shelf/, HTML in demo/shelf/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
10. [Build Your Routine](https://blocko.ai/library/stubble/pages/pdp-bundle/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/stubble/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/stubble/, HTML in demo/stubble/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
11. [Build Your Routine](https://blocko.ai/library/tide/pages/pdp-bundle/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/tide/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/tide/, HTML in demo/tide/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
12. [Build Your Color](https://blocko.ai/library/tint/pages/pdp-bundle/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/tint/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Color" (template `pdp-bundle`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/tint/, HTML in demo/tint/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
13. [Build Your Routine](https://blocko.ai/library/twist/pages/pdp-bundle/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/twist/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/twist/, HTML in demo/twist/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
14. [Build Your Routine](https://blocko.ai/library/veil/pages/pdp-bundle/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 17 KB; category: page
   - Live demo: https://demo.blocko.ai/html/veil/templates/pdp-bundle.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to build the page "Build Your Routine" (template `pdp-bundle`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/templates/pdp-bundle.html) in my project. It is made of these sections in order: pdp-bundle-builder, pdp-bundle-explainer, product-recommendations, newsletter (bundles under sections/veil/, HTML in demo/veil/sections/). Before changing any code, ask me which project/theme it belongs to, whether it should be a new page/template or replace/extend an existing one (and which), which sections to keep or drop, and whether the target is a Shopify theme (JSON template) or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).

## FAQ

### What are the best pdp bundle page templates for Shopify?

Blocko lists 14 free, MIT-licensed pdp bundle page templates from 14 themes. 14 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 Build Your Routine from Balm comes first.

### Are these pdp bundle page templates 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 pdp bundle page templates 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 page template should go before it changes any code.

### Which industries do these pdp bundle page templates cover?

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

### How much JavaScript do these pdp bundle page templates ship?

0 of 14 ship 0 KB of JavaScript. The heaviest is Build Your Routine in Balm at 17 KB, registered as an idempotent Custom Element.

