← back to Dw Theme Frontpage Cta
front page: add reusable category-banner section + 7-banner preview + staged index (TK-10344)
6bd4afec8f9fae67b85211882a325a4577b53d78 · 2026-08-07 08:38:48 -0700 · Steve Abrams
Generalizes new-arrivals-banner into category-banner.liquid; stages 6 new
stacked banners (Brands/Collections/Styles/Commercial/Color/Material) after
New Arrivals, each over a real DW catalog product photo, linking to the live
nav targets. Live theme push gated to Steve.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Files touched
A index.with-category-banners.staged.jsonA preview-category-banners.htmlA sections/category-banner.liquid
Diff
commit 6bd4afec8f9fae67b85211882a325a4577b53d78
Author: Steve Abrams <steve@designerwallcoverings.com>
Date: Fri Aug 7 08:38:48 2026 -0700
front page: add reusable category-banner section + 7-banner preview + staged index (TK-10344)
Generalizes new-arrivals-banner into category-banner.liquid; stages 6 new
stacked banners (Brands/Collections/Styles/Commercial/Color/Material) after
New Arrivals, each over a real DW catalog product photo, linking to the live
nav targets. Live theme push gated to Steve.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
index.with-category-banners.staged.json | 487 ++++++++++++++++++++++++++++++++
preview-category-banners.html | 49 ++++
sections/category-banner.liquid | 68 +++++
3 files changed, 604 insertions(+)
diff --git a/index.with-category-banners.staged.json b/index.with-category-banners.staged.json
new file mode 100644
index 0000000..2b3e4fe
--- /dev/null
+++ b/index.with-category-banners.staged.json
@@ -0,0 +1,487 @@
+{
+ "sections": {
+ "home_slideshow_EXmkyD": {
+ "type": "home-slideshow",
+ "blocks": {
+ "slide_8gwUz8": {
+ "type": "slide",
+ "settings": {
+ "image": "shopify://shop_images/HomeHero.jpg",
+ "content-alignment": "center",
+ "overlay-color": "#ffffff",
+ "title": "Phyllis Morris",
+ "subheading": "Designer Selections",
+ "cta": "",
+ "url": "shopify://collections/phyllis-morris-classic-wallcovering",
+ "cta2": "Sign Up Now",
+ "url2": "/account/register"
+ }
+ }
+ },
+ "block_order": [
+ "slide_8gwUz8"
+ ],
+ "name": "Slideshow",
+ "settings": {
+ "layout": "content-width",
+ "controls-color": "#000000",
+ "autoplay": false,
+ "autoplay_delay": 3,
+ "autoplay-hover-pause": false
+ }
+ },
+ "home_masonry": {
+ "type": "home-masonry",
+ "blocks": {
+ "block_1": {
+ "type": "image_feature",
+ "settings": {
+ "title": "Shop Body",
+ "subheading": "",
+ "url": "",
+ "color": "white",
+ "mobile": true,
+ "show_overlay": false,
+ "overlay_color": "#000000",
+ "opacity": 1
+ }
+ },
+ "block_2": {
+ "type": "image_feature",
+ "settings": {
+ "title": "Shop Serums",
+ "subheading": "",
+ "url": "",
+ "color": "white",
+ "mobile": true,
+ "show_overlay": false,
+ "overlay_color": "#000000",
+ "opacity": 50
+ }
+ },
+ "block_3": {
+ "type": "image_feature",
+ "settings": {
+ "title": "Shop Toner & Masks",
+ "subheading": "",
+ "url": "",
+ "color": "white",
+ "mobile": true,
+ "show_overlay": false,
+ "overlay_color": "#000000",
+ "opacity": 15
+ }
+ },
+ "block_4": {
+ "type": "image_feature",
+ "settings": {
+ "title": "Shop Dryness",
+ "subheading": "",
+ "url": "",
+ "color": "white",
+ "mobile": true,
+ "show_overlay": false,
+ "overlay_color": "#000000",
+ "opacity": 100
+ }
+ },
+ "block_5": {
+ "type": "image_feature",
+ "settings": {
+ "title": "Shop Face",
+ "subheading": "",
+ "url": "",
+ "color": "white",
+ "mobile": true,
+ "show_overlay": false,
+ "overlay_color": "#000000",
+ "opacity": 50
+ }
+ }
+ },
+ "block_order": [
+ "block_1",
+ "block_2",
+ "block_3",
+ "block_4",
+ "block_5"
+ ],
+ "disabled": true,
+ "settings": {
+ "layout": "full-width",
+ "gutters": true,
+ "hover": true,
+ "hover-animation": true
+ }
+ },
+ "home_blog": {
+ "type": "home-blog",
+ "disabled": true,
+ "settings": {
+ "title": "Latest from Our Blog",
+ "blog": "designer-wallcoverings-news",
+ "number_of_columns": 3,
+ "number_of_rows": 1
+ }
+ },
+ "home_products-2": {
+ "type": "home-products",
+ "disabled": true,
+ "settings": {
+ "title": "Hollywood Hospitality Wallcoverings",
+ "collection": "hollywood-wallpaper-commercial-wallpaper",
+ "product-columns": 4,
+ "product-rows": 1
+ }
+ },
+ "home_products_98xHPG": {
+ "type": "home-products",
+ "disabled": true,
+ "name": "Featured collection",
+ "settings": {
+ "title": "Yeeha Cowboy Wallpaper",
+ "collection": "the-original-yeeha-cowboy-wallpaper",
+ "product-columns": 3,
+ "product-rows": 1
+ }
+ },
+ "home_product": {
+ "type": "home-product",
+ "blocks": {
+ "204ade9d-9c3b-4554-87aa-d454b0538034": {
+ "type": "vendor",
+ "settings": {}
+ },
+ "title": {
+ "type": "title",
+ "settings": {}
+ },
+ "price": {
+ "type": "price",
+ "settings": {}
+ },
+ "form": {
+ "type": "form",
+ "settings": {}
+ },
+ "description": {
+ "type": "description",
+ "settings": {}
+ }
+ },
+ "block_order": [
+ "204ade9d-9c3b-4554-87aa-d454b0538034",
+ "title",
+ "price",
+ "form",
+ "description"
+ ],
+ "disabled": true,
+ "settings": {
+ "product_handle": "",
+ "enable_cart_redirection": false,
+ "show_payment_button": true,
+ "images_layout": "slideshow",
+ "enable_zoom": true,
+ "enable_video_autoplay": false,
+ "enable_video_looping": false
+ }
+ },
+ "home_testimonials": {
+ "type": "home-testimonials",
+ "blocks": {
+ "testimonial-block-1": {
+ "type": "testimonial",
+ "settings": {
+ "quote": "Showcase up to eight testimonials to build trust with potential customers.",
+ "title": "Name",
+ "role": "Role"
+ }
+ },
+ "testimonial-block-2": {
+ "type": "testimonial",
+ "settings": {
+ "quote": "Showcase up to eight testimonials to build trust with potential customers.",
+ "title": "Name",
+ "role": "Role"
+ }
+ }
+ },
+ "block_order": [
+ "testimonial-block-1",
+ "testimonial-block-2"
+ ],
+ "disabled": true,
+ "settings": {
+ "title": "",
+ "per_row": 2,
+ "style": "filled"
+ }
+ },
+ "home_map": {
+ "type": "pxs-map",
+ "disabled": true,
+ "settings": {
+ "section_height": "small",
+ "title": "Local Curbside Pickup",
+ "content": "<p>After placing your order, we will contact you with a time and date to pick up your order anywhere from Monday-Friday!</p><p><span style=\"text-decoration:underline\"><strong>Contact us with any questions</strong></span></p>",
+ "text_alignment": "center",
+ "layout": "overlay-center-center",
+ "layout_mobile": "below",
+ "address": "1221 Broad St, Victoria, BC",
+ "api_key": "",
+ "enable_custom_colors": false,
+ "foreground_color": "#292929",
+ "background_color": "#ffffff",
+ "zoom": 1,
+ "overlay_color": "#000000",
+ "opacity": 10
+ }
+ },
+ "home_slideshow_Vz6PJq": {
+ "type": "home-slideshow",
+ "blocks": {
+ "slide_pDkNtC": {
+ "type": "slide",
+ "settings": {
+ "image": "shopify://shop_images/1386_Shot_14_763_rt_1440x640_1440x640_c5f2ddc0-f346-4be6-9f6c-35593680a9d0.webp",
+ "content-alignment": "center",
+ "overlay-color": "#ffffff",
+ "title": "Trade-Only Benefits",
+ "subheading": "Benefits for professionals and help from specialists",
+ "cta": "Apply Now",
+ "url": "https://www.designerwallcoverings.com/pages/trade-only-benefits"
+ }
+ }
+ },
+ "block_order": [
+ "slide_pDkNtC"
+ ],
+ "name": "Slideshow",
+ "settings": {
+ "layout": "content-width",
+ "controls-color": "#000000",
+ "autoplay": false,
+ "autoplay_delay": 3,
+ "autoplay-hover-pause": false
+ }
+ },
+ "home_slideshow_CHqc8a": {
+ "type": "home-slideshow",
+ "blocks": {
+ "slide_zex9hw": {
+ "type": "slide",
+ "settings": {
+ "image": "shopify://shop_images/digital_725x414_1440x640_1833146d-744e-447f-8d4c-693abe45e203.jpg",
+ "content-alignment": "center",
+ "overlay-color": "#262626",
+ "title": "Custom Walls and Fabrics",
+ "subheading": "Bring your vision to life with help from our design team",
+ "cta": "Learn More",
+ "url": "https://www.designerwallcoverings.com/pages/custom"
+ }
+ }
+ },
+ "block_order": [
+ "slide_zex9hw"
+ ],
+ "disabled": true,
+ "name": "Slideshow",
+ "settings": {
+ "layout": "content-width",
+ "controls-color": "#000000",
+ "autoplay": false,
+ "autoplay_delay": 3,
+ "autoplay-hover-pause": false
+ }
+ },
+ "home_image_with_text_overlay": {
+ "type": "pxs-image-with-text-overlay",
+ "settings": {
+ "section_height": "medium",
+ "image": "shopify://shop_images/Screenshot_2020-01-03_06.03.03_41380f97-3448-489e-82f4-abbb850ef39f.png",
+ "title": "",
+ "text": "",
+ "content_position": "center-center",
+ "color": "#ffffff",
+ "overlay_background": "#ffffff",
+ "overlay_opacity": 50,
+ "link": "",
+ "button_text": ""
+ }
+ },
+ "new_arrivals_banner": {
+ "type": "new-arrivals-banner",
+ "settings": {}
+ },
+ "natural_wallcoverings": {
+ "type": "natural-wallcoverings",
+ "blocks": {
+ "g": {
+ "type": "category",
+ "settings": {
+ "label": "Grasscloth",
+ "link": "/collections/grasscloth"
+ }
+ },
+ "p": {
+ "type": "category",
+ "settings": {
+ "label": "Paperweave",
+ "link": "/search?q=paperweave"
+ }
+ },
+ "s": {
+ "type": "category",
+ "settings": {
+ "label": "Sisal",
+ "link": "/collections/sisal"
+ }
+ },
+ "m": {
+ "type": "category",
+ "settings": {
+ "label": "Mica",
+ "link": "/collections/mica"
+ }
+ }
+ },
+ "block_order": [
+ "g",
+ "p",
+ "s",
+ "m"
+ ],
+ "settings": {}
+ },
+ "cb_brands": {
+ "type": "category-banner",
+ "settings": {
+ "image_url": "https://cdn.shopify.com/s/files/1/0015/4117/7456/files/119_3017_CS_0aa597e0-998b-4e12-81b5-3f8e21c56f18.jpg",
+ "focal": "center",
+ "height": 460,
+ "eyebrow": "The Houses",
+ "heading": "Brands",
+ "subheading": "The world's most coveted wallcovering houses, in one place.",
+ "cta_label": "EXPLORE BRANDS",
+ "cta_link": "/pages/brands",
+ "text_color": "#ffffff",
+ "accent": "#e4c88a",
+ "veil": "linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62))",
+ "cta_bg": "#ffffff",
+ "cta_text": "#26241f"
+ }
+ },
+ "cb_collections": {
+ "type": "category-banner",
+ "settings": {
+ "image_url": "https://cdn.shopify.com/s/files/1/0015/4117/7456/products/768728c53535e9159f8a0d9b0115ec64.jpg",
+ "focal": "center",
+ "height": 460,
+ "eyebrow": "Curated",
+ "heading": "Collections",
+ "subheading": "Signature collections, hand-picked by our designers.",
+ "cta_label": "BROWSE COLLECTIONS",
+ "cta_link": "/pages/collections",
+ "text_color": "#ffffff",
+ "accent": "#e4c88a",
+ "veil": "linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62))",
+ "cta_bg": "#ffffff",
+ "cta_text": "#26241f"
+ }
+ },
+ "cb_styles": {
+ "type": "category-banner",
+ "settings": {
+ "image_url": "https://cdn.shopify.com/s/files/1/0015/4117/7456/products/bd7973dcd77166a24805c136cd47ef7d_7a4033e4-81bd-4010-ab15-8a75a1b3892c.jpg",
+ "focal": "center",
+ "height": 460,
+ "eyebrow": "Find Your Look",
+ "heading": "Styles",
+ "subheading": "From traditional damask to bold modern geometrics.",
+ "cta_label": "SHOP BY STYLE",
+ "cta_link": "/pages/designer-wallpaper-styles",
+ "text_color": "#ffffff",
+ "accent": "#e4c88a",
+ "veil": "linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62))",
+ "cta_bg": "#ffffff",
+ "cta_text": "#26241f"
+ }
+ },
+ "cb_commercial": {
+ "type": "category-banner",
+ "settings": {
+ "image_url": "https://cdn.shopify.com/s/files/1/0015/4117/7456/products/heavy-madagascar-natural.jpg",
+ "focal": "center",
+ "height": 460,
+ "eyebrow": "Contract Grade",
+ "heading": "Commercial",
+ "subheading": "Type II vinyl, acoustic & durable surfaces for every project.",
+ "cta_label": "SHOP COMMERCIAL",
+ "cta_link": "/pages/commercial-wallcoverings",
+ "text_color": "#ffffff",
+ "accent": "#e4c88a",
+ "veil": "linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62))",
+ "cta_bg": "#ffffff",
+ "cta_text": "#26241f"
+ }
+ },
+ "cb_color": {
+ "type": "category-banner",
+ "settings": {
+ "image_url": "https://cdn.shopify.com/s/files/1/0015/4117/7456/files/GDT5542_001_8ede05e6-1fdb-4657-a6d0-5d6e4a4e4285.jpg",
+ "focal": "center",
+ "height": 460,
+ "eyebrow": "Shop By Hue",
+ "heading": "Color",
+ "subheading": "Every shade, from oatmeal to emerald.",
+ "cta_label": "SHOP BY COLOR",
+ "cta_link": "/pages/shop-by-color",
+ "text_color": "#ffffff",
+ "accent": "#e4c88a",
+ "veil": "linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62))",
+ "cta_bg": "#ffffff",
+ "cta_text": "#26241f"
+ }
+ },
+ "cb_material": {
+ "type": "category-banner",
+ "settings": {
+ "image_url": "https://cdn.shopify.com/s/files/1/0015/4117/7456/files/122919.jpg",
+ "focal": "center",
+ "height": 460,
+ "eyebrow": "Shop By Texture",
+ "heading": "Material",
+ "subheading": "Grasscloth, silk, cork, glass bead & more.",
+ "cta_label": "SHOP BY MATERIAL",
+ "cta_link": "/pages/shop-by-material",
+ "text_color": "#ffffff",
+ "accent": "#e4c88a",
+ "veil": "linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62))",
+ "cta_bg": "#ffffff",
+ "cta_text": "#26241f"
+ }
+ }
+ },
+ "order": [
+ "home_slideshow_EXmkyD",
+ "home_masonry",
+ "new_arrivals_banner",
+ "cb_brands",
+ "cb_collections",
+ "cb_styles",
+ "cb_commercial",
+ "cb_color",
+ "cb_material",
+ "natural_wallcoverings",
+ "home_blog",
+ "home_products-2",
+ "home_products_98xHPG",
+ "home_product",
+ "home_testimonials",
+ "home_map",
+ "home_slideshow_Vz6PJq",
+ "home_slideshow_CHqc8a",
+ "home_image_with_text_overlay"
+ ]
+}
\ No newline at end of file
diff --git a/preview-category-banners.html b/preview-category-banners.html
new file mode 100644
index 0000000..1fc6c15
--- /dev/null
+++ b/preview-category-banners.html
@@ -0,0 +1,49 @@
+<!doctype html><html lang="en"><head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>DW Front Page — Category Banners preview (TK-10344)</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&display=swap" rel="stylesheet">
+<style>
+ :root{ font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; }
+ *{ box-sizing:border-box; } body{ margin:0; background:#faf9f7; color:#26241f; }
+ .note{ padding:14px 20px; background:#26241f; color:#f5efe2; font-size:13px; letter-spacing:.3px; }
+ .note b{ color:#e4c88a; }
+ /* mirrors sections/category-banner.liquid */
+ .cb{ position:relative; min-height:460px; display:flex; flex-direction:column; align-items:center;
+ justify-content:center; text-align:center; gap:16px; padding:64px 24px; isolation:isolate;
+ background-position:center; background-size:cover; background-repeat:no-repeat; text-decoration:none; }
+ .cb::before{ content:""; position:absolute; inset:0; z-index:-1;
+ background:linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62)); }
+ .cb .ey{ font-size:13px; letter-spacing:4px; font-weight:600; color:#e4c88a; margin:0; text-transform:uppercase; }
+ .cb h2{ font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:clamp(34px,5vw,64px);
+ line-height:1.04; color:#fff; margin:0; max-width:760px; }
+ .cb p{ color:#fff; opacity:.9; font-size:16px; max-width:520px; margin:0; }
+ .cb .cta{ margin-top:8px; display:inline-block; background:#fff; color:#26241f; border-radius:999px;
+ padding:15px 34px; font-size:13px; font-weight:600; letter-spacing:1.5px; }
+ @media(max-width:749px){ .cb{ min-height:331px; padding:48px 20px; } }
+</style></head><body>
+<div class="note">Preview of <b>7 stacked category banners</b> for the DW front page — section <b>category-banner.liquid</b> · ticket <b>TK-10344</b>. Static replica of the live section CSS; backgrounds are real DW catalog product photos. Live theme push is gated to Steve.</div>
+
+<a class="cb" href="/collections/new-arrivals" style="background-image:url('https://cdn.shopify.com/s/files/1/0015/4117/7456/files/mr-abh-1177-Maya_Romanoff_3.jpg')">
+ <span class="ey">Just In</span><h2>New Arrivals</h2><p>The season's latest luxury walls & fabrics.</p><span class="cta">SHOP NEW ARRIVALS</span></a>
+
+<a class="cb" href="/pages/brands" style="background-image:url('https://cdn.shopify.com/s/files/1/0015/4117/7456/files/119_3017_CS_0aa597e0-998b-4e12-81b5-3f8e21c56f18.jpg')">
+ <span class="ey">The Houses</span><h2>Brands</h2><p>The world's most coveted wallcovering houses, in one place.</p><span class="cta">EXPLORE BRANDS</span></a>
+
+<a class="cb" href="/pages/collections" style="background-image:url('https://cdn.shopify.com/s/files/1/0015/4117/7456/products/768728c53535e9159f8a0d9b0115ec64.jpg')">
+ <span class="ey">Curated</span><h2>Collections</h2><p>Signature collections, hand-picked by our designers.</p><span class="cta">BROWSE COLLECTIONS</span></a>
+
+<a class="cb" href="/pages/designer-wallpaper-styles" style="background-image:url('https://cdn.shopify.com/s/files/1/0015/4117/7456/products/bd7973dcd77166a24805c136cd47ef7d_7a4033e4-81bd-4010-ab15-8a75a1b3892c.jpg')">
+ <span class="ey">Find Your Look</span><h2>Styles</h2><p>From traditional damask to bold modern geometrics.</p><span class="cta">SHOP BY STYLE</span></a>
+
+<a class="cb" href="/pages/commercial-wallcoverings" style="background-image:url('https://cdn.shopify.com/s/files/1/0015/4117/7456/products/heavy-madagascar-natural.jpg')">
+ <span class="ey">Contract Grade</span><h2>Commercial</h2><p>Type II vinyl, acoustic & durable surfaces for every project.</p><span class="cta">SHOP COMMERCIAL</span></a>
+
+<a class="cb" href="/pages/shop-by-color" style="background-image:url('https://cdn.shopify.com/s/files/1/0015/4117/7456/files/GDT5542_001_8ede05e6-1fdb-4657-a6d0-5d6e4a4e4285.jpg')">
+ <span class="ey">Shop By Hue</span><h2>Color</h2><p>Every shade, from oatmeal to emerald.</p><span class="cta">SHOP BY COLOR</span></a>
+
+<a class="cb" href="/pages/shop-by-material" style="background-image:url('https://cdn.shopify.com/s/files/1/0015/4117/7456/files/122919.jpg')">
+ <span class="ey">Shop By Texture</span><h2>Material</h2><p>Grasscloth, silk, cork, glass bead & more.</p><span class="cta">SHOP BY MATERIAL</span></a>
+
+<div class="note">End of preview · 7 banners · New Arrivals reuses the existing section; the other 6 are new <b>category-banner</b> placements.</div>
+</body></html>
diff --git a/sections/category-banner.liquid b/sections/category-banner.liquid
new file mode 100644
index 0000000..a11c01a
--- /dev/null
+++ b/sections/category-banner.liquid
@@ -0,0 +1,68 @@
+{%- comment -%}
+ Category Banner — reusable full-width statement banner over a catalog product
+ photo, links to a category collection/menu target. Generalized from
+ new-arrivals-banner so it can be placed once per nav tab (New Arrivals,
+ Brands, Collections, Styles, Commercial, Color, Material). Each placement
+ carries its own image, copy, link and veil via section settings.
+{%- endcomment -%}
+{%- liquid
+ assign rid = section.id
+ assign fb = 'https://cdn.shopify.com/s/files/1/0015/4117/7456/files/mr-abh-1177-Maya_Romanoff_3.jpg'
+ assign bg = fb
+ if section.settings.image != blank
+ assign bg = section.settings.image | image_url: width: 2400
+ elsif section.settings.image_url != blank
+ assign bg = section.settings.image_url
+ endif
+ assign pos = section.settings.focal | default: 'center'
+-%}
+<style>
+ .cb-{{ rid }}{ position:relative; min-height:{{ section.settings.height }}px; display:flex; flex-direction:column;
+ align-items:center; justify-content:center; text-align:center; gap:16px; padding:64px 24px;
+ background:url('{{ bg }}') {{ pos }}/cover no-repeat; isolation:isolate; }
+ .cb-{{ rid }}::before{ content:""; position:absolute; inset:0; z-index:-1; background:{{ section.settings.veil }}; }
+ .cb-{{ rid }} .ey{ font-size:13px; letter-spacing:4px; font-weight:600; color:{{ section.settings.accent }}; margin:0; text-transform:uppercase; }
+ .cb-{{ rid }} h2{ font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:clamp(34px,5vw,64px);
+ line-height:1.04; color:{{ section.settings.text_color }}; margin:0; max-width:760px; }
+ .cb-{{ rid }} p{ color:{{ section.settings.text_color }}; opacity:.9; font-size:16px; max-width:520px; margin:0; }
+ .cb-{{ rid }} .cta{ margin-top:8px; display:inline-block; background:{{ section.settings.cta_bg }}; color:{{ section.settings.cta_text }};
+ border-radius:999px; padding:15px 34px; font-size:13px; font-weight:600; letter-spacing:1.5px; text-decoration:none; }
+ @media(max-width:749px){ .cb-{{ rid }}{ min-height:{{ section.settings.height | times: 0.72 | round }}px; padding:48px 20px; } }
+</style>
+<a class="cb-{{ rid }}" href="{{ section.settings.cta_link | default: '/collections/all' }}" style="text-decoration:none;" aria-label="{{ section.settings.heading | escape }}">
+ {%- if section.settings.eyebrow != blank -%}<span class="ey">{{ section.settings.eyebrow }}</span>{%- endif -%}
+ <h2>{{ section.settings.heading }}</h2>
+ {%- if section.settings.subheading != blank -%}<p>{{ section.settings.subheading }}</p>{%- endif -%}
+ {%- if section.settings.cta_label != blank -%}<span class="cta">{{ section.settings.cta_label }}</span>{%- endif -%}
+</a>
+
+{% schema %}
+{
+ "name": "Category Banner",
+ "tag": "section",
+ "class": "section-category-banner",
+ "settings": [
+ { "type": "image_picker", "id": "image", "label": "Background image (catalog photo)" },
+ { "type": "text", "id": "image_url", "label": "…or background image URL", "info": "Used only when no image is picked above." },
+ { "type": "select", "id": "focal", "label": "Image focal point", "default": "center", "options": [
+ { "value": "center", "label": "Center" },
+ { "value": "top", "label": "Top" },
+ { "value": "bottom", "label": "Bottom" },
+ { "value": "left", "label": "Left" },
+ { "value": "right", "label": "Right" }
+ ] },
+ { "type": "range", "id": "height", "min": 300, "max": 640, "step": 20, "unit": "px", "label": "Height", "default": 460 },
+ { "type": "text", "id": "eyebrow", "label": "Eyebrow", "default": "EXPLORE" },
+ { "type": "text", "id": "heading", "label": "Heading", "default": "Category" },
+ { "type": "text", "id": "subheading", "label": "Subheading" },
+ { "type": "text", "id": "cta_label", "label": "Button label", "default": "SHOP NOW" },
+ { "type": "url", "id": "cta_link", "label": "Button link" },
+ { "type": "color", "id": "text_color", "label": "Text color", "default": "#ffffff" },
+ { "type": "color", "id": "accent", "label": "Eyebrow accent", "default": "#e4c88a" },
+ { "type": "color_background", "id": "veil", "label": "Image veil (legibility)", "default": "linear-gradient(rgba(30,25,18,.35),rgba(30,25,18,.62))" },
+ { "type": "color", "id": "cta_bg", "label": "Button background", "default": "#ffffff" },
+ { "type": "color", "id": "cta_text", "label": "Button text", "default": "#26241f" }
+ ],
+ "presets": [ { "name": "Category Banner" } ]
+}
+{% endschema %}
← 6a22e98 auto-save: 2026-07-20T16:33:10 (1 files) — snippets/mobile-n
·
back to Dw Theme Frontpage Cta
·
front page: Brands banner -> full-bleed landscape image (wid bc4c2c8 →