← back to Dw Theme Hamburger
header: person/cart icons, camera right of search, phone tel: link, move Custom Walls + Trade into hamburger
891c82c60137be6166019fbe616b7583a98ad31f · 2026-07-14 11:22:37 -0700 · Steve Abrams
Files touched
M assets/custom.cssM sections/header-group.jsonM sections/header.liquidM snippets/icons.liquidM snippets/mobile-nav.liquid
Diff
commit 891c82c60137be6166019fbe616b7583a98ad31f
Author: Steve Abrams <steve@designerwallcoverings.com>
Date: Tue Jul 14 11:22:37 2026 -0700
header: person/cart icons, camera right of search, phone tel: link, move Custom Walls + Trade into hamburger
---
assets/custom.css | 29 +++++++++++++++++++++++++++++
sections/header-group.json | 20 ++------------------
sections/header.liquid | 16 ++++++++--------
snippets/icons.liquid | 12 ++++++++++++
snippets/mobile-nav.liquid | 7 +++++++
5 files changed, 58 insertions(+), 26 deletions(-)
diff --git a/assets/custom.css b/assets/custom.css
index 9125f6b..ce760bb 100644
--- a/assets/custom.css
+++ b/assets/custom.css
@@ -1318,3 +1318,32 @@ input.add-to-cart:hover,
opacity: 1 !important;
visibility: visible !important;
}
+
+/* ---- Header utility icons (person / cart) + camera right of search ---- */
+.header-icon-link {
+ display: inline-flex;
+ align-items: center;
+ gap: 3px;
+ color: inherit;
+}
+.header-icon-link svg {
+ width: 22px;
+ height: 22px;
+ display: block;
+}
+.cart-count.header-icon-link .cart-count-number,
+.sticky-header-cart-count.header-icon-link .cart-count-number {
+ font-size: 13px;
+ line-height: 1;
+}
+/* Camera (visual search) sits to the RIGHT of the search field */
+.header-search-inline {
+ flex-wrap: nowrap;
+}
+.header-search-inline .search-form {
+ order: 1;
+}
+.header-search-inline__visual {
+ order: 2;
+ margin-left: 4px;
+}
diff --git a/sections/header-group.json b/sections/header-group.json
index 3799b0d..2680d02 100644
--- a/sections/header-group.json
+++ b/sections/header-group.json
@@ -29,22 +29,8 @@
"header_customer_link_xeQjb3": {
"type": "header_customer_link",
"settings": {
- "link_text": "Contact us: (888) 373-4564",
- "link_url": "https://designer-laboratory-sandbox.myshopify.com/pages/contact-us"
- }
- },
- "header_customer_link_BhwTkX": {
- "type": "header_customer_link",
- "settings": {
- "link_text": "Apply for a trade",
- "link_url": "https://www.designerwallcoverings.com/pages/trade-only-benefits"
- }
- },
- "header_customer_link_gxgXa3": {
- "type": "header_customer_link",
- "settings": {
- "link_text": "Custom walls",
- "link_url": "https://designer-laboratory-sandbox.myshopify.com/pages/custom"
+ "link_text": "(888) 373-4564",
+ "link_url": "tel:+18883734564"
}
},
"mega_menu_37rKTg": {
@@ -110,8 +96,6 @@
},
"block_order": [
"header_customer_link_xeQjb3",
- "header_customer_link_BhwTkX",
- "header_customer_link_gxgXa3",
"mega_menu_37rKTg",
"mega_menu_xmfqGW",
"mega_menu_Wxi38J",
diff --git a/sections/header.liquid b/sections/header.liquid
index d5e628f..39246bc 100644
--- a/sections/header.liquid
+++ b/sections/header.liquid
@@ -70,7 +70,7 @@
{% if shop.customer_accounts_enabled %}
<div class="customer-links">
{% if customer %}
- <a href="{{ routes.account_url }}">{{ 'layout.header.my_account' | t }}</a>
+ <a href="{{ routes.account_url }}" class="header-icon-link" aria-label="{{ 'layout.header.my_account' | t }}" title="{{ 'layout.header.my_account' | t }}">{% render 'icons', id: 'person' %}</a>
<div class="customer-links-inner">
<span class="arrow"></span>
@@ -81,15 +81,15 @@
</ul>
</div>
{% else %}
- <a class="customer-login-link" href="{{ routes.account_login_url }}" data-dw-signin>{{ 'layout.header.account' | t }}</a>
+ <a class="customer-login-link header-icon-link" href="{{ routes.account_login_url }}" data-dw-signin aria-label="{{ 'layout.header.account' | t }}" title="{{ 'layout.header.account' | t }}">{% render 'icons', id: 'person' %}</a>
{% endif %}
</div>
{% endif %}
<div class="mini-cart-wrapper">
- <a class="cart-count" href="{{ routes.cart_url }}" data-cart-count>
- <span class="cart-count-text">{{ 'layout.header.cart' | t }}</span>
- (<span class="cart-count-number">{{ cart.item_count }}</span>)
+ <a class="cart-count header-icon-link" href="{{ routes.cart_url }}" data-cart-count aria-label="{{ 'layout.header.cart' | t }}" title="{{ 'layout.header.cart' | t }}">
+ <span class="cart-count-icon">{% render 'icons', id: 'cart' %}</span>
+ <span class="cart-count-number">{{ cart.item_count }}</span>
</a>
{% render 'mini-cart' %}
@@ -317,9 +317,9 @@
</button>
{% if section.settings.sticky_header %}
- <a class="sticky-header-cart-count" href="{{ routes.cart_url }}" data-cart-count>
- <span class="cart-count-text">{{ 'layout.header.cart' | t }}</span>
- (<span class="cart-count-number">{{ cart.item_count }}</span>)
+ <a class="sticky-header-cart-count header-icon-link" href="{{ routes.cart_url }}" data-cart-count aria-label="{{ 'layout.header.cart' | t }}" title="{{ 'layout.header.cart' | t }}">
+ <span class="cart-count-icon">{% render 'icons', id: 'cart' %}</span>
+ <span class="cart-count-number">{{ cart.item_count }}</span>
</a>
{% endif %}
</div>
diff --git a/snippets/icons.liquid b/snippets/icons.liquid
index 8f403e5..27eae96 100644
--- a/snippets/icons.liquid
+++ b/snippets/icons.liquid
@@ -83,6 +83,18 @@
</svg>
{% endif %}
+{% if id == 'person' %}
+ <svg {{ shared_attr }} width="20" height="20" viewBox="0 0 24 24">
+ <path fill="currentColor" d="M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-4.418 0-8 2.239-8 5v1h16v-1c0-2.761-3.582-5-8-5z"/>
+ </svg>
+{% endif %}
+
+{% if id == 'cart' %}
+ <svg {{ shared_attr }} width="20" height="20" viewBox="0 0 24 24">
+ <path fill="currentColor" d="M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12L8.1 13h7.45c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.08-.14.12-.31.12-.48 0-.55-.45-1-1-1H5.21l-.94-2H1zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z"/>
+ </svg>
+{% endif %}
+
{% if id == 'prev-button' %}
<svg {{ shared_attr }} width="30" height="30" viewBox="0 0 100 100">
<path d="M 10,50 L 60,100 L 70,90 L 30,50 L 70,10 L 60,0 Z" class="arrow" stroke="currentColor"></path>
diff --git a/snippets/mobile-nav.liquid b/snippets/mobile-nav.liquid
index 03d0508..4d7de44 100644
--- a/snippets/mobile-nav.liquid
+++ b/snippets/mobile-nav.liquid
@@ -107,6 +107,13 @@
</li>
{% endfor %}
+ <li class="mobile-link mobile-link--utility">
+ <a href="/pages/custom">Custom Walls</a>
+ </li>
+ <li class="mobile-link mobile-link--utility">
+ <a href="/pages/trade-only-benefits">Apply for a Trade Account</a>
+ </li>
+
{% if shop.customer_accounts_enabled %}
{% if customer %}
<li class="mobile-link">
← 9e5f227 pdp: move 'More Wallcoverings Like This' to page bottom + Re
·
back to Dw Theme Hamburger
·
hamburger: pin Custom Walls + Trade to top of drawer, bold + 97cb750 →