# Top 45 Cart Sections for Shopify (Updated Oct 2026) > Compare 45 free cart sections for Shopify across 15 themes: 42 ship as Liquid, 0 need 0 KB JS. Live demos, agent prompts. Updated Oct 2026. Page: https://blocko.ai/section/cart/ MCP: https://blocko.ai/mcp License: MIT. Not affiliated with Shopify. ## Items 1. [Cart service reassurance](https://blocko.ai/library/balm/sections/cart-checkout-service-strip/) (Balm, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/balm/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/balm/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Empty cart](https://blocko.ai/library/balm/sections/cart-checkout-cart-empty/) (Balm, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/balm/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/balm/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Cart service reassurance](https://blocko.ai/library/bare/sections/cart-checkout-service-strip/) (Bare, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/bare/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/bare/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Empty cart](https://blocko.ai/library/bare/sections/cart-checkout-cart-empty/) (Bare, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/bare/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/bare/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Cart service reassurance](https://blocko.ai/library/blush/sections/cart-checkout-service-strip/) (Blush, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/blush/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/blush/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Empty cart](https://blocko.ai/library/blush/sections/cart-checkout-cart-empty/) (Blush, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/blush/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/blush/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Cart service reassurance](https://blocko.ai/library/clip/sections/cart-checkout-service-strip/) (Clip, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/clip/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/clip/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Empty cart](https://blocko.ai/library/clip/sections/cart-checkout-cart-empty/) (Clip, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/clip/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/clip/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Cart service reassurance](https://blocko.ai/library/dew/sections/cart-checkout-service-strip/) (Dew, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/dew/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/dew/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Empty cart](https://blocko.ai/library/dew/sections/cart-checkout-cart-empty/) (Dew, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/dew/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/dew/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Cart service reassurance](https://blocko.ai/library/isle/sections/cart-checkout-service-strip/) (Isle, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/isle/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/isle/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Empty cart](https://blocko.ai/library/isle/sections/cart-checkout-cart-empty/) (Isle, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/isle/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/isle/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Cart service reassurance](https://blocko.ai/library/lather/sections/cart-checkout-service-strip/) (Lather, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/lather/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/lather/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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. [Empty cart](https://blocko.ai/library/lather/sections/cart-checkout-cart-empty/) (Lather, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/lather/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/lather/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 15. [Cart service reassurance](https://blocko.ai/library/prism/sections/cart-checkout-service-strip/) (Prism, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/prism/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/prism/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 16. [Empty cart](https://blocko.ai/library/prism/sections/cart-checkout-cart-empty/) (Prism, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/prism/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/prism/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 17. [Cart service reassurance](https://blocko.ai/library/shelf/sections/cart-checkout-service-strip/) (Shelf, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/shelf/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/shelf/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 18. [Empty cart](https://blocko.ai/library/shelf/sections/cart-checkout-cart-empty/) (Shelf, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/shelf/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/shelf/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 19. [Cart service reassurance](https://blocko.ai/library/stubble/sections/cart-checkout-service-strip/) (Stubble, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/stubble/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/stubble/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 20. [Empty cart](https://blocko.ai/library/stubble/sections/cart-checkout-cart-empty/) (Stubble, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/stubble/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/stubble/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 21. [Cart service reassurance](https://blocko.ai/library/tide/sections/cart-checkout-service-strip/) (Tide, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/tide/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/tide/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 22. [Empty cart](https://blocko.ai/library/tide/sections/cart-checkout-cart-empty/) (Tide, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/tide/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/tide/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 23. [Cart service reassurance](https://blocko.ai/library/tint/sections/cart-checkout-service-strip/) (Tint, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/tint/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/tint/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 24. [Empty cart](https://blocko.ai/library/tint/sections/cart-checkout-cart-empty/) (Tint, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/tint/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/tint/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 25. [Cart service reassurance](https://blocko.ai/library/twist/sections/cart-checkout-service-strip/) (Twist, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/twist/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/twist/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 26. [Empty cart](https://blocko.ai/library/twist/sections/cart-checkout-cart-empty/) (Twist, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/twist/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/twist/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 27. [Cart service reassurance](https://blocko.ai/library/veil/sections/cart-checkout-service-strip/) (Veil, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/veil/sections/cart--cart-checkout-service-strip.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 implement the section "Cart service reassurance" (id `cart-checkout-service-strip`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/cart--cart-checkout-service-strip.html; Shopify bundle: sections/veil/cart-checkout-service-strip/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 28. [Empty cart](https://blocko.ai/library/veil/sections/cart-checkout-cart-empty/) (Veil, beauty) - Shopify Liquid: ready; JavaScript: 7.3 KB; category: cart - Live demo: https://demo.blocko.ai/html/veil/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart" (id `cart-checkout-cart-empty`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/cart--cart-checkout-cart-empty.html; Shopify bundle: sections/veil/cart-checkout-cart-empty/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 29. [Populated cart](https://blocko.ai/library/balm/sections/cart-checkout-cart-main/) (Balm, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/balm/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/balm/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 30. [Populated cart](https://blocko.ai/library/bare/sections/cart-checkout-cart-main/) (Bare, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/bare/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/bare/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 31. [Populated cart](https://blocko.ai/library/blush/sections/cart-checkout-cart-main/) (Blush, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/blush/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/blush/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 32. [Populated cart](https://blocko.ai/library/clip/sections/cart-checkout-cart-main/) (Clip, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/clip/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/clip/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 33. [Populated cart](https://blocko.ai/library/dew/sections/cart-checkout-cart-main/) (Dew, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/dew/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/dew/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 34. [Populated cart](https://blocko.ai/library/isle/sections/cart-checkout-cart-main/) (Isle, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/isle/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/isle/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 35. [Populated cart](https://blocko.ai/library/lather/sections/cart-checkout-cart-main/) (Lather, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/lather/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/lather/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 36. [Populated cart](https://blocko.ai/library/prism/sections/cart-checkout-cart-main/) (Prism, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/prism/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/prism/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 37. [Populated cart](https://blocko.ai/library/shelf/sections/cart-checkout-cart-main/) (Shelf, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/shelf/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/shelf/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 38. [Populated cart](https://blocko.ai/library/stubble/sections/cart-checkout-cart-main/) (Stubble, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/stubble/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/stubble/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 39. [Populated cart](https://blocko.ai/library/tide/sections/cart-checkout-cart-main/) (Tide, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/tide/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/tide/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 40. [Populated cart](https://blocko.ai/library/tint/sections/cart-checkout-cart-main/) (Tint, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/tint/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/tint/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 41. [Populated cart](https://blocko.ai/library/twist/sections/cart-checkout-cart-main/) (Twist, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/twist/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/twist/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 42. [Populated cart](https://blocko.ai/library/veil/sections/cart-checkout-cart-main/) (Veil, beauty) - Shopify Liquid: ready; JavaScript: 8.2 KB; category: cart - Live demo: https://demo.blocko.ai/html/veil/sections/cart--cart-checkout-cart-main.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 implement the section "Populated cart" (id `cart-checkout-cart-main`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/cart--cart-checkout-cart-main.html; Shopify bundle: sections/veil/cart-checkout-cart-main/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 43. [Cart service notes](https://blocko.ai/library/tress/sections/cart-checkout-services/) (Tress, beauty) - Shopify Liquid: not yet (not migrated to neutral template); JavaScript: 3.4 KB; category: cart - Live demo: https://demo.blocko.ai/html/tress/sections/cart--cart-checkout-services.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 implement the section "Cart service notes" (id `cart-checkout-services`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/cart--cart-checkout-services.html; no Shopify bundle yet (not migrated to neutral template) — port it from the HTML demo demo/tress/sections/cart--cart-checkout-services.html into a Liquid section with a {% schema %}, mirroring the structure of an existing bundle in sections/veil/) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 44. [Editorial shopping bag](https://blocko.ai/library/tress/sections/cart-checkout-cart-main/) (Tress, beauty) - Shopify Liquid: not yet (not migrated to neutral template); JavaScript: 3.4 KB; category: cart - Live demo: https://demo.blocko.ai/html/tress/sections/cart--cart-checkout-cart-main.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 implement the section "Editorial shopping bag" (id `cart-checkout-cart-main`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/cart--cart-checkout-cart-main.html; no Shopify bundle yet (not migrated to neutral template) — port it from the HTML demo demo/tress/sections/cart--cart-checkout-cart-main.html into a Liquid section with a {% schema %}, mirroring the structure of an existing bundle in sections/veil/) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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). 45. [Empty cart drawer](https://blocko.ai/library/tress/sections/cart-checkout-cart-empty/) (Tress, beauty) - Shopify Liquid: not yet (not migrated to neutral template); JavaScript: 3.4 KB; category: cart - Live demo: https://demo.blocko.ai/html/tress/sections/cart--cart-checkout-cart-empty.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 implement the section "Empty cart drawer" (id `cart-checkout-cart-empty`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/cart--cart-checkout-cart-empty.html; no Shopify bundle yet (not migrated to neutral template) — port it from the HTML demo demo/tress/sections/cart--cart-checkout-cart-empty.html into a Liquid section with a {% schema %}, mirroring the structure of an existing bundle in sections/veil/) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme 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 cart sections for Shopify? Blocko lists 45 free, MIT-licensed cart sections from 15 themes. 42 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 Cart service reassurance from Balm comes first. ### Are these cart sections 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 cart sections 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 section should go before it changes any code. ### Which industries do these cart sections cover? Beauty. Every industry with at least three matching items has its own list. ### How much JavaScript do these cart sections ship? 0 of 45 ship 0 KB of JavaScript. The heaviest is Populated cart in Balm at 8.2 KB, registered as an idempotent Custom Element.