← back to Designer Wallcoverings
Reconcile 5 collection memos: merge sections/collection.liquid (hero render + toolbar cleanup) and consolidate ALL fixes onto single dev theme 143947038771 (DTD Option-A)
f9adefec5406f02e3f9d13d922110a7ca4092aa1 · 2026-06-23 16:21:27 -0700 · Steve
- Merged collection.liquid = Memo A (removes native #sort-by + collection-grid-density.js) + Memo D hero render line; 25/25 liquid balance
- Pushed merged collection.liquid + Memo A collection-toolbar.liquid (null-guard) + Memo A layout/theme.liquid onto dev 143947038771
- dev now carries all fixes from memos A/B/C(superseded by D)/D/E coexisting; 11/11 structural checks PASS
- LIVE push HELD: final pixel-confirm requires Steve's authenticated dev-Preview (anonymous ?preview_theme_id= serves live theme, not verifiable headless)
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Files touched
A shopify/collection-hero-fix/backups/consolidation-2026-06-23/layout_theme.liquid.dev-143947038771.beforeA shopify/collection-hero-fix/backups/consolidation-2026-06-23/sections_collection.liquid.dev-143947038771.beforeA shopify/collection-hero-fix/backups/consolidation-2026-06-23/snippets_collection-toolbar.liquid.dev-143947038771.beforeA shopify/collection-hero-fix/patched/sections_collection.MERGED.liquid
Diff
commit f9adefec5406f02e3f9d13d922110a7ca4092aa1
Author: Steve <steve@designerwallcoverings.com>
Date: Tue Jun 23 16:21:27 2026 -0700
Reconcile 5 collection memos: merge sections/collection.liquid (hero render + toolbar cleanup) and consolidate ALL fixes onto single dev theme 143947038771 (DTD Option-A)
- Merged collection.liquid = Memo A (removes native #sort-by + collection-grid-density.js) + Memo D hero render line; 25/25 liquid balance
- Pushed merged collection.liquid + Memo A collection-toolbar.liquid (null-guard) + Memo A layout/theme.liquid onto dev 143947038771
- dev now carries all fixes from memos A/B/C(superseded by D)/D/E coexisting; 11/11 structural checks PASS
- LIVE push HELD: final pixel-confirm requires Steve's authenticated dev-Preview (anonymous ?preview_theme_id= serves live theme, not verifiable headless)
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
.../layout_theme.liquid.dev-143947038771.before | 1036 ++++++++++++++++++++
...tions_collection.liquid.dev-143947038771.before | 262 +++++
...llection-toolbar.liquid.dev-143947038771.before | 307 ++++++
.../patched/sections_collection.MERGED.liquid | 242 +++++
4 files changed, 1847 insertions(+)
diff --git a/shopify/collection-hero-fix/backups/consolidation-2026-06-23/layout_theme.liquid.dev-143947038771.before b/shopify/collection-hero-fix/backups/consolidation-2026-06-23/layout_theme.liquid.dev-143947038771.before
new file mode 100644
index 00000000..fea4675f
--- /dev/null
+++ b/shopify/collection-hero-fix/backups/consolidation-2026-06-23/layout_theme.liquid.dev-143947038771.before
@@ -0,0 +1,1036 @@
+{% comment %}DW-CHINA-BLOCK-START{% endcomment %}
+{% assign dw_blocked_countries = "CN" | split: "," %}
+{% assign dw_visitor_country = localization.country.iso_code | upcase %}
+{% assign dw_is_blocked = false %}
+{% for dw_bc in dw_blocked_countries %}
+ {% assign dw_bc_trimmed = dw_bc | strip %}
+ {% if dw_visitor_country == dw_bc_trimmed %}
+ {% assign dw_is_blocked = true %}
+ {% endif %}
+{% endfor %}
+
+{% if dw_is_blocked %}
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<!-- DW-CHINA-JS-BLOCK-START -->
+<script>
+(function() {
+ var blockedCountries = ['CN'];
+ fetch('/browsing_context_suggestions.json', {method: 'GET', credentials: 'same-origin'})
+ .then(function(r) { return r.json(); })
+ .catch(function() { return null; })
+ .then(function(data) {
+ if (data && data.detected_values && data.detected_values.country && data.detected_values.country.handle) {
+ var detectedCountry = data.detected_values.country.handle.toUpperCase();
+ if (blockedCountries.indexOf(detectedCountry) !== -1) {
+ var container = document.createElement('div');
+ container.innerHTML = '<div style="position:fixed;top:0;left:0;width:100%;height:100%;background:#f5f5f5;z-index:999999;display:flex;align-items:center;justify-content:center;font-family:-apple-system,BlinkMacSystemFont,sans-serif"><div style="text-align:center;padding:60px 40px;background:#fff;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,.08);max-width:520px;width:90%"><div style="font-size:48px;margin-bottom:20px">🌐</div><h1 style="font-size:24px;margin-bottom:16px;font-weight:600;color:#333">Region Not Available</h1><p style="font-size:16px;line-height:1.6;color:#666;margin-bottom:12px">This store is not available in your region.</p><p style="font-size:16px;line-height:1.6;color:#666">We do not ship to or serve customers in your area at this time.</p></div></div>';
+ document.body.innerHTML = '';
+ document.body.appendChild(container);
+ }
+ }
+ });
+})();
+</script>
+<!-- DW-CHINA-JS-BLOCK-END -->
+
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Region Not Available</title>
+ <style>
+ * { margin: 0; padding: 0; box-sizing: border-box; }
+ body {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+ background: #f5f5f5;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ min-height: 100vh;
+ color: #333;
+ }
+ .container {
+ text-align: center;
+ padding: 60px 40px;
+ background: white;
+ border-radius: 12px;
+ box-shadow: 0 4px 24px rgba(0,0,0,0.08);
+ max-width: 520px;
+ width: 90%;
+ }
+ .icon { font-size: 48px; margin-bottom: 20px; }
+ h1 { font-size: 24px; margin-bottom: 16px; font-weight: 600; }
+ p { font-size: 16px; line-height: 1.6; color: #666; margin-bottom: 12px; }
+ .contact { margin-top: 24px; font-size: 14px; color: #999; }
+ .contact a { color: #2563eb; text-decoration: none; }
+ </style>
+
+
+
+
+
+<!-- cache-bust: 2026-03-25T00:54:55.724677 -->
+</head>
+<body>
+ <div class="container">
+ <div class="icon">🌐</div>
+ <h1>Region Not Available</h1>
+ <p>We're sorry, but this store is not available in your region.</p>
+ <p>We do not ship to or serve customers in your area at this time.</p>
+ <div class="contact">
+ Questions? Contact us at <a href="mailto:info@designerwallcoverings.com">info@designerwallcoverings.com</a>
+ </div>
+ </div>
+
+
+</body>
+</html>
+{% break %}
+{% endif %}
+{% comment %}DW-CHINA-BLOCK-END{% endcomment %}
+
+<!doctype html>
+<html
+ class="
+ no-js
+ loading
+ "
+ lang="{{ request.locale.iso_code }}"
+>
+<head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+
+ <!-- Preconnect Domains -->
+ <link rel="preconnect" href="https://cdn.shopify.com" crossorigin>
+ <link rel="preconnect" href="https://fonts.shopify.com" crossorigin>
+ <link rel="preconnect" href="https://monorail-edge.shopifysvc.com">
+
+ <!-- Preload Assets -->
+ <link rel="preload" href="{{ 'chiko-icons.woff' | asset_url }}" as="font" type="font/woff" crossorigin>
+ <link rel="preload" href="{{ 'pxu-social-icons.woff' | asset_url }}" as="font" type="font/woff" crossorigin>
+
+ <link rel="preload" href="{{ 'theme.css' | asset_url }}" as="style">
+
+ <link rel="preload" href="{{ 'modernizr-2.8.2.min.js' | asset_url }}" as="script">
+
+ {% if template contains 'cart' %}
+ <link rel="preload" href="{{ '/services/javascripts/countries.js' }}" as="script">
+ <link rel="preload" href="{{ 'shopify_common.js' | shopify_asset_url }}" as="script">
+ {% endif %}
+
+ {% if template contains 'customers' %}
+ <link rel="preload" href="{{ 'shopify_common.js' | shopify_asset_url }}" as="script">
+ <link rel="preload" href="{{ 'customer_area.js' | shopify_asset_url }}" as="script">
+ {% endif %}
+
+ <link rel="preload" href="{{ 'grid.js' | asset_url }}" as="script">
+
+ <script src="//cdata.modernpostcard.com/js/E3CA4636CEDAD4.js" async defer></script>
+
+ <title>
+ {{ page_title }}
+
+ {% if current_tags %}
+ – {{ current_tags | join: ', ' }}
+ {% endif %}
+
+ {% if current_page != 1 %}
+ – {{ 'general.pagination.page' | t: page_number: current_page }}
+ {% endif %}
+
+ {% unless page_title contains shop.name %}
+ – {{ shop.name }}
+ {% endunless %}
+ </title>
+
+ {% if page_description %}
+ <meta name="description" content="{{ page_description | escape }}" />
+ {% endif %}
+
+ {% if settings.favicon %}
+ <link rel="shortcut icon" href="{{ settings.favicon | img_url: '32x32' }}" type="image/png" />
+ {% endif %}
+
+ {% if template contains 'collection' and current_tags %}
+ <meta name="robots" content="noindex" />
+ <link rel="canonical" href="{{ shop.url }}{{ collection.url }}" />
+ {% else %}
+ <link rel="canonical" href="{{ canonical_url }}" />
+ {% endif %}
+ <meta name="viewport" content="width=device-width,initial-scale=1" />
+
+ {%- render 'head.import-map' -%}
+ {%- render 'head.is-land' -%}
+
+ {% comment %}
+ {% render 'boost-sd-fallback' %}
+ {% endcomment %}
+ {{ content_for_header }}
+
+ {% liquid
+ assign heading_text_transform = 'none'
+ if settings.heading-font-small-caps
+ assign heading_text_transform = 'uppercase'
+ endif
+
+ assign button_text_transform = 'none'
+ assign button_letter_spacing = '0em'
+ if settings.button-font-small-caps
+ assign button_text_transform = 'uppercase'
+ assign button_letter_spacing = '0.05em'
+ endif
+ %}
+
+ <style>
+ :root {
+ /* ------------------------------------------------------------
+ Typography
+ ------------------------------------------------------------ */
+ /* Body */
+ --element-text-font-size--body-lg: 1.286rem; /* Product price */
+ --element-text-font-size--body-sm: var(--text-size-3-5); /* SKU, installments, variant labels */
+ --element-text-font-family--body: {{ settings.font_body.family }}, {{ settings.font_body.fallback_families }};
+ --element-text-font-weight--body: {{ settings.font_body.weight }};
+
+ /* Headings */
+ --element-text-font-size--heading-xl: 2.5rem; /* Product title */
+ --element-text-font-family--heading: {{ settings.font_heading.family }}, {{ settings.font_heading.fallback_families }};
+ --element-text-font-weight--heading: {{ settings.font_heading.weight }};
+ --element-text-line-height--heading: 1.25;
+ --element-text-text-transform--heading: {{ heading_text_transform }};
+
+ /* Buttons */
+ --element-button-font-family: {{ settings.font_button.family }}, {{ settings.font_button.fallback_families }};
+ --element-button-text-transform: {{ button_text_transform }};
+ --element-button-letter-spacing: {{ button_letter_spacing }};
+
+ /* ------------------------------------------------------------
+ Colors
+ ------------------------------------------------------------ */
+ --color-primary: {{ settings['body-text-color'] }};
+ --color-secondary: {{ settings['background-color'] }};
+ --root-color-primary: {{ settings['body-text-color'] }};
+ --root-color-secondary: {{ settings['background-color'] }};
+ --color-focus: #0000ff;
+
+ --color-sale-tag-text: {{ settings['background-color'] }};
+ --color-sale-tag: {{ settings['product-badge-background-color'] }};
+
+ --element-button-color-primary: {{ settings['button-color'] }};
+ --element-button-color-secondary: {{ settings['accent-color'] }};
+
+ --element-text-color: {{ settings['body-text-color'] }};
+ --element-text-color--heading: {{ settings['heading-color'] }};
+
+ --element-input-color-primary: {{ settings['form-select-color'] }};
+ --element-input-color-secondary: {{ settings['form-select-background'] }};
+
+ /* ------------------------------------------------------------
+ Other
+ ------------------------------------------------------------ */
+ --element-badge-radius: 2px;
+ --element-button-radius: 2px;
+
+ --layout-section-max-inline-size: 1260px;
+ --layout-section-padding-inline: 30px;
+ }
+
+ /* ------------------------------------------------------------
+ Component overrides
+ ------------------------------------------------------------ */
+
+ ::before,
+ ::after {
+ box-sizing: content-box;
+ }
+ product-hot-reload ::before,
+ product-hot-reload ::after {
+ box-sizing: border-box;
+ }
+
+ /* Lightbox */
+ .overlay-lightbox__overlay {
+ z-index: 9999;
+ }
+
+ /* Pick up */
+ .element-icon-in-stock {
+ fill: currentColor;
+ }
+
+ /* Divider */
+ hr.element-divider {
+ height: 0;
+ background: transparent;
+ }
+
+ /* Drawer */
+ overlay-drawer .element-button {
+ --element-button-color-primary: {{ settings.body-text-color }};
+ --element-icon-stroke-width: 3px;
+ }
+
+ /* Heading */
+ .element-text:is([class*=element-text--heading]) {
+ --_color: var(--element-text-color--heading);
+ }
+
+ /* Element Input */
+ .element-input {
+ --_color-box-shadow: {{ settings['form-select-border-color'] }};
+ }
+
+ /* Variant Labels */
+ label.element-text:is([class*=element-text--body]):where(.element-text--body-sm) {
+ color: {{ settings['heading-color'] }};
+ font-size: 1rem;
+
+ .element-text:first-child {
+ color: {{ settings['heading-color'] }};
+ }
+ }
+
+ /* Element Select */
+ element-select {
+ --color-primary: {{ settings['form-select-border-color'] }};
+ --element-button-color-primary: {{ settings['form-select-color'] }};
+ --element-button-color-secondary: {{ settings['form-select-background'] }};
+ --element-button-box-shadow: inset 0 0 0 1px {{ settings['form-select-border-color'] }};
+ --element-button-font-family: {{ settings.font_body.family }}, {{ settings.font_body.fallback_families }};
+ --element-button-text-transform: none;
+ }
+ element-select.element-select__wrapper--focused .element-button {
+ box-shadow: inset 0 0 0 var(--element-button-border-width--focus) var(--_color-focus);
+ border: none;
+ }
+
+ /* Media Gallery */
+ .media-gallery__thumb {
+ border-radius: 0;
+ }
+
+ /* ATC */
+
+ product-form .element-button[type="submit"] {
+ --element-button-padding-block: var(--size-5);
+ --_color-text: {{ settings['button-color'] }};
+ --_color-background: {{ settings['accent-color'] }};
+ --_box-shadow: none;
+
+ &:disabled {
+ color: #888888 !important;
+ background-color: #cccccc !important;
+ }
+ }
+
+ product-form:has(.element-button--shopify-payment-wrapper) .element-button[type="submit"] {
+ --element-button-color-primary: {{ settings['secondary-button-color'] }};
+ --element-button-color-secondary: {{ settings['secondary-button-background'] }};
+ }
+
+ .shopify-payment-button .shopify-payment-button__button.shopify-payment-button__button--unbranded,
+ .shopify-payment-button .shopify-payment-button__button {
+ --element-text-line-height--body-md: 1;
+ --element-button-color-primary: {{ settings['accent-color'] }};
+ --element-button-color-secondary: {{ settings['button-color'] }};
+ --element-button-padding-block: var(--size-5);
+ --_box-shadow: none;
+
+ text-transform: var(--element-button-text-transform);
+ }
+ </style>
+
+ {% assign x_handle = settings.social-x-link | split: 'x.com/' | last | split: 'twitter.com/' | last %}
+ {%
+ render 'social-meta-tags',
+ twitter_handle: x_handle,
+ default_image: page_image,
+ %}
+
+ <!-- Theme CSS -->
+ <link rel="stylesheet" href="{{ 'theme.css' | asset_url }}">
+ {% render 'dw-product-styles' %}
+ <link rel="stylesheet" href="{{ 'custom.css' | asset_url }}">
+ {% if settings.custom-css != blank %}
+ <style>
+ {{ settings.custom-css }}
+ </style>
+ {% endif %}
+
+ <!-- Theme object -->
+ {% comment %}Inject theme-object begin{% endcomment %}
+ <script>
+ var Theme = {};
+ Theme.version = "7.1.0";
+ Theme.name = 'Grid';
+
+ Theme.currency = {{ shop.currency | json }};
+ Theme.moneyFormat = {{ shop.money_format | strip_html | json }};
+
+ Theme.pleaseSelectText = "{{ 'general.general.please_select' | t | strip_newlines | escape }}";
+
+ Theme.addToCartSuccess = "{{ 'products.product.success_html' | t: product: '**product**', cart_link: '**cart_link**', continue_link: '**continue_link**', checkout_link: '**checkout_link**' | strip_newlines | escape }}";
+
+ {% if shop.customer_accounts_enabled and customer %}
+ Theme.customerLoggedIn = true;
+ {% endif %}
+
+ Theme.shippingCalculator = true;
+ Theme.shippingButton = "{{ 'cart.shipping_calculator.submit' | t | strip_newlines | escape }}";
+ Theme.shippingDisabled = "{{ 'cart.shipping_calculator.disabled' | t | strip_newlines | escape }}";
+
+ {% if shop.customer_accounts_enabled and customer and customer.default_address %}
+ Theme.customerAddress = {{ customer.default_address | json }};
+ {% endif %}
+
+ Theme.shippingCalcErrorMessage = "{{ 'cart.shipping_calculator.error' | t | strip_newlines | replace: '"','\\"' }}";
+ Theme.shippingCalcMultiRates = "{{ 'cart.shipping_calculator.rates_html' | t | strip_newlines | replace: '"','\\"' }}";
+ Theme.shippingCalcOneRate = "{{ 'cart.shipping_calculator.rate' | t | strip_newlines | replace: '"','\\"' }}";
+ Theme.shippingCalcNoRates = "{{ 'cart.shipping_calculator.no_rates' | t | strip_newlines | replace: '"','\\"' }}";
+ Theme.shippingCalcRateValues = "{{ 'cart.shipping_calculator.rate_values_html' | t | strip_newlines | replace: '"','\\"' }}";
+
+ Theme.routes = {
+ "root_url": "{{ routes.root_url }}",
+ "account_url": "{{ routes.account_url }}",
+ "account_login_url": "{{ routes.account_login_url }}",
+ "account_logout_url": "{{ routes.account_logout_url }}",
+ "account_register_url": "{{ routes.account_register_url }}",
+ "account_addresses_url": "{{ routes.account_addresses_url }}",
+ "collections_url": "{{ routes.collections_url }}",
+ "all_products_collection_url": "{{ routes.all_products_collection_url }}",
+ "search_url": "{{ routes.search_url }}",
+ "cart_url": "{{ routes.cart_url }}",
+ "cart_add_url": "{{ routes.cart_add_url }}",
+ "cart_change_url": "{{ routes.cart_change_url }}",
+ "cart_clear_url": "{{ routes.cart_clear_url }}",
+ "product_recommendations_url": "{{ routes.product_recommendations_url }}",
+ "predictive_search_url": "{{ routes.predictive_search_url }}",
+ };
+ </script>
+ {% comment %}Inject theme-object end{% endcomment %}
+
+ {% render 'jquery-snippet' %}
+ <script src="{{ 'custom.js' | asset_url }}" defer></script>
+
+ <script>
+ (function() {
+ document.documentElement.classList.remove('no-js');
+ window.addEventListener('DOMContentLoaded', function() {
+ document.documentElement.classList.remove('loading');
+ });
+ window.setTimeout(function() {
+ document.documentElement.classList.remove('loading');
+ }, 2000);
+
+ if (!window.MutationObserver || !window.MutationObserver.prototype) {
+ return;
+ }
+ var originalObserve = window.MutationObserver.prototype.observe;
+ window.MutationObserver.prototype.observe = function(target, options) {
+ if (!(target instanceof Node)) {
+ return;
+ }
+ return originalObserve.call(this, target, options);
+ };
+ })();
+ </script>
+
+
+
+
+
+
+
+
+
+
+
+
+<!-- DW: Price hiding script REMOVED 2026-03-24 -->
+
+<style>
+/* Belt-and-suspenders: CSS hide prices too */
+.boost-sd__product-price,
+.boost-sd__product-item [class*="price"],
+.boost-sd__product-item span[class*="money"],
+.boost-sd [class*="product-price"] {
+ display: none !important;
+ visibility: hidden !important;
+ opacity: 0 !important;
+ height: 0 !important;
+ font-size: 0 !important;
+ line-height: 0 !important;
+ position: absolute !important;
+ pointer-events: none !important;
+}
+/* Restore on product pages + cart */
+#shopify-section-product [class*="price"],
+#shopify-section-product span.money,
+.product-add-to-cart span.money,
+.shopify-product-form span.money,
+.mini-cart span.money,
+.cart span.money {
+ display: inline !important;
+ visibility: visible !important;
+ opacity: 1 !important;
+ height: auto !important;
+ font-size: inherit !important;
+ line-height: inherit !important;
+ position: static !important;
+ pointer-events: auto !important;
+}
+/* Square images */
+.boost-sd__product-item [class*="product-image"],
+.boost-sd__product-item [class*="image-wrapper"] {
+ aspect-ratio: 1/1 !important;
+ overflow: hidden !important;
+}
+.boost-sd__product-item img {
+ width: 100% !important;
+ height: 100% !important;
+ object-fit: cover !important;
+}
+/* Hide View As toggle */
+[class*="view-as"], [class*="viewAs"], .boost-sd__toolbar [class*="view"], .boost-sd [class*="toolbar-view"] {
+ display: none !important;
+}
+/* Hide View As toggle */
+[class*="view-as"],[class*="viewAs"],.boost-sd__toolbar [class*="view"],.boost-sd [class*="toolbar"] [class*="view"]{display:none!important}
+/* Center text */
+.boost-sd__product-item,
+.boost-sd__product-item [class*="title"],
+.boost-sd__product-item [class*="vendor"],
+.boost-sd__product-item p,
+.dw-vendor-link {
+ text-align: center !important;
+}
+</style>
+<!-- DW: killPrices REMOVED 2026-03-24 -->
+
+<!-- /DW -->
+
+{% if template contains 'collection' %}
+
+{% endif %}
+
+{% comment %} DW: ItemList structured data for the Shop-by-Brand page (script tags are stripped from page body_html, so injected here) {% endcomment %}
+{% if page.handle == 'brands' %}{% render 'brands-jsonld' %}{% endif %}
+
+<!-- cache-bust: 2026-03-25T00:54:55.724677 -->
+<script src="{{ 'dw-grid-control.js' | asset_url }}" defer></script>
+<script src="{{ 'newwall-infinite.js' | asset_url }}" defer></script>
+</head>
+
+<body
+ class="
+ template-{{ template.name }}
+ template-suffix-{{ template.suffix }}
+
+ {% if customer %}
+ customer-logged-in
+ {% endif %}
+ "
+>
+
+ {%- comment -%}
+ ── China Region Block (added 2026-02-27) ──
+ Blocks visitors from CN country code with a full-screen overlay.
+ {%- endcomment -%}
+ {%- if localization.country.iso_code == 'CN' -%}
+ <div id="region-block" style="position:fixed;inset:0;z-index:999999;background:#ffffff;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:40px;font-family:-apple-system,BlinkMacSystemFont,sans-serif;">
+ <h1 style="font-size:24px;color:#333;margin-bottom:16px;">This store is not available in your region</h1>
+ <p style="font-size:16px;color:#666;max-width:500px;">We apologize for the inconvenience, but this store does not currently serve customers in your region.</p>
+ </div>
+ <style>body{overflow:hidden !important;}</style>
+ {%- endif -%}
+
+ {% sections 'header-group' %}
+
+ <div style="--background-color: {{ settings.background-color }}">
+ {%
+ render 'age-gate',
+ id: 'page',
+ sections: content_for_layout,
+ %}
+ </div>
+
+ {% include 'quickshop' %}
+
+ {% comment %}Inject icon-star-symbol begin{% endcomment %}
+ <svg
+ class="icon-star-reference"
+ aria-hidden="true"
+ focusable="false"
+ role="presentation"
+ xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="3 3 17 17" fill="none"
+ >
+ <symbol id="icon-star">
+ <rect class="icon-star-background" width="20" height="20" fill="currentColor"/>
+ <path d="M10 3L12.163 7.60778L17 8.35121L13.5 11.9359L14.326 17L10 14.6078L5.674 17L6.5 11.9359L3 8.35121L7.837 7.60778L10 3Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"/>
+ </symbol>
+ <clipPath id="icon-star-clip">
+ <path d="M10 3L12.163 7.60778L17 8.35121L13.5 11.9359L14.326 17L10 14.6078L5.674 17L6.5 11.9359L3 8.35121L7.837 7.60778L10 3Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+ </clipPath>
+ </svg>
+ {% comment %}Inject icon-star-symbol end{% endcomment %}
+
+ <div class="main-content">
+ {% render "dw-boost-overrides" %}
+{{ content_for_layout }}
+ </div>
+
+ <div class="site-overlay" data-site-overlay></div>
+
+ {% sections 'footer-group' %}
+
+ <!-- Scripts -->
+ <!-- Third Party JS Libraries -->
+ <script src="{{ 'modernizr-2.8.2.min.js' | asset_url }}" defer></script>
+
+ {% if template contains 'cart' %}
+ <script src="{{ '/services/javascripts/countries.js' }}" defer></script>
+ <script src="{{ 'shopify_common.js' | shopify_asset_url }}" defer></script>
+ {% endif %}
+
+ {% if template contains 'customers' %}
+ <script src="{{ 'shopify_common.js' | shopify_asset_url }}" defer></script>
+ <script src="{{ 'customer_area.js' | shopify_asset_url }}" defer></script>
+ {% endif %}
+
+ <script src="{{ 'grid.js' | asset_url }}" defer></script>
+
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-article begin{% endcomment %}
+ {% comment %}
+ Article structured data
+ https://developers.google.com/search/docs/data-types/articles
+ {% endcomment %}
+
+ {% if template contains 'article' %}
+ {%- capture article_description -%}
+ {%- if article.excerpt != blank -%}
+ {{ article.excerpt | strip_html }}
+ {%- else -%}
+ {{ article.content | truncatewords: 100 | strip_html }}
+ {%- endif -%}
+ {%- endcapture -%}
+
+ <script type="application/ld+json">
+ {
+ "@context": "http://schema.org",
+ "@type": "BlogPosting",
+ "mainEntityOfPage": {
+ "@type": "WebPage",
+ "@id": "{{ shop.url }}{{ article.url }}"
+ },
+ "headline": {{ article.title | json }},
+ {% if article.image %}
+ "image": {
+ "@type": "ImageObject",
+ "url": {{ article.image | img_url: '800x800' | prepend: 'https:' | json }},
+ "height": 800,
+ "width": 800
+ },
+ {% endif %}
+ "datePublished": {{ article.published_at | date: '%Y-%m-%dT%H:%M:%S%z' | json}},
+ "dateModified": {{ article.published_at | date: '%Y-%m-%dT%H:%M:%S%z' | json}},
+ "author": {
+ "@type": "Person",
+ "name": {{ article.author | json }}
+ },
+ "publisher": {
+ "@type": "Organization",
+ "name": {{ shop.name | json }},
+ "logo": {
+ "@type": "ImageObject",
+ "url": {{ article.user.image | img_url: '200x200' | prepend: 'https:' | json }}
+ }
+ },
+ "description": {{ article_description | json }}
+ }
+ </script>
+ {% endif %}
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-article end{% endcomment %}
+
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-breadcrumbs begin{% endcomment %}
+ {% comment %}
+ Breadcrumbs
+ https://developers.google.com/search/docs/data-types/breadcrumbs
+ {% endcomment %}
+
+ {%- if current_tags -%}
+ {%- assign tag_names = current_tags | join: ', ' %}
+ {% comment %}Converting an array to a handle converts it to a string{% endcomment %}
+ {%- capture tag_handles -%}
+ {%- for tag in current_tags -%}
+ {{- tag | handle | append: '|' -}}
+ {%- endfor -%}
+ {%- endcapture -%}
+ {%- endif -%}
+
+ {% if collection.url == blank %}
+ {% assign collection_url = '/collections/all' %}
+ {% else %}
+ {% assign collection_url = collection.url %}
+ {% endif %}
+
+ {% if template.name == 'product'
+ or template.name == 'list-collections'
+ or template.name == 'collection'
+ or template.name == 'blog'
+ or template.name == 'article'
+ or template.name == 'search'
+ or template.name == 'cart'
+ or template.name == 'page'
+ %}
+
+ <script type="application/ld+json">
+ {
+ "@context": "http://schema.org",
+ "@type": "BreadcrumbList",
+ "itemListElement": [
+ {% case template.name %}
+ {% when 'product' %}
+ {% if product.collections.size >= 1 %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ shop.url }}/collections",
+ "name": {{ 'structured_data.breadcrumbs.collections' | t | json }}
+ }
+ },
+ {
+ "@type": "ListItem",
+ "position": 2,
+ "item": {
+ "@id": "{{ shop.url }}/collections/{{ product.collections.first.handle }}",
+ "name": {{ product.collections.first.title | json }}
+ }
+ },
+ {% else %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ shop.url }}/products",
+ "name": {{ 'structured_data.breadcrumbs.products' | t | json }}
+ }
+ },
+ {% endif %}
+ {
+ "@type": "ListItem",
+ "position": {% if product.collections.size >= 1 %}3{% else %}2{% endif %},
+ "item": {
+ "@id": "{{ shop.url }}{{ product.url | within: collection }}",
+ "name": {{ product.title | json }}
+ }
+ }
+ {% when 'list-collections' %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ shop.url }}/collections",
+ "name": {{ 'structured_data.breadcrumbs.collections' | t | json }}
+ }
+ }
+ {% if current_page != 1 %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": 2,
+ "item": {
+ "@id": "{{ shop.url }}/collections",
+ "name": {{ 'structured_data.breadcrumbs.page' | t: page: current_page | json }}
+ }
+ }
+ {% endif %}
+ {% when 'collection' %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ shop.url }}/collections",
+ "name": {{ 'structured_data.breadcrumbs.collections' | t | json }}
+ }
+ },
+ {
+ "@type": "ListItem",
+ "position": 2,
+ "item": {
+ "@id": "{{ shop.url }}{{ collection_url }}",
+ "name": {{ collection.title | json }}
+ }
+ }
+ {% if current_tags %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": 3,
+ "item": {
+ "@id": "{{ shop.url }}{{ collection_url }}/{{- tag_handles | split: '|' | join: '+' -}}",
+ "name": {{ 'structured_data.breadcrumbs.tags_html' | t: tags: tag_names | json }}
+ }
+ }
+ {% endif %}
+ {% if current_page != 1 %}
+ {% if current_tags %}
+ {% assign position = 4 %}
+ {% else %}
+ {% assign position = 3 %}
+ {% endif %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": {{ position }},
+ "item": {
+ "@id": "{{ shop.url }}/collections?page={{ current_page }}",
+ "name": {{ 'structured_data.breadcrumbs.page' | t: page: current_page | json }}
+ }
+ }
+ {% endif %}
+ {% when 'blog' or 'article' %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ shop.url }}{{ blog.url }}",
+ "name": {{ blog.title | json }}
+ }
+ }
+ {% if template.name == 'article' %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": 2,
+ "item": {
+ "@id": "{{ shop.url }}{{ article.url }}",
+ "name": {{ article.title | json }}
+ }
+ }
+ {% elsif current_tags %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": 2,
+ "item": {
+ "@id": "{{ shop.url }}{{ blog.url }}/tagged/{{- tag_handles | split: '|' | join: '+' -}}",
+ "name": {{ 'structured_data.breadcrumbs.tags_html' | t: tags: tag_names | json }}
+ }
+ }
+ {% endif %}
+ {% if current_page != 1 %}
+ {% if current_tags %}
+ {% assign position = 3 %}
+ {%- capture url -%}
+ {{ shop.url }}{{ blog.url }}/tagged/{{ tag_handles | split: '|' | join: '+' }}?page={{ current_page }}
+ {%- endcapture -%}
+ {% else %}
+ {% assign position = 2 %}
+ {%- capture url -%}
+ {{ shop.url }}{{ blog.url }}?page={{ current_page }}
+ {%- endcapture -%}
+ {% endif %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": {{ position }},
+ "item": {
+ "@id": "{{ url }}",
+ "name": {{ 'structured_data.breadcrumbs.page' | t: page: current_page | json }}
+ }
+ }
+ {% endif %}
+ {% when 'search' %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ shop.url }}/search",
+ "name": {{ 'structured_data.breadcrumbs.search' | t | json }}
+ }
+ }
+ {% if search.performed %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": 2,
+ "item": {
+ "@id": "{{ shop.url }}/search?q={{ search.terms }}",
+ "name": {{ search.terms | json }}
+ }
+ }
+ {% if current_page != 1 %}
+ ,
+ {
+ "@type": "ListItem",
+ "position": 3,
+ "item": {
+ "@id": "{{ shop.url }}/search?page={{ current_page }}&q={{ search.terms }}",
+ "name": {{ 'structured_data.breadcrumbs.page' | t: page: current_page | json }}
+ }
+ }
+ {% endif %}
+ {% endif %}
+ {% when 'cart' %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ shop.url }}/cart",
+ "name": {{ 'structured_data.breadcrumbs.cart' | t | json }}
+ }
+ }
+ {% when 'page' %}
+ {
+ "@type": "ListItem",
+ "position": 1,
+ "item": {
+ "@id": "{{ page.url }}",
+ "name": {{ page.title | json }}
+ }
+ }
+ {% else %}
+ {% endcase %}
+ ]
+ }
+ </script>
+ {% endif %}
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-breadcrumbs end{% endcomment %}
+
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-product begin{% endcomment %}
+ {% comment %}
+ Product structured data
+ https://developers.google.com/search/docs/data-types/products
+ {% endcomment %}
+
+ {% if template contains 'product' %}
+ {% assign selected_variant = product.selected_or_first_available_variant | default: product.variants.first %}
+ {% assign product_image = selected_variant.featured_image | default: product.featured_image %}
+ {%- capture product_name -%}
+ {{ product.title }}
+ {%- if selected_variant.title != 'Default Title' and selected_variant.option1 == 'Default Title' -%}
+ - {{ selected_variant.title }}
+ {%- endif -%}
+ {%- endcapture -%}
+
+ {%- assign now = 'now' | date: '%Y-%m-%d' | split: '-' -%}
+ {% capture year_from_now %}{{ now[0] | plus: 1 }}-{{ now[1] }}-{{ now[2] | at_most: 28 }}{% endcapture %}
+
+ <script type="application/ld+json">
+ {
+ "@context": "http://schema.org/",
+ "@type": "Product",
+ "name": {{ product_name | strip_newlines | json }},
+ "image": {{ product_image | img_url: '1024x1024' | prepend: 'https:' | json }},
+ {% if product.description != blank %}
+ "description": {{ product.description | json }},
+ {% endif %}
+ {% if product.vendor %}
+ "brand": {
+ "@type": "Thing",
+ "name": {{ product.vendor | json }}
+ },
+ {% endif %}
+ {% if selected_variant.sku != blank %}
+ "sku": {{ selected_variant.sku | json }},
+ {% endif %}
+ {% if selected_variant.barcode != blank %}
+ "mpn": {{ selected_variant.barcode | json }},
+ {% endif %}
+ "offers": {
+ "@type": "Offer",
+ "priceCurrency": {{ cart.currency.iso_code | json }},
+ "price": {{ selected_variant.price | divided_by: 100.0 | json }},
+ "availability": "http://schema.org/{% if selected_variant.available %}InStock{% else %}OutOfStock{% endif %}",
+ "url": "{{ shop.url }}{{ selected_variant.url }}",
+ "seller": {
+ "@type": "Organization",
+ "name": {{ shop.name | json }}
+ },
+ "priceValidUntil": {{ year_from_now | json }}
+ }
+ }
+ </script>
+ {% endif %}
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-product end{% endcomment %}
+
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-website begin{% endcomment %}
+ {% comment %}
+ Store information
+ https://developers.google.com/search/docs/data-types/sitename
+ {% endcomment %}
+
+ <script type="application/ld+json">
+ {
+ "@context": "http://schema.org",
+ "@type": "WebSite",
+ "name": "{{ shop.name }}",
+ "url": "{{ shop.url }}"
+ }
+ </script>
+ {% comment %}Inject @pixelunion/shopify-structured-data/structured-data-website end{% endcomment %}
+
+ <form id="checkout_form" action="{{ routes.cart_url }}" method="POST" style="display: none;"></form>
+
+ <script>
+ (function () {
+ function handleFirstTab(e) {
+ if (e.keyCode === 9) { // the "I am a keyboard user" key
+ document.body.classList.add('user-is-tabbing');
+ window.removeEventListener('keydown', handleFirstTab);
+ }
+ }
+ window.addEventListener('keydown', handleFirstTab);
+ })();
+ </script>
+ <script>(function(n, v) {/* eslint-disable-next-line max-len */if (window.Shopify && window.Shopify.theme && navigator && navigator.sendBeacon && window.Shopify.designMode) {if (sessionStorage.getItem('oots_beacon')) return;navigator.sendBeacon('https://app.outofthesandbox.com/beacon', new URLSearchParams({shop_domain: window.Shopify.shop.toLowerCase(),shop_id: '{{ shop.id }}',shop_email: '{{ shop.email }}',theme_name: n.toLowerCase(),theme_version: v.toLowerCase(),theme_store_id: window.Shopify.theme.theme_store_id,theme_id: window.Shopify.theme.id,theme_role: window.Shopify.theme.role,}));sessionStorage.setItem('oots_beacon', '');}}('grid','7.1.0'))</script>
+
+<!--Start of Zendesk Chat Script-->
+<script async>
+window.$zopim||(function(d,s){var z=$zopim=function(c){z._.push(c)},$=z.s=
+d.createElement(s),e=d.getElementsByTagName(s)[0];z.set=function(o){z.set.
+_.push(o)};z._=[];z.set._=[];$.async=!0;$.setAttribute("charset","utf-8");
+$.src="https://v2.zopim.com/?RH5Yjru86SIJRwOxfiMAf2DTCgdROhhf";z.t=+new Date;$.
+type="text/javascript";e.parentNode.insertBefore($,e)})(document,"script");
+</script>
+<!--End of Zendesk Chat Script-->
+<!-- Statcounter code for DW - Started 3/5/19
+http://DesignerWallcoverings.com on Shopify -->
+<script type="text/javascript">
+var sc_project=11961678;
+var sc_invisible=1;
+var sc_security="9d9a53bd";
+var sc_https=1;
+</script>
+<script type="text/javascript"
+src="https://www.statcounter.com/counter/counter.js"
+async></script>
+<noscript><div class="statcounter"><a title="web statistics"
+href="https://statcounter.com/" target="_blank"><img
+class="statcounter"
+src="https://c.statcounter.com/11961678/0/9d9a53bd/1/"
+alt="web statistics"></a></div></noscript>
+<!-- End of Statcounter Code -->
+
+{% render 'hide-browse-hidden' %}
+
+<!-- DW: price restore band-aid removed 2026-06-11 — root cause (blank saw_variant_price) fixed in product-form-content.liquid; no price-hiding CSS exists. -->
+{%- comment -%} DW Shop-by-Color wheel {%- endcomment -%}
+<script>window.DW_CW_DATA="{{ 'dw-color-wheel-data.json' | asset_url }}";</script>
+<script src="{{ 'dw-color-wheel.js' | asset_url }}" defer></script>
+{%- comment -%} DW Phillip-Jeffries browse hide (stopgap) {%- endcomment -%}
+<script src="{{ 'dw-pj-hide.js' | asset_url }}" defer></script>
+{%- comment -%} DW card hover label: Pattern, Color + Vendor on hover (2026-06-22) {%- endcomment -%}
+<script src="{{ 'dw-card-hover.js' | asset_url }}" defer></script>
+{%- comment -%} DW horizontal collapsible Boost filter bar (2026-06-22) {%- endcomment -%}
+{%- if template contains 'collection' or template contains 'search' -%}
+ {{ 'dw-hfilter.css' | asset_url | stylesheet_tag }}
+ <script src="{{ 'dw-hfilter.js' | asset_url }}" defer></script>
+{%- endif -%}
+{%- comment -%} DW PDP restyle: size <select> -> pills + uniform CTA pill layout (2026-06-22) {%- endcomment -%}
+{{ 'dw-pdp-restyle.css' | asset_url | stylesheet_tag }}
+<script src="{{ 'dw-pdp-size-pills.js' | asset_url }}" defer></script>
+</body>
+</html>
diff --git a/shopify/collection-hero-fix/backups/consolidation-2026-06-23/sections_collection.liquid.dev-143947038771.before b/shopify/collection-hero-fix/backups/consolidation-2026-06-23/sections_collection.liquid.dev-143947038771.before
new file mode 100644
index 00000000..609a8785
--- /dev/null
+++ b/shopify/collection-hero-fix/backups/consolidation-2026-06-23/sections_collection.liquid.dev-143947038771.before
@@ -0,0 +1,262 @@
+<script
+ type="application/json"
+ data-section-id="{{ section.id }}"
+ data-section-type="static-collection"
+>
+</script>
+
+{% liquid
+ assign products_per_page = section.settings.products_per_row | times: section.settings.number_of_rows
+ assign use_masonry = false
+
+ if section.settings.layout == 'masonry'
+ assign use_masonry = true
+ endif
+
+ assign show_filters = false
+ if section.settings.show_filters
+ assign show_filters = true
+ endif
+
+ assign show_sorting = false
+ if section.settings.sorting
+ assign show_sorting = true
+ endif
+
+ assign show_collection_image = false
+ if collection.image and section.settings.show_collection_image
+ assign show_collection_image = true
+ endif
+%}
+
+{%- comment -%} DW collection hero (F1=B) {%- endcomment -%}
+{% render 'dw-collection-hero-bg' %}
+
+<div>
+ {% unless use_masonry %}
+ <h1 class="page-title">{{ collection.title }}</h1>
+ {% render 'breadcrumbs' %}
+ {% endunless %}
+
+ {% paginate collection.products by products_per_page %}
+ <section
+ class="collection collection-image--{{ show_collection_image }}"
+ data-product-hover="{{ settings.product_hover }}"
+ {% if use_masonry %}data-collection-masonry{% endif %}
+ data-section-id="{{ section.id }}"
+ data-section-type="collection">
+
+ {% if use_masonry or show_collection_image or collection.description != blank or show_sorting or show_filters %}
+ <div
+ class="
+ collection-header
+ {% if use_masonry %}
+ collection-header-alternate
+ {% endif %}
+ {% if show_filters and show_sorting %}
+ collection-header--filters-sort-enabled
+ {% endif %}
+ "
+ >
+ {% if show_collection_image %}
+ <div class="collection-featured-image">
+ {%
+ render 'rimg',
+ img: collection.image,
+ size: '1024x1024',
+ lazy: true,
+ %}
+ </div>
+ {% endif %}
+
+ <div class="collection-header-content">
+ {% if use_masonry %}
+ {% render 'breadcrumbs' %}
+ <h1 class="page-title">{{ collection.title }}</h1>
+ {% endif %}
+
+ {% if collection.description != blank and section.settings.show_description %}
+ <div class="collection-description rte">
+ {{ collection.description }}
+ </div>
+ {% endif %}
+
+ {% if show_filters or show_sorting %}
+ <div class="collection-filters">
+ {% if show_filters and collection.filters.size > 0 %}
+ <!-- Approach B: Horizontal filter bar (proxies to Boost's hidden controls) -->
+ {% render 'collection-filters-horizontal' %}
+
+ <!-- Boost native filters (hidden by Approach B CSS, powers the filtering) -->
+ <div class="faceted-filters" data-faceted-filter>
+ {%
+ render "faceted-filters",
+ filters: collection.filters,
+ class_prefix: 'collection',
+ %}
+ </div>
+ {% endif %}
+ {% if show_sorting %}
+ <div class="collection-sorting__wrapper">
+ <label class="collection-filters__title label" for="sort-by">
+ {{- 'collections.collection.sort_title' | t -}}:
+ </label>
+
+ <div
+ class="
+ collection-dropdown
+ collection-dropdown--sort
+ select-wrapper
+ {% if collection.current_vendor %}
+ vendor-collection
+ {% endif %}
+ "
+ >
+ {% assign current_sort = collection.sort_by | default: collection.default_sort_by %}
+
+ <span class="selected-text"></span>
+
+ <select id="sort-by" class="select" data-collection-sorting>
+ {%- for option in collection.sort_options -%}
+ {% if current_sort == option.value %}
+ <option value="{{ option.value }}" selected="selected">{{ option.name }}</option>
+ {% else %}
+ <option value="{{ option.value }}">{{ option.name }}</option>
+ {% endif %}
+ {% endfor %}
+ </select>
+ </div>
+ </div>
+ {% endif %}
+ </div>
+ {% endif %}
+ </div>
+
+ {% if show_filters and collection.filters.size > 0 %}
+ {% for filter in collection.filters %}
+ {% if filter.active_values.size > 0 or filter.min_value.value or filter.max_value.value %}
+ {%-
+ render 'faceted-filters-active',
+ show_sorting: show_sorting,
+ filter: filter,
+ filters: collection.filters,
+ class_prefix: 'collection',
+ clear_url: collection.url,
+ %}
+ {% break %}
+ {% endif %}
+ {% endfor %}
+ {% endif %}
+ </div>
+ {% endif %}
+
+ <!-- Full Collection Toolbar: Sort + Grid Density Slider -->
+ {% include 'collection-toolbar' %}
+
+ <div
+ class="collection-products rows-of-{{ section.settings.products_per_row }} grid-cols-3"
+ data-collection-grid
+ {% if use_masonry %}data-masonry-grid{% endif %}
+ >
+ {%- if use_masonry -%}
+ <div class="product-grid-masonry-sizer" data-masonry-sizer></div>
+ {%- endif -%}
+
+ {%- if collection.handle == 'all' and collection.all_vendors.size == 0 and collection.all_types.size == 0 -%}
+ {%- for i in (1..section.settings.products_per_row) -%}
+ {%- capture productImage -%}
+ {%- cycle 'product-1', 'product-2', 'product-3' -%}
+ {%- endcapture -%}
+ {%- assign image = productImage | placeholder_svg_tag: 'placeholder-svg' -%}
+
+ {%- render 'home-onboard-product', image: image -%}
+ {%- endfor -%}
+ {%- else -%}
+ {% for product in collection.products %}
+ {%
+ render 'product-list-item',
+ product: product,
+ %}
+ {% else %}
+ {% capture continueLink %}
+ <a href="{{ routes.all_products_collection_url }}">{{ 'collections.collection.continue_link' | t }}</a>
+ {% endcapture %}
+ <p class="empty">{{ 'collections.collection.empty_html' | t: continue_link: continueLink }}</p>
+ {% endfor %}
+ {%- endif -%}
+ </div>
+ </section>
+
+ {%
+ render 'pagination',
+ paginate: paginate,
+ %}
+ {% endpaginate %}
+</div>
+
+<script src="{{ 'collection-grid-density.js' | asset_url }}" defer></script>
+
+{% schema %}
+{
+ "name": "Collection pages",
+ "settings": [
+ {
+ "type": "checkbox",
+ "id": "show_collection_image",
+ "label": "Show collection image"
+ },
+ {
+ "type": "checkbox",
+ "id": "show_description",
+ "label": "Show description"
+ },
+ {
+ "type": "checkbox",
+ "id": "sorting",
+ "label": "Enable sorting",
+ "info": "Parameters include: best selling, A-Z, newest to oldest, etc."
+ },
+ {
+ "type": "checkbox",
+ "id": "show_filters",
+ "label": "Enable filtering",
+ "default": true
+ },
+ {
+ "type": "select",
+ "id": "layout",
+ "label": "Layout",
+ "options": [
+ {
+ "value": "default",
+ "label": "Default"
+ },
+ {
+ "value": "masonry",
+ "label": "Masonry"
+ }
+ ],
+ "default": "default"
+ },
+ {
+ "type": "range",
+ "id": "products_per_row",
+ "label": "Products per row",
+ "min": 2,
+ "max": 4,
+ "step": 1,
+ "default": 3
+ },
+ {
+ "type": "range",
+ "id": "number_of_rows",
+ "label": "Rows",
+ "min": 1,
+ "max": 12,
+ "step": 1,
+ "default": 3
+ }
+ ]
+}
+
+{% endschema %}
diff --git a/shopify/collection-hero-fix/backups/consolidation-2026-06-23/snippets_collection-toolbar.liquid.dev-143947038771.before b/shopify/collection-hero-fix/backups/consolidation-2026-06-23/snippets_collection-toolbar.liquid.dev-143947038771.before
new file mode 100644
index 00000000..38d004fd
--- /dev/null
+++ b/shopify/collection-hero-fix/backups/consolidation-2026-06-23/snippets_collection-toolbar.liquid.dev-143947038771.before
@@ -0,0 +1,307 @@
+{%- comment -%}
+ Collection Toolbar — Horizontal sort + grid density slider + search
+ Replaces Shopify's native sorting/filtering UI with a unified toolbar.
+
+ Features:
+ - Sort dropdown (Newest, Color, Style, SKU, Title, Price)
+ - Grid density slider (3–12 columns)
+ - localStorage persistence
+ - Responsive mobile stacking
+
+ Revision: 2026-06-22
+{%- endcomment -%}
+
+<div class="collection-toolbar">
+ <style>
+ .collection-toolbar {
+ display: flex;
+ gap: 16px;
+ align-items: center;
+ justify-content: space-between;
+ flex-wrap: wrap;
+ padding: 20px 0;
+ border-bottom: 1px solid var(--border-color, rgba(0,0,0,0.1));
+ margin-bottom: 24px;
+ }
+
+ .toolbar-left {
+ display: flex;
+ gap: 14px;
+ align-items: center;
+ flex-wrap: nowrap;
+ min-width: 0;
+ }
+
+ .toolbar-label {
+ font-size: 11px;
+ letter-spacing: 0.22em;
+ text-transform: uppercase;
+ font-weight: 600;
+ color: var(--text-muted, rgba(0,0,0,0.6));
+ }
+
+ #collectionSort {
+ background: transparent;
+ border: 1px solid var(--border-color, rgba(0,0,0,0.12));
+ padding: 6px 10px;
+ font-family: inherit;
+ font-size: 12px;
+ letter-spacing: 0.08em;
+ text-transform: uppercase;
+ font-weight: 500;
+ color: var(--text-color, inherit);
+ cursor: pointer;
+ transition: all 0.2s ease;
+ min-width: 140px;
+ max-width: 100%;
+ overflow: visible;
+ }
+
+ #collectionSort:hover {
+ border-color: var(--accent-color, rgba(0,0,0,0.3));
+ }
+
+ #collectionSort:focus {
+ outline: 2px solid var(--accent-color, #000);
+ outline-offset: 2px;
+ }
+
+ .density-control {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ padding: 6px 0;
+ }
+
+ .density-control input[type="range"] {
+ flex: 0 0 120px;
+ -webkit-appearance: none;
+ appearance: none;
+ width: 120px;
+ height: 4px;
+ background: var(--border-color, rgba(0,0,0,0.15));
+ outline: none;
+ cursor: pointer;
+ border-radius: 2px;
+ }
+
+ .density-control input[type="range"]::-webkit-slider-thumb {
+ -webkit-appearance: none;
+ appearance: none;
+ width: 13px;
+ height: 13px;
+ background: var(--accent-color, #000);
+ border-radius: 50%;
+ cursor: pointer;
+ transition: transform 0.2s ease;
+ }
+
+ .density-control input[type="range"]::-webkit-slider-thumb:hover {
+ transform: scale(1.2);
+ }
+
+ .density-control input[type="range"]::-moz-range-thumb {
+ width: 13px;
+ height: 13px;
+ background: var(--accent-color, #000);
+ border-radius: 50%;
+ border: 0;
+ cursor: pointer;
+ transition: transform 0.2s ease;
+ }
+
+ .density-control input[type="range"]::-moz-range-thumb:hover {
+ transform: scale(1.2);
+ }
+
+ .density-display {
+ font-size: 11px;
+ letter-spacing: 0.18em;
+ text-transform: uppercase;
+ font-weight: 600;
+ color: var(--text-muted, rgba(0,0,0,0.6));
+ min-width: 60px;
+ text-align: right;
+ }
+
+ .toolbar-search {
+ flex: 0 1 200px;
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ border-bottom: 1px solid var(--border-color, rgba(0,0,0,0.1));
+ padding: 4px 0;
+ }
+
+ .toolbar-search input {
+ flex: 1;
+ background: transparent;
+ border: 0;
+ padding: 4px 0;
+ font-family: inherit;
+ font-size: 12px;
+ letter-spacing: 0.04em;
+ color: var(--text-color, inherit);
+ outline: none;
+ }
+
+ .toolbar-search input::placeholder {
+ color: var(--text-muted, rgba(0,0,0,0.4));
+ }
+
+ .toolbar-search svg {
+ width: 14px;
+ height: 14px;
+ stroke: var(--text-muted, rgba(0,0,0,0.4));
+ fill: none;
+ stroke-width: 1.5;
+ flex-shrink: 0;
+ }
+
+ /* Mobile responsive */
+ @media (max-width: 720px) {
+ .collection-toolbar {
+ gap: 12px;
+ }
+
+ .toolbar-left {
+ flex: 1 1 100%;
+ order: 1;
+ }
+
+ .toolbar-search {
+ flex: 1 1 100%;
+ order: 2;
+ margin-top: 8px;
+ }
+
+ .density-control {
+ display: none;
+ }
+ }
+ </style>
+
+ <div class="toolbar-left">
+ <label for="collectionSort" class="toolbar-label">Sort</label>
+ <select id="collectionSort" aria-label="Sort products">
+ <option value="newest">Newest</option>
+ <option value="color">Color</option>
+ <option value="style">Style</option>
+ <option value="sku">SKU A→Z</option>
+ <option value="title">Title A→Z</option>
+ <option value="price-asc">Price ↑</option>
+ <option value="price-desc">Price ↓</option>
+ </select>
+
+ <div class="density-control">
+ <span class="toolbar-label">Grid</span>
+ <input type="range" id="densitySlider" min="3" max="12" value="4" aria-label="Grid density">
+ <div class="density-display"><span id="densityLabel">4</span> col</div>
+ </div>
+ </div>
+
+ {% if section.settings.show_search %}
+ <div class="toolbar-search">
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor">
+ <circle cx="11" cy="11" r="8"></circle>
+ <path d="m21 21-4.35-4.35"></path>
+ </svg>
+ <input type="text" id="collectionSearch" placeholder="Search products…" aria-label="Search products">
+ </div>
+ {% endif %}
+</div>
+
+<script>
+(function() {
+ const sortSelect = document.getElementById('collectionSort');
+ const densitySlider = document.getElementById('densitySlider');
+ const densityLabel = document.getElementById('densityLabel');
+ const searchInput = document.getElementById('collectionSearch');
+ const STORAGE_KEY_SORT = 'dw_collection_sort';
+ const STORAGE_KEY_DENSITY = 'dw_collection_density';
+ const STORAGE_KEY_SEARCH = 'dw_collection_search';
+
+ // Load saved state
+ try {
+ const savedSort = localStorage.getItem(STORAGE_KEY_SORT);
+ if (savedSort) sortSelect.value = savedSort;
+
+ const savedDensity = localStorage.getItem(STORAGE_KEY_DENSITY);
+ if (savedDensity) {
+ densitySlider.value = savedDensity;
+ densityLabel.textContent = savedDensity;
+ updateGridDensity(parseInt(savedDensity));
+ }
+
+ const savedSearch = localStorage.getItem(STORAGE_KEY_SEARCH);
+ if (savedSearch) searchInput.value = savedSearch;
+ } catch (e) {}
+
+ // Sort change
+ sortSelect.addEventListener('change', function() {
+ try { localStorage.setItem(STORAGE_KEY_SORT, this.value); } catch (e) {}
+ applySort(this.value);
+ });
+
+ // Density slider
+ densitySlider.addEventListener('input', function() {
+ const cols = parseInt(this.value);
+ densityLabel.textContent = cols;
+ try { localStorage.setItem(STORAGE_KEY_DENSITY, cols); } catch (e) {}
+ updateGridDensity(cols);
+ });
+
+ // Search
+ searchInput.addEventListener('input', debounce(function() {
+ try { localStorage.setItem(STORAGE_KEY_SEARCH, this.value); } catch (e) {}
+ applySearch(this.value);
+ }, 300));
+
+ function updateGridDensity(cols) {
+ const productGrid = document.querySelector('.collection-products') || document.querySelector('[data-collection-grid]') || document.querySelector('[role="list"]') || document.querySelector('[data-product-grid]');
+ if (productGrid) {
+ productGrid.style.gridTemplateColumns = `repeat(${cols}, 1fr)`;
+ productGrid.setAttribute('data-cols', cols);
+ }
+ }
+
+ function applySort(mode) {
+ const url = new URL(window.location);
+ if (mode === 'newest') {
+ url.searchParams.delete('sort_by');
+ } else {
+ // Map DW sort modes to Shopify's sort_by values
+ const sortMap = {
+ 'title': 'title-ascending',
+ 'price-asc': 'price-ascending',
+ 'price-desc': 'price-descending'
+ };
+ url.searchParams.set('sort_by', sortMap[mode] || mode);
+ }
+ window.location.href = url.toString();
+ }
+
+ function applySearch(query) {
+ if (query.trim() === '') {
+ window.location.href = window.location.pathname;
+ } else {
+ const url = new URL(window.location);
+ url.searchParams.set('q', query);
+ window.location.href = url.toString();
+ }
+ }
+
+ function debounce(fn, delay) {
+ let timer;
+ return function(...args) {
+ clearTimeout(timer);
+ timer = setTimeout(() => fn.apply(this, args), delay);
+ };
+ }
+
+ // Initialize grid on page load
+ window.addEventListener('load', function() {
+ updateGridDensity(parseInt(densitySlider.value));
+ });
+})();
+</script>
diff --git a/shopify/collection-hero-fix/patched/sections_collection.MERGED.liquid b/shopify/collection-hero-fix/patched/sections_collection.MERGED.liquid
new file mode 100644
index 00000000..466cc1b1
--- /dev/null
+++ b/shopify/collection-hero-fix/patched/sections_collection.MERGED.liquid
@@ -0,0 +1,242 @@
+<script
+ type="application/json"
+ data-section-id="{{ section.id }}"
+ data-section-type="static-collection"
+>
+</script>
+
+{% liquid
+ assign products_per_page = section.settings.products_per_row | times: section.settings.number_of_rows
+ assign use_masonry = false
+
+ if section.settings.layout == 'masonry'
+ assign use_masonry = true
+ endif
+
+ assign show_filters = false
+ if section.settings.show_filters
+ assign show_filters = true
+ endif
+
+ assign show_sorting = false
+ if section.settings.sorting
+ assign show_sorting = true
+ endif
+
+ assign show_collection_image = false
+ if collection.image and section.settings.show_collection_image
+ assign show_collection_image = true
+ endif
+%}
+{%- comment -%} DW collection hero (F1=B) {%- endcomment -%}
+{% render 'dw-collection-hero-bg' %}
+
+
+<div>
+ {% unless use_masonry %}
+ <h1 class="page-title">{{ collection.title }}</h1>
+ {% render 'breadcrumbs' %}
+ {% endunless %}
+
+ {% paginate collection.products by products_per_page %}
+ <section
+ class="collection collection-image--{{ show_collection_image }}"
+ data-product-hover="{{ settings.product_hover }}"
+ {% if use_masonry %}data-collection-masonry{% endif %}
+ data-section-id="{{ section.id }}"
+ data-section-type="collection">
+
+ {% if use_masonry or show_collection_image or collection.description != blank or show_sorting or show_filters %}
+ <div
+ class="
+ collection-header
+ {% if use_masonry %}
+ collection-header-alternate
+ {% endif %}
+ {% if show_filters and show_sorting %}
+ collection-header--filters-sort-enabled
+ {% endif %}
+ "
+ >
+ {% if show_collection_image %}
+ <div class="collection-featured-image">
+ {%
+ render 'rimg',
+ img: collection.image,
+ size: '1024x1024',
+ lazy: true,
+ %}
+ </div>
+ {% endif %}
+
+ <div class="collection-header-content">
+ {% if use_masonry %}
+ {% render 'breadcrumbs' %}
+ <h1 class="page-title">{{ collection.title }}</h1>
+ {% endif %}
+
+ {% if collection.description != blank and section.settings.show_description %}
+ <div class="collection-description rte">
+ {{ collection.description }}
+ </div>
+ {% endif %}
+
+ {% if show_filters or show_sorting %}
+ <div class="collection-filters">
+ {% if show_filters and collection.filters.size > 0 %}
+ <!-- Approach B: Horizontal filter bar (proxies to Boost's hidden controls) -->
+ {% render 'collection-filters-horizontal' %}
+
+ <!-- Boost native filters (hidden by Approach B CSS, powers the filtering) -->
+ <div class="faceted-filters" data-faceted-filter>
+ {%
+ render "faceted-filters",
+ filters: collection.filters,
+ class_prefix: 'collection',
+ %}
+ </div>
+ {% endif %}
+ {%- comment -%}
+ Native #sort-by dropdown removed 2026-06-23: sorting is now owned
+ exclusively by the canonical collection-toolbar snippet (#collectionSort)
+ rendered below, which carries the full DW sort set
+ (Newest/Color/Style/SKU/Title/Price). Keeping two sort controls
+ duplicated the UI.
+ {%- endcomment -%}
+ </div>
+ {% endif %}
+ </div>
+
+ {% if show_filters and collection.filters.size > 0 %}
+ {% for filter in collection.filters %}
+ {% if filter.active_values.size > 0 or filter.min_value.value or filter.max_value.value %}
+ {%-
+ render 'faceted-filters-active',
+ show_sorting: show_sorting,
+ filter: filter,
+ filters: collection.filters,
+ class_prefix: 'collection',
+ clear_url: collection.url,
+ %}
+ {% break %}
+ {% endif %}
+ {% endfor %}
+ {% endif %}
+ </div>
+ {% endif %}
+
+ <!-- Full Collection Toolbar: Sort + Grid Density Slider -->
+ {% include 'collection-toolbar' %}
+
+ <div
+ class="collection-products rows-of-{{ section.settings.products_per_row }} grid-cols-3"
+ data-collection-grid
+ {% if use_masonry %}data-masonry-grid{% endif %}
+ >
+ {%- if use_masonry -%}
+ <div class="product-grid-masonry-sizer" data-masonry-sizer></div>
+ {%- endif -%}
+
+ {%- if collection.handle == 'all' and collection.all_vendors.size == 0 and collection.all_types.size == 0 -%}
+ {%- for i in (1..section.settings.products_per_row) -%}
+ {%- capture productImage -%}
+ {%- cycle 'product-1', 'product-2', 'product-3' -%}
+ {%- endcapture -%}
+ {%- assign image = productImage | placeholder_svg_tag: 'placeholder-svg' -%}
+
+ {%- render 'home-onboard-product', image: image -%}
+ {%- endfor -%}
+ {%- else -%}
+ {% for product in collection.products %}
+ {%
+ render 'product-list-item',
+ product: product,
+ %}
+ {% else %}
+ {% capture continueLink %}
+ <a href="{{ routes.all_products_collection_url }}">{{ 'collections.collection.continue_link' | t }}</a>
+ {% endcapture %}
+ <p class="empty">{{ 'collections.collection.empty_html' | t: continue_link: continueLink }}</p>
+ {% endfor %}
+ {%- endif -%}
+ </div>
+ </section>
+
+ {%
+ render 'pagination',
+ paginate: paginate,
+ %}
+ {% endpaginate %}
+</div>
+
+{%- comment -%}
+ collection-grid-density.js include removed 2026-06-23: it queried
+ [data-collection-grid-slider] / [data-grid-density-value], which the current
+ toolbar markup never renders, so it was dead code. Grid density is now owned
+ solely by the canonical collection-toolbar snippet (#densitySlider).
+{%- endcomment -%}
+
+{% schema %}
+{
+ "name": "Collection pages",
+ "settings": [
+ {
+ "type": "checkbox",
+ "id": "show_collection_image",
+ "label": "Show collection image"
+ },
+ {
+ "type": "checkbox",
+ "id": "show_description",
+ "label": "Show description"
+ },
+ {
+ "type": "checkbox",
+ "id": "sorting",
+ "label": "Enable sorting",
+ "info": "Parameters include: best selling, A-Z, newest to oldest, etc."
+ },
+ {
+ "type": "checkbox",
+ "id": "show_filters",
+ "label": "Enable filtering",
+ "default": true
+ },
+ {
+ "type": "select",
+ "id": "layout",
+ "label": "Layout",
+ "options": [
+ {
+ "value": "default",
+ "label": "Default"
+ },
+ {
+ "value": "masonry",
+ "label": "Masonry"
+ }
+ ],
+ "default": "default"
+ },
+ {
+ "type": "range",
+ "id": "products_per_row",
+ "label": "Products per row",
+ "min": 2,
+ "max": 4,
+ "step": 1,
+ "default": 3
+ },
+ {
+ "type": "range",
+ "id": "number_of_rows",
+ "label": "Rows",
+ "min": 1,
+ "max": 12,
+ "step": 1,
+ "default": 3
+ }
+ ]
+}
+
+{% endschema %}
← 8726db5e Designtex fill-in Step 3 COMPLETE: spec metafields (global.*
·
back to Designer Wallcoverings
·
Add consolidated single-pass LIVE push for all 5 collection 9ae1ee0e →