← back to Dw Theme Live Signin Split

Split top-banner sign-in: Trade Sign In -> /pages/trade-only-benefits (bypasses modal); Retail Login modal stripped to retail-only with Sign In / Create account / 3 lifetime complimentary samples copy

00fb8b8debc7ddceb418fb79f5a7cd0292af6c22 · 2026-08-31 10:17:14 -0700 · Steve

- header.liquid: add 'Trade Sign In' text link -> /pages/trade-only-benefits next to person-icon; person-icon relabeled 'Retail Login' (keeps data-dw-signin retail modal trigger)
- dw-signin-modal.liquid: remove Professional/trade toggle + trade-apply form; retail-only Existing customer Sign In + Create an account; copy 'Retail accounts receive 3 lifetime complimentary samples'
- mobile-nav.liquid: mobile account link now opens retail modal (data-dw-signin), relabeled 'Retail Login'; existing Trade link untouched
- customer account/register dw_trade redirect: UNTOUCHED (retained for legacy retail->trade edge)

Files touched

• M sections/header.liquid
• M snippets/dw-signin-modal.liquid
• M snippets/mobile-nav.liquid

Diff

commit 00fb8b8debc7ddceb418fb79f5a7cd0292af6c22
Author: Steve <steve@designerwallcoverings.com>
Date:   Mon Aug 31 10:17:14 2026 -0700

    Split top-banner sign-in: Trade Sign In -> /pages/trade-only-benefits (bypasses modal); Retail Login modal stripped to retail-only with Sign In / Create account / 3 lifetime complimentary samples copy
    
    - header.liquid: add 'Trade Sign In' text link -> /pages/trade-only-benefits next to person-icon; person-icon relabeled 'Retail Login' (keeps data-dw-signin retail modal trigger)
    - dw-signin-modal.liquid: remove Professional/trade toggle + trade-apply form; retail-only Existing customer Sign In + Create an account; copy 'Retail accounts receive 3 lifetime complimentary samples'
    - mobile-nav.liquid: mobile account link now opens retail modal (data-dw-signin), relabeled 'Retail Login'; existing Trade link untouched
    - customer account/register dw_trade redirect: UNTOUCHED (retained for legacy retail->trade edge)
---
 sections/header.liquid          |   7 ++-
 snippets/dw-signin-modal.liquid | 125 +++++-----------------------------------
 snippets/mobile-nav.liquid      |   2 +-
 3 files changed, 23 insertions(+), 111 deletions(-)

diff --git a/sections/header.liquid b/sections/header.liquid
index ea5bf13..5e880e4 100644
--- a/sections/header.liquid
+++ b/sections/header.liquid
@@ -1,6 +1,8 @@
 <style>
   .main-header .header-content-right .customer-links{ display:inline-flex !important; align-items:center; position:relative; margin:0; }
   .main-header .header-content-right .customer-links > .header-icon-link{ display:inline-flex; align-items:center; }
+  .main-header .header-content-right .customer-links > .dw-trade-signin-link{ display:inline-flex; align-items:center; font-family:Lora,serif; font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:#26241f; text-decoration:none; white-space:nowrap; margin-right:14px; border-right:1px solid #e0dcd2; padding-right:14px; }
+  .main-header .header-content-right .customer-links > .dw-trade-signin-link:hover{ color:#b08212; }
   .dw-mobile-search{ display:none; }
   /* Mobile header: logo row, full-width search row, then a clean icon row below; hamburger top-right */
   @media(max-width:749px){
@@ -328,7 +330,10 @@
                 </ul>
               </div>
             {% else %}
-              <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>
+              {%- comment -%} Trade Sign In — routes STRAIGHT to the trade benefits page (bypasses the retail modal). {%- endcomment -%}
+              <a class="dw-trade-signin-link" href="/pages/trade-only-benefits" aria-label="Trade Sign In" title="Trade Sign In">Trade Sign In</a>
+              {%- comment -%} Retail Login — person icon opens the retail-only sign-in modal (data-dw-signin). {%- endcomment -%}
+              <a class="customer-login-link header-icon-link" href="{{ routes.account_login_url }}" data-dw-signin aria-label="Retail Login" title="Retail Login">{% render 'icons', id: 'person' %}</a>
             {% endif %}
           </div>
         {% endif %}
diff --git a/snippets/dw-signin-modal.liquid b/snippets/dw-signin-modal.liquid
index 2cb49dc..de7a9fd 100644
--- a/snippets/dw-signin-modal.liquid
+++ b/snippets/dw-signin-modal.liquid
@@ -1,4 +1,4 @@
-{% comment %} DW sign-in popup — returning clients sign in first (passwordless, email-code); new visitors choose Retail (emailed code for 3 free samples) or Professional (moderated Apply for Trade). dw_trade flag consumed in templates/customers/account.liquid. {% endcomment %}
+{% comment %} DW RETAIL sign-in popup — retail only. Returning customer signs in (passwordless email-code) or creates an account; retail accounts receive 3 lifetime complimentary samples. The Trade path no longer lives here — the header "Trade Sign In" link routes straight to /pages/trade-only-benefits. The dw_trade redirect in templates/customers/{account,register}.liquid is retained for any legacy retail->trade edge. {% endcomment %}
 <style>
   .dwsm-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:99999;display:none;align-items:flex-start;justify-content:center;padding:6vh 16px;overflow-y:auto;font-family:Lora,serif;}
   .dwsm-overlay.dwsm-open{display:flex;}
@@ -8,24 +8,13 @@
   .dwsm-offer{text-align:center;margin:0 0 20px;}
   .dwsm-offer h2{font-weight:400;font-size:1.55rem;color:#000;margin:0 0 4px;letter-spacing:.02em;}
   .dwsm-offer p{font-size:.86rem;color:#787878;margin:0;}
-  .dwsm-toggle{display:flex;gap:10px;margin:0 0 24px;}
-  .dwsm-opt{flex:1;text-align:center;border:1px solid #e4e4e4;border-radius:4px;padding:13px 8px;cursor:pointer;transition:all .15s ease;background:#fff;}
-  .dwsm-opt:hover{border-color:#b08212;}
-  .dwsm-opt.active{border-color:#b08212;background:#faf6ec;box-shadow:0 0 0 1px #b08212;}
-  .dwsm-opt .t{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:#444;margin-bottom:3px;}
-  .dwsm-opt .s{display:block;font-size:.92rem;color:#b08212;}
   .dwsm-gbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px 20px;background:#fff;border:1px solid #dadce0;border-radius:3px;cursor:pointer;font-family:Lora,serif;font-size:.92rem;color:#3c4043;margin-bottom:18px;}
   .dwsm-gbtn:hover{background:#f7f8f8;}
   .dwsm-div{display:flex;align-items:center;gap:14px;margin:0 0 18px;}
   .dwsm-div span{font-size:.72rem;color:#999;text-transform:uppercase;letter-spacing:.1em;}
   .dwsm-div i{flex:1;height:1px;background:#e4e4e4;}
-  .dwsm-field{margin-bottom:16px;}
-  .dwsm-field label{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.03em;color:#444;margin-bottom:6px;}
-  .dwsm-field input{width:100%;padding:12px 14px;border:1px solid #e4e4e4;border-radius:3px;font-family:Lora,serif;font-size:.95rem;color:#444;box-sizing:border-box;}
-  .dwsm-field input:focus{outline:none;border-color:#b08212;box-shadow:0 0 0 1px #b08212;}
   .dwsm-overlay input.dwsm-submit{width:100%;padding:14px;background:#000 !important;color:#fff !important;border:none !important;border-radius:3px;font-family:Lora,serif;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;}
   .dwsm-overlay input.dwsm-submit:hover{background:#262626 !important;}
-  .dwsm-err{background:#fef2f2;border:1px solid #fca5a5;color:#991b1b;font-size:.85rem;padding:10px 14px;border-radius:3px;margin-bottom:16px;text-align:center;}
   .dwsm-return{margin:0 0 8px;}
   .dwsm-return h2{font-weight:400;font-size:1.55rem;color:#000;margin:0 0 14px;letter-spacing:.02em;text-align:center;}
   .dwsm-return-cap{font-size:.82rem;color:#787878;margin:2px 0 0;text-align:center;}
@@ -38,13 +27,12 @@
 </style>
 
 <div class="dwsm-overlay" id="dw-signin" data-dwsm-overlay>
-  <div class="dwsm-card" role="dialog" aria-modal="true" aria-label="Sign in">
+  <div class="dwsm-card" role="dialog" aria-modal="true" aria-label="Retail sign in">
     <button class="dwsm-close" type="button" data-dwsm-close aria-label="Close">&times;</button>
 
     {%- comment -%} (0) RETURNING SIGN-IN — first and most prominent. Passwordless: email -> 6-digit code. {%- endcomment -%}
-    {%- unless customer -%}
     <div class="dwsm-return">
-      <h2>Welcome back</h2>
+      <h2>Existing customer?</h2>
       <input type="button" class="dwsm-submit" data-dwsm-login="{{ routes.account_login_url }}" value="Sign In" style="margin-bottom:12px;">
       <button type="button" class="dwsm-gbtn" data-dwsm-login="{{ routes.account_login_url }}">
         <svg width="18" height="18" viewBox="0 0 18 18" aria-hidden="true"><path fill="#4285F4" d="M17.64 9.2c0-.64-.06-1.25-.16-1.84H9v3.48h4.84a4.14 4.14 0 0 1-1.8 2.72v2.26h2.92c1.7-1.57 2.68-3.88 2.68-6.62z"/><path fill="#34A853" d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.92-2.26c-.81.54-1.84.86-3.04.86-2.34 0-4.32-1.58-5.03-3.7H.96v2.33A9 9 0 0 0 9 18z"/><path fill="#FBBC05" d="M3.97 10.72a5.4 5.4 0 0 1 0-3.44V4.95H.96a9 9 0 0 0 0 8.1l3.01-2.33z"/><path fill="#EA4335" d="M9 3.58c1.32 0 2.5.45 3.44 1.35l2.58-2.58C13.47.9 11.43 0 9 0A9 9 0 0 0 .96 4.95l3.01 2.33C4.68 5.16 6.66 3.58 9 3.58z"/></svg>
@@ -53,67 +41,25 @@
       <p class="dwsm-return-cap">Returning customer? Just enter your email — no password needed.</p>
     </div>
 
-    <div class="dwsm-newdiv"><i></i><span>New to Designer Wallcoverings?</span><i></i></div>
+    <div class="dwsm-newdiv"><i></i><span>New here?</span><i></i></div>
 
     <div class="dwsm-offer">
-      <h2>Free Samples, On Us</h2>
-      <p>Sign in — we'll email you a code for 3 free samples.</p>
+      <h2>Create an account</h2>
+      <p>Retail accounts receive 3 lifetime complimentary samples.</p>
     </div>
 
-    <div class="dwsm-toggle">
-      <div class="dwsm-opt active" data-dwsm-type="retail" role="button" tabindex="0">
-        <span class="t">Retail</span><span class="s">code for 3 free</span>
-      </div>
-      <div class="dwsm-opt" data-dwsm-type="professional" role="button" tabindex="0">
-        <span class="t">Professional</span><span class="s">apply for trade</span>
-      </div>
-    </div>
+    {%- comment -%} New-visitor Google sign-up; deep-links to the hosted portal's native Google. {%- endcomment -%}
+    <button type="button" class="dwsm-gbtn" data-dwsm-login="{{ routes.account_register_url }}">
+      <svg width="18" height="18" viewBox="0 0 18 18" aria-hidden="true"><path fill="#4285F4" d="M17.64 9.2c0-.64-.06-1.25-.16-1.84H9v3.48h4.84a4.14 4.14 0 0 1-1.8 2.72v2.26h2.92c1.7-1.57 2.68-3.88 2.68-6.62z"/><path fill="#34A853" d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.92-2.26c-.81.54-1.84.86-3.04.86-2.34 0-4.32-1.58-5.03-3.7H.96v2.33A9 9 0 0 0 9 18z"/><path fill="#FBBC05" d="M3.97 10.72a5.4 5.4 0 0 1 0-3.44V4.95H.96a9 9 0 0 0 0 8.1l3.01-2.33z"/><path fill="#EA4335" d="M9 3.58c1.32 0 2.5.45 3.44 1.35l2.58-2.58C13.47.9 11.43 0 9 0A9 9 0 0 0 .96 4.95l3.01 2.33C4.68 5.16 6.66 3.58 9 3.58z"/></svg>
+      Continue with Google
+    </button>
+    <div class="dwsm-div"><i></i><span>or</span><i></i></div>
 
-    {%- comment -%} Google sign-up offered up front; deep-links to the hosted portal's native Google. {%- endcomment -%}
-    <div data-dwsm-google>
-      <button type="button" class="dwsm-gbtn" data-dwsm-login="{{ routes.account_login_url }}">
-        <svg width="18" height="18" viewBox="0 0 18 18" aria-hidden="true"><path fill="#4285F4" d="M17.64 9.2c0-.64-.06-1.25-.16-1.84H9v3.48h4.84a4.14 4.14 0 0 1-1.8 2.72v2.26h2.92c1.7-1.57 2.68-3.88 2.68-6.62z"/><path fill="#34A853" d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.92-2.26c-.81.54-1.84.86-3.04.86-2.34 0-4.32-1.58-5.03-3.7H.96v2.33A9 9 0 0 0 9 18z"/><path fill="#FBBC05" d="M3.97 10.72a5.4 5.4 0 0 1 0-3.44V4.95H.96a9 9 0 0 0 0 8.1l3.01-2.33z"/><path fill="#EA4335" d="M9 3.58c1.32 0 2.5.45 3.44 1.35l2.58-2.58C13.47.9 11.43 0 9 0A9 9 0 0 0 .96 4.95l3.01 2.33C4.68 5.16 6.66 3.58 9 3.58z"/></svg>
-        Continue with Google
-      </button>
-      <div class="dwsm-div"><i></i><span>or</span><i></i></div>
-    </div>
+    <input type="button" class="dwsm-submit" data-dwsm-login="{{ routes.account_register_url }}" value="Create an Account">
 
-    {%- endunless -%}
-    {%- if customer -%}
-    <div class="dwsm-return">
-      <h2>Apply for Trade Pricing</h2>
-      <p class="dwsm-return-cap">You're signed in — submit your business details and our team will review your trade account.</p>
+    <div class="dwsm-foot">
+      Prefer trade pricing? <a href="/pages/trade-only-benefits">Apply for a Trade Account</a>
     </div>
-    {%- endif -%}
-    {%- comment -%} Moderated trade application — shown when "Professional" is selected. {%- endcomment -%}
-    <form class="dwsm-trade" data-dwsm-trade style="display:{% if customer %}block{% else %}none{% endif %};" novalidate>
-      <div class="dwsm-field">
-        <label>Business name</label>
-        <input type="text" name="business_name" autocomplete="organization" value="{{ customer.default_address.company }}" required>
-      </div>
-      <div class="dwsm-field">
-        <label>Work email</label>
-        <input type="email" name="email" autocomplete="email" value="{{ customer.email }}" required>
-      </div>
-      <div class="dwsm-field">
-        <label>Resale / business license #</label>
-        <input type="text" name="resale_cert">
-      </div>
-      <input type="button" class="dwsm-submit" data-dwsm-trade-submit value="Apply for Trade">
-      <p class="dwsm-trade-note" style="font-size:.78rem;color:#787878;margin:12px 0 0;text-align:center;">
-        Trade applications are reviewed by our team. We'll email you once approved.
-      </p>
-    </form>
-
-    {%- unless customer -%}
-    <div data-dwsm-retail>
-      <input type="button" class="dwsm-submit" data-dwsm-login="{{ routes.account_login_url }}" value="Sign In / Create Account">
-
-      <div class="dwsm-foot">
-        New to Designer Wallcoverings? <a href="{{ routes.account_register_url }}">Create account</a>
-      </div>
-    </div>
-    {%- endunless -%}
   </div>
 </div>
 
@@ -121,55 +67,16 @@
 (function(){
   var overlay=document.getElementById('dw-signin');
   if(!overlay) return;
-  var TRADE_APPLY_URL = 'https://signup.designerwallcoverings.com/trade/apply'; // fulfillment service public URL
   function open(){overlay.classList.add('dwsm-open');document.body.style.overflow='hidden';}
   function close(){overlay.classList.remove('dwsm-open');document.body.style.overflow='';}
-  function persistTrade(){
-    var proEl=overlay.querySelector('[data-dwsm-type="professional"]');
-    var pro=proEl&&proEl.classList.contains('active');
-    try{pro?sessionStorage.setItem('dw_trade','1'):sessionStorage.removeItem('dw_trade');}catch(e){}
-  }
   document.addEventListener('click',function(e){
     var t=e.target.closest('[data-dw-signin], a[href="#dw-signin"], a[href$="#dw-signin"]');
     if(t){e.preventDefault();open();return;}
     var login=e.target.closest('[data-dwsm-login]');
-    if(login){e.preventDefault();persistTrade();window.location.href=login.getAttribute('data-dwsm-login');return;}
+    if(login){e.preventDefault();window.location.href=login.getAttribute('data-dwsm-login');return;}
     if(e.target.closest('[data-dwsm-close]')||e.target===overlay){close();}
   });
   document.addEventListener('keydown',function(e){if(e.key==='Escape')close();});
-  var opts=overlay.querySelectorAll('[data-dwsm-type]');
-  var retailBox=overlay.querySelector('[data-dwsm-retail]');
-  var googleBox=overlay.querySelector('[data-dwsm-google]');
-  var tradeForm=overlay.querySelector('[data-dwsm-trade]');
-  function setType(type){
-    opts.forEach(function(o){o.classList.toggle('active',o.getAttribute('data-dwsm-type')===type);});
-    var pro=(type==='professional');
-    if(retailBox) retailBox.style.display=pro?'none':'';
-    if(googleBox) googleBox.style.display=pro?'none':'';
-    if(tradeForm) tradeForm.style.display=pro?'block':'none';
-    try{pro?sessionStorage.setItem('dw_trade','1'):sessionStorage.removeItem('dw_trade');}catch(e){}
-  }
-  // Moderated trade application submit -> POST /trade/apply on the fulfillment service.
-  overlay.addEventListener('click',function(e){
-    if(!e.target.closest('[data-dwsm-trade-submit]')) return;
-    e.preventDefault();
-    var f=tradeForm; if(!f) return;
-    var body={
-      business_name:(f.business_name.value||'').trim(),
-      email:(f.email.value||'').trim(),
-      resale_cert:(f.resale_cert.value||'').trim()
-    };
-    if(!body.email||!body.business_name){alert('Business name and work email are required.');return;}
-    fetch(TRADE_APPLY_URL,{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(body)})
-      .then(function(r){return r.json();})
-      .then(function(){f.innerHTML='<p style="text-align:center;color:#444;padding:8px 0;">Thanks — your trade application is in review. We\'ll email you once it\'s approved.</p>';})
-      .catch(function(){alert('Sorry, something went wrong. Please try again.');});
-  });
-  opts.forEach(function(o){
-    o.addEventListener('click',function(){setType(o.getAttribute('data-dwsm-type'));});
-    o.addEventListener('keydown',function(e){if(e.key==='Enter'||e.key===' '){e.preventDefault();setType(o.getAttribute('data-dwsm-type'));}});
-  });
   if(window.location.hash==='#dw-signin'){open();}
 })();
 </script>
-
diff --git a/snippets/mobile-nav.liquid b/snippets/mobile-nav.liquid
index 50a22c5..a1bb99a 100644
--- a/snippets/mobile-nav.liquid
+++ b/snippets/mobile-nav.liquid
@@ -127,7 +127,7 @@
         </li>
       {% else %}
         <li class="mobile-link">
-          <a class="customer-login-link" href="{{ routes.account_login_url }}">{{ 'layout.header.account' | t }}</a>
+          <a class="customer-login-link" href="{{ routes.account_login_url }}" data-dw-signin>Retail Login</a>
         </li>
       {% endif %}
     {% endif %}

← db40c7c snapshot: LIVE theme (carnegie-color-swatch 145121607731) ba  ·  back to Dw Theme Live Signin Split  ·  snapshot: LIVE pxs-announcement-bar.liquid + header-group.js ec4d13e →