← back to Dw Signup Fulfillment

verification/tk11283/live-snippets__dw-trade-apply.liquid

221 lines

{%- comment -%} DW-TRADE-APPLY v1 — benefits-first trade application and existing-account entry. {%- endcomment -%}
<!-- DW-TRADE-APPLY v1 -->
{%- assign dw_trade_is_approved = false -%}
{%- if customer and customer.tags contains 'trade_approved' -%}{%- assign dw_trade_is_approved = true -%}{%- endif -%}
{%- assign dw_room_day = 'now' | date: '%j' | plus: 0 | modulo: 4 -%}
{%- case dw_room_day -%}
  {%- when 0 -%}
    {%- assign dw_room_url = 'https://cdn.shopify.com/s/files/1/0015/4117/7456/files/Dig-4350115_room_setting_9dfcbae3-3159-41ad-959b-6999c665fc90.jpg?v=1756872231' -%}
    {%- assign dw_room_alt = 'DW Bespoke DIG wallcovering in a vintage-inspired lounge' -%}
  {%- when 1 -%}
    {%- assign dw_room_url = 'https://cdn.shopify.com/s/files/1/0015/4117/7456/files/Dig-74757_room_setting.jpg?v=1756870908' -%}
    {%- assign dw_room_alt = 'DW Bespoke DIG floral wallcovering in a colorful sitting room' -%}
  {%- when 2 -%}
    {%- assign dw_room_url = 'https://cdn.shopify.com/s/files/1/0015/4117/7456/products/Dig-7320421_room_settingVeriPeri.jpg?v=1756707586' -%}
    {%- assign dw_room_alt = 'DW Bespoke DIG botanical lattice wallcovering in a dining room' -%}
  {%- else -%}
    {%- assign dw_room_url = 'https://cdn.shopify.com/s/files/1/0015/4117/7456/collections/Dig-540002-roomsetting_62674c3c-b59d-4d36-aa8a-b7a696cbbb51.jpg?v=1774040040' -%}
    {%- assign dw_room_alt = 'DW Bespoke DIG harlequin wallcovering in a collected powder room' -%}
{%- endcase -%}
{%- capture dw_existing_login_url -%}{{ routes.account_login_url }}{% if routes.account_login_url contains '?' %}&amp;{% else %}?{% endif %}return_url={{ request.path | url_encode }}{%- endcapture -%}
<main class="dw-ta" aria-labelledby="dwTaTitle">
  <section class="dw-ta-hero">
    <div class="dw-ta-hero__media" role="img" aria-label="{{ dw_room_alt | escape }}" data-dw-daily-room="{{ dw_room_day }}" style="--dw-ta-room:url('{{ dw_room_url }}')"></div>
    <div class="dw-ta-hero__copy">
      <p class="dw-ta-eyebrow">Designer Wallcoverings · Trade program</p>
      <h1 id="dwTaTitle">A better way to source the wall.</h1>
      <p class="dw-ta-deck">For interior designers, architects, hospitality teams, and qualified design professionals. Apply once for a project-ready account with unlimited complimentary samples.</p>
      <div class="dw-ta-actions">
        <a class="dw-ta-button dw-ta-button--dark" href="#dwTradeApplication">Apply for trade</a>
        {%- if customer -%}
          <a class="dw-ta-button dw-ta-button--quiet" href="{{ routes.account_url }}">View my account</a>
        {%- else -%}
          <a class="dw-ta-button dw-ta-button--quiet" href="{{ dw_existing_login_url }}" data-dw-returning>Existing account sign in</a>
        {%- endif -%}
      </div>
      <p class="dw-ta-note">Already shopped with us? Sign in with the same email to retain your account and order history—do not create a second account.</p>
    </div>
  </section>

  <section class="dw-ta-benefits" aria-labelledby="dwTaBenefits">
    <div class="dw-ta-heading">
      <p class="dw-ta-eyebrow">Trade privileges</p>
      <h2 id="dwTaBenefits">Made for material decisions.</h2>
    </div>
    <div class="dw-ta-benefit-grid">
      <article><span>01</span><h3>Unlimited samples</h3><p>Approved designers receive complimentary sample pricing automatically while signed in.</p></article>
      <article><span>02</span><h3>Project sourcing</h3><p>Bring us a reference, performance brief, or hard-to-find pattern. Our specialists help narrow the field.</p></article>
      <article><span>03</span><h3>Residential + contract</h3><p>Source decorative collections alongside Type II, acoustic, hospitality, and commercial surfaces.</p></article>
      <article><span>04</span><h3>A real design desk</h3><p>Get support from people who understand repeats, grounds, yardage, lead times, and installation.</p></article>
    </div>
  </section>

  <section class="dw-ta-apply" id="dwTradeApplication" aria-labelledby="dwTaApplyTitle">
    <aside class="dw-ta-apply__intro">
      <p class="dw-ta-eyebrow">Trade application</p>
      <h2 id="dwTaApplyTitle">Tell us about your practice.</h2>
      <p>Applications are reviewed by our team. Approval activates your trade experience and unlimited complimentary samples.</p>
      <div class="dw-ta-existing">
        <strong>Existing customer?</strong>
        <span>Use your original email so your orders and account stay together.</span>
        {%- if customer -%}
          <a href="{{ routes.account_url }}">View your existing account &rsaquo;</a>
        {%- else -%}
          <a href="{{ dw_existing_login_url }}" data-dw-returning>Sign in to your existing account &rsaquo;</a>
        {%- endif -%}
      </div>
    </aside>

    <div class="dw-ta-form-wrap">
      {%- if dw_trade_is_approved -%}
        <div class="dw-ta-approved" role="status">
          <p class="dw-ta-eyebrow">Trade account active</p>
          <h3>You’re already approved.</h3>
          <p>Your unlimited complimentary sample benefit applies automatically while you are signed in.</p>
          <a class="dw-ta-button dw-ta-button--dark" href="{{ routes.all_products_collection_url }}">Start sourcing</a>
        </div>
      {%- else -%}
        <form class="dw-ta-form" id="dwTradeForm" novalidate>
          <div class="dw-ta-field dw-ta-field--wide">
            <label for="dwTaName">Your name <span aria-hidden="true">*</span></label>
            <input id="dwTaName" name="contact_name" type="text" autocomplete="name" required>
          </div>
          <div class="dw-ta-field">
            <label for="dwTaEmail">Work email <span aria-hidden="true">*</span></label>
            <input id="dwTaEmail" name="email" type="email" autocomplete="email" value="{{ customer.email | escape }}" required>
          </div>
          <div class="dw-ta-field">
            <label for="dwTaPhone">Phone <span aria-hidden="true">*</span></label>
            <input id="dwTaPhone" name="phone" type="tel" autocomplete="tel" required>
          </div>
          <div class="dw-ta-field dw-ta-field--wide">
            <label for="dwTaBusiness">Studio or business name <span aria-hidden="true">*</span></label>
            <input id="dwTaBusiness" name="business_name" type="text" autocomplete="organization" required>
          </div>
          <div class="dw-ta-field">
            <label for="dwTaRole">Professional role <span aria-hidden="true">*</span></label>
            <select id="dwTaRole" name="professional_role" required>
              <option value="">Select one</option><option>Interior designer</option><option>Architect</option><option>Hospitality / contract</option><option>Set decorator</option><option>Purchasing agent</option><option>Installer / workroom</option><option>Other design professional</option>
            </select>
          </div>
          <div class="dw-ta-field">
            <label for="dwTaWebsite">Website or portfolio</label>
            <input id="dwTaWebsite" name="website" type="url" autocomplete="url" placeholder="https://">
          </div>
          <div class="dw-ta-field">
            <label for="dwTaLocation">City + state <span aria-hidden="true">*</span></label>
            <input id="dwTaLocation" name="location" type="text" autocomplete="address-level2" required>
          </div>
          <div class="dw-ta-field">
            <label for="dwTaCredential">Resale certificate / license</label>
            <input id="dwTaCredential" name="resale_cert" type="text">
          </div>
          <div class="dw-ta-field dw-ta-field--wide">
            <label for="dwTaProjects">What kinds of projects are you sourcing?</label>
            <textarea id="dwTaProjects" name="project_types" rows="3" placeholder="Residential, hospitality, workplace…"></textarea>
          </div>
          <div class="dw-ta-field dw-ta-field--wide dw-ta-consent">
            <label><input name="terms_acknowledged" type="checkbox" value="yes" required> <span>I certify that I am applying on behalf of a design-related business and agree to the <a href="/pages/privacy-policy">privacy policy</a>.</span></label>
          </div>
          <div class="dw-ta-field dw-ta-field--wide dw-ta-consent dw-ta-sms-consent">
            <label for="dwTaSmsConsent">
              <input id="dwTaSmsConsent" name="sms_marketing_consent" type="checkbox" value="yes">
              <span>Yes, I agree to receive recurring automated promotional and personalized marketing text messages from Designer Wallcoverings at the mobile number provided. Consent is not a condition of purchase. Message frequency varies. Message and data rates may apply. Reply STOP to opt out or HELP for help. We honor opt-out requests and applicable Do Not Call requests; if you add this number to a Do Not Call list, please also reply STOP or <a href="/pages/contact-us">contact us</a> so we can promptly update our records. See our <a href="/pages/sms-terms">SMS Terms</a> and <a href="/pages/privacy-policy">Privacy Policy</a>.</span>
            </label>
            <p class="dw-ta-consent-note">Leave this box unchecked if you do not want marketing texts. We may still contact you about this application or transactions where permitted by law.</p>
            <details class="dw-ta-sms-terms" id="dwSmsTerms">
              <summary>SMS Terms</summary>
              <p>You must be at least 18 and the account holder or authorized user of the mobile number. Message frequency varies; message and data rates may apply. Carriers are not liable for delayed or undelivered messages. Reply STOP to opt out or HELP for help. After STOP, we may send one confirmation. Opting out of marketing does not prevent permitted non-marketing messages about an application, order, account, appointment, or other transaction. Tell us before changing or transferring your number. We honor valid consent withdrawals and applicable Do Not Call requests; if you add your number to a Do Not Call list after opting in, please also reply STOP or <a href="/pages/contact-us">contact us</a> so we can promptly update our records. This notice does not limit our responsibility to honor applicable law or a valid opt-out request.</p>
            </details>
          </div>
          <div class="dw-ta-submit dw-ta-field--wide">
            <button class="dw-ta-button dw-ta-button--dark" type="submit">Submit application</button>
            <p id="dwTradeStatus" class="dw-ta-status" aria-live="polite"></p>
          </div>
        </form>
      {%- endif -%}
    </div>
  </section>
</main>

{%- unless customer -%}
  <dialog class="dw-returning" id="dwReturningDialog" aria-labelledby="dwReturningTitle">
    <button class="dw-returning__close" type="button" aria-label="Close returning client sign in" data-dw-returning-close>&times;</button>
    <div class="dw-returning__room" role="img" aria-label="{{ dw_room_alt | escape }}" style="--dw-ta-room:url('{{ dw_room_url }}')"></div>
    <div class="dw-returning__body">
      <p class="dw-ta-eyebrow">Returning client</p>
      <h2 id="dwReturningTitle">Welcome back.</h2>
      <p>Use the email from your original Designer Wallcoverings account. Shopify will securely reconnect you—there is no new account to create.</p>
      <ul>
        <li>Your past orders stay with you</li>
        <li>Your retail sample balance is preserved</li>
        <li>Approved trade privileges remain attached</li>
      </ul>
      <a class="dw-ta-button dw-ta-button--dark" href="{{ dw_existing_login_url }}">Continue to secure sign in</a>
      <button class="dw-returning__new" type="button" data-dw-returning-close>New to DW? Return to the application</button>
    </div>
  </dialog>
{%- endunless -%}

<style>
  .dw-ta{--ta-ink:#181713;--ta-paper:#f3efe7;--ta-line:#d8d0c4;--ta-bronze:#795833;margin-top:16px;color:var(--ta-ink);background:#fff;font-family:var(--element-text-font-family--body,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif)}
  .dw-ta *{box-sizing:border-box}.visual-search-clickable{display:none!important}.dw-ta-hero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);min-height:690px;background:var(--ta-paper)}
  .dw-ta-hero__media{min-height:620px;background-image:linear-gradient(0deg,rgba(20,18,14,.12),rgba(20,18,14,.02)),var(--dw-ta-room);background-position:center;background-size:cover;background-repeat:no-repeat}
  .dw-ta-hero__copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(48px,7vw,108px)}
  .dw-ta-eyebrow{margin:0 0 18px;color:var(--ta-bronze);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
  .dw-ta h1,.dw-ta h2,.dw-ta h3{font-family:var(--element-text-font-family--heading,Georgia,serif);font-weight:400;text-transform:none}.dw-ta h1{max-width:640px;margin:0;font-size:clamp(48px,5.7vw,82px);line-height:.98;letter-spacing:-.035em}.dw-ta-deck{max-width:600px;margin:28px 0 0;font-size:clamp(17px,1.4vw,20px);line-height:1.65;color:#504c45}
  .dw-ta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}.dw-ta-button{display:inline-flex;min-height:50px;align-items:center;justify-content:center;border:1px solid var(--ta-ink);padding:13px 24px;background:transparent;color:var(--ta-ink);font:700 11px/1.2 var(--element-text-font-family--body,sans-serif);letter-spacing:.12em;text-decoration:none;text-transform:uppercase;cursor:pointer}.dw-ta-button--dark{background:var(--ta-ink);color:#fff}.dw-ta-button--quiet{background:transparent}.dw-ta-note{max-width:570px;margin:18px 0 0;font-size:13px;line-height:1.55;color:#6d675e}
  .dw-ta-benefits{padding:clamp(72px,9vw,128px) clamp(24px,7vw,110px)}.dw-ta-heading{max-width:700px;margin-bottom:52px}.dw-ta-heading h2,.dw-ta-apply__intro h2{font-size:clamp(38px,4.3vw,62px);line-height:1.04;margin:0}.dw-ta-benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(22px,3vw,46px)}.dw-ta-benefit-grid article{border-top:1px solid var(--ta-line);padding-top:20px}.dw-ta-benefit-grid article>span{color:var(--ta-bronze);font-size:11px;letter-spacing:.15em}.dw-ta-benefit-grid h3{font-size:24px;line-height:1.15;margin:17px 0 12px}.dw-ta-benefit-grid p{margin:0;color:#625d55;line-height:1.65}
  .dw-ta-apply{display:grid;grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr);gap:clamp(42px,8vw,130px);padding:clamp(70px,9vw,130px) clamp(24px,7vw,110px);background:var(--ta-paper)}.dw-ta-apply__intro>p:not(.dw-ta-eyebrow){max-width:480px;color:#5c574f;line-height:1.7}.dw-ta-existing{margin-top:40px;padding-top:25px;border-top:1px solid var(--ta-line)}.dw-ta-existing strong,.dw-ta-existing span,.dw-ta-existing a{display:block}.dw-ta-existing span{margin:8px 0 12px;color:#5c574f;line-height:1.55}.dw-ta-existing a{color:var(--ta-ink);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-underline-offset:4px}
  .dw-ta-form{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px}.dw-ta-field--wide{grid-column:1/-1}.dw-ta-field label{display:block;margin-bottom:8px;font-size:12px;font-weight:700;letter-spacing:.06em}.dw-ta-field input,.dw-ta-field select,.dw-ta-field textarea{width:100%;min-height:50px;border:1px solid #aaa194;border-radius:0;background:#fff;color:var(--ta-ink);padding:12px 13px;font:16px/1.4 inherit}.dw-ta .selected-text{color:#5f5f5f}.dw-ta-field textarea{resize:vertical}.dw-ta-field input:focus,.dw-ta-field select:focus,.dw-ta-field textarea:focus{outline:3px solid rgba(121,88,51,.25);border-color:var(--ta-bronze)}.dw-ta-consent label{display:flex;gap:10px;font-weight:400;letter-spacing:0;line-height:1.5}.dw-ta-consent input{width:18px;min-height:18px;margin-top:2px;flex:0 0 auto}.dw-ta-consent a{color:inherit}.dw-ta-sms-consent{padding-top:20px;border-top:1px solid var(--ta-line)}.dw-ta-consent-note{margin:8px 0 0 28px;color:#6d675e;font-size:12px;line-height:1.5}.dw-ta-sms-terms{margin:14px 0 0 28px;color:#5c574f;font-size:12px;line-height:1.55}.dw-ta-sms-terms summary{cursor:pointer;font-weight:700;text-decoration:underline;text-underline-offset:3px}.dw-ta-sms-terms p{margin:10px 0 0}.dw-ta-submit{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.dw-ta-status{margin:0;font-size:14px}.dw-ta-status[data-state="error"]{color:#982b23}.dw-ta-status[data-state="success"]{color:#32613d}.dw-ta-approved{padding:clamp(36px,6vw,72px);background:#fff;border:1px solid var(--ta-line)}.dw-ta-approved h3{font-size:38px;margin:0 0 14px}.dw-ta-approved p:not(.dw-ta-eyebrow){line-height:1.65;margin-bottom:25px}
  .dw-ta a:focus-visible,.dw-ta button:focus-visible{outline:3px solid #bd8950;outline-offset:3px}
  .dw-returning{--ta-ink:#181713;--ta-paper:#f3efe7;width:min(920px,calc(100vw - 32px));max-width:none;padding:0;border:0;background:var(--ta-paper);color:var(--ta-ink);box-shadow:0 30px 90px rgba(0,0,0,.32)}.dw-returning::backdrop{background:rgba(14,13,11,.68);backdrop-filter:blur(4px)}.dw-returning[open]{display:grid;grid-template-columns:1fr 1fr}.dw-returning__room{min-height:620px;background-image:linear-gradient(0deg,rgba(20,18,14,.08),rgba(20,18,14,.02)),var(--dw-ta-room);background-position:center;background-size:cover}.dw-returning__body{display:flex;flex-direction:column;justify-content:center;padding:clamp(38px,6vw,72px)}.dw-returning h2{margin:0 0 18px;font:400 clamp(44px,5vw,68px)/1 var(--element-text-font-family--heading,Georgia,serif);letter-spacing:-.03em}.dw-returning__body>p:not(.dw-ta-eyebrow){color:#575149;line-height:1.65}.dw-returning ul{margin:18px 0 28px;padding:0;list-style:none}.dw-returning li{padding:11px 0;border-top:1px solid #d3cabd;font-size:14px}.dw-returning li::before{content:'✓';margin-right:10px;color:#795833;font-weight:700}.dw-returning__close{position:absolute;top:14px;right:16px;width:44px;height:44px;border:0;background:rgba(255,255,255,.9);color:#181713;font-size:28px;line-height:1;cursor:pointer}.dw-returning__new{margin-top:16px;border:0;background:none;text-decoration:underline;text-underline-offset:4px;cursor:pointer;color:#4d4841}.dw-returning a:focus-visible,.dw-returning button:focus-visible{outline:3px solid #bd8950;outline-offset:3px}
  @media(max-width:900px){.dw-ta-hero{grid-template-columns:1fr}.dw-ta-hero__media{min-height:52vh}.dw-ta-benefit-grid{grid-template-columns:1fr 1fr}.dw-ta-apply{grid-template-columns:1fr}}
  @media(max-width:700px){.dw-returning[open]{display:block}.dw-returning__room{min-height:250px}.dw-returning__body{padding:34px 24px 38px}.dw-returning .dw-ta-button{width:100%}}
  @media(max-width:560px){.dw-ta-hero__media{min-height:420px}.dw-ta-hero__copy{padding:48px 22px 62px}.dw-ta-actions{display:grid}.dw-ta-button{width:100%}.dw-ta-benefit-grid,.dw-ta-form{grid-template-columns:1fr}.dw-ta-field--wide{grid-column:auto}.dw-ta-submit{display:block}.dw-ta-status{margin-top:14px}.dw-ta-apply{padding-left:22px;padding-right:22px}}
  @media(prefers-reduced-motion:reduce){.dw-ta *{scroll-behavior:auto!important;transition:none!important}}
</style>

<script>
  document.querySelectorAll('a.logo-link').forEach(function(link){
    if(!link.getAttribute('aria-label')) link.setAttribute('aria-label','Designer Wallcoverings home');
  });
  (function(){
    var dialog=document.getElementById('dwReturningDialog');
    if(!dialog)return;
    document.querySelectorAll('[data-dw-returning]').forEach(function(link){link.addEventListener('click',function(event){event.preventDefault();dialog.showModal();});});
    dialog.querySelectorAll('[data-dw-returning-close]').forEach(function(button){button.addEventListener('click',function(){dialog.close();});});
    dialog.addEventListener('click',function(event){if(event.target===dialog)dialog.close();});
  })();
</script>

{%- unless dw_trade_is_approved -%}
<script>
  (function(){
    var form=document.getElementById('dwTradeForm');
    var status=document.getElementById('dwTradeStatus');
    if(!form||!status)return;
    form.addEventListener('submit',async function(event){
      event.preventDefault();
      status.removeAttribute('data-state');
      if(!form.checkValidity()){form.reportValidity();status.textContent='Please complete the required fields.';status.dataset.state='error';return;}
      var button=form.querySelector('button[type="submit"]');
      var data=Object.fromEntries(new FormData(form).entries());
      var smsConsent=form.querySelector('#dwTaSmsConsent');
      data.sms_marketing_consent=Boolean(smsConsent&&smsConsent.checked);
      data.sms_consent_disclosure_version='dw-sms-v2-2026-08-28';
      data.sms_consent_captured_at=new Date().toISOString();
      data.sms_consent_source=window.location.href;
      button.disabled=true;button.textContent='Submitting…';status.textContent='Securely sending your application…';
      try{
        var response=await fetch('https://signup.designerwallcoverings.com/trade/apply',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(data)});
        var result=await response.json().catch(function(){return {};});
        if(!response.ok)throw new Error(result.error||'Application could not be submitted.');
        form.reset();status.textContent='Application received. Our trade team will review it and follow up by email.';status.dataset.state='success';button.textContent='Application received';
      }catch(error){status.textContent=error.message||'Please try again or call (888) 373-4564.';status.dataset.state='error';button.disabled=false;button.textContent='Submit application';}
    });
  })();
</script>
{%- endunless -%}
<!-- /DW-TRADE-APPLY -->