[object Object]

← back to Dw Contact Us Pages

contact-us product template (no price/form blocks) + dw-contact-us-block snippet

015845340bbe02868086956d281666686fa83395 · 2026-09-19 10:10:53 -0700 · Claude (TK-11925)

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0163KBzeE1R39RSbxNmAjbki

Files touched

Diff

commit 015845340bbe02868086956d281666686fa83395
Author: Claude (TK-11925) <steve@designerwallcoverings.com>
Date:   Sat Sep 19 10:10:53 2026 -0700

    contact-us product template (no price/form blocks) + dw-contact-us-block snippet
    
    Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
    Claude-Session: https://claude.ai/code/session_0163KBzeE1R39RSbxNmAjbki
---
 .gitignore                                |   8 +
 theme/snippets/dw-contact-us-block.liquid | 258 ++++++++++++++++++++++++++++++
 theme/templates/product.contact-us.json   |  83 ++++++++++
 3 files changed, 349 insertions(+)

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..1924158
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,8 @@
+node_modules/
+.env*
+tmp/
+*.log
+.DS_Store
+dist/
+build/
+.next/
diff --git a/theme/snippets/dw-contact-us-block.liquid b/theme/snippets/dw-contact-us-block.liquid
new file mode 100644
index 0000000..c6d531d
--- /dev/null
+++ b/theme/snippets/dw-contact-us-block.liquid
@@ -0,0 +1,258 @@
+{%- comment -%}
+  dw-contact-us-block.liquid — TK-11925
+  ---------------------------------------------------------------------------
+  "Contact us page" treatment for to-the-trade / showroom-only vendor lines
+  (Designers Guild, Ralph Lauren, Christian Lacroix Europe).
+
+  Renders ONLY when the product's template suffix is `contact-us`
+  (templates/product.contact-us.json). That template already omits the `price`
+  and `form` blocks, so there is no price, no add-to-cart and no sample UI to
+  begin with; the CSS at the bottom of this file is BELT-AND-BRACES so nothing
+  price/cart/sample-shaped can leak back if a block is ever re-added in the
+  theme editor.
+
+  Placement: rendered by snippets/product.liquid immediately after
+  `product-gallery`, i.e. directly BELOW the product image column.
+
+  Backend: posts the SAME JSON body shape to the SAME live endpoint as
+  sections/contact-for-price.liquid → https://api.designerwallcoverings.com/api/sku-inquiry
+  Fields: productId productTitle sku name email phone company role quantity
+          unit projectName city timeline budget notes
+
+  Render with:  {% render 'dw-contact-us-block', product: product %}
+{%- endcomment -%}
+
+{%- if template.suffix == 'contact-us' -%}
+{%- liquid
+  assign dw_cu_sku = ''
+  for v in product.variants
+    assign v_sku = v.sku | default: ''
+    if v_sku != blank and dw_cu_sku == blank
+      assign dw_cu_sku = v_sku
+    endif
+  endfor
+  assign dw_cu_sku = dw_cu_sku | replace: '-Sample', '' | replace: '-SAMPLE', '' | replace: '-sample', ''
+  assign dw_cu_sku = dw_cu_sku | replace: '--', '-' | replace: '--', '-'
+  assign dw_cu_last = dw_cu_sku | slice: -1, 1
+  if dw_cu_sku != blank and dw_cu_last == '-'
+    assign dw_cu_sku = dw_cu_sku | remove_last: '-'
+  endif
+  assign dw_cu_label = dw_cu_sku | default: product.title
+  assign dw_cu_subject = 'Inquiry: ' | append: dw_cu_label | append: ' — ' | append: product.title
+  assign dw_cu_uid = product.id
+-%}
+
+<section class="dw-cu" id="dw-cu-{{ dw_cu_uid }}"
+  data-product-id="{{ product.id }}"
+  data-product-title="{{ product.title | escape }}"
+  data-sku="{{ dw_cu_sku | escape }}"
+  aria-labelledby="dw-cu-h-{{ dw_cu_uid }}">
+
+  <h2 class="dw-cu__h" id="dw-cu-h-{{ dw_cu_uid }}">Contact us about this pattern</h2>
+
+  <p class="dw-cu__meta">
+    {%- if product.vendor != blank -%}<span class="dw-cu__vendor">{{ product.vendor }}</span>{%- endif -%}
+    <span class="dw-cu__pattern">{{ product.title }}</span>
+    {%- if dw_cu_sku != blank -%}<span class="dw-cu__sku">SKU {{ dw_cu_sku }}</span>{%- endif -%}
+  </p>
+
+  <p class="dw-cu__lede">This line is available through our showroom. Pricing and availability by request.</p>
+
+  <div class="dw-cu__direct">
+    <a class="dw-cu__btn dw-cu__btn--call" href="tel:+18883734564">Call (888) 373-4564</a>
+    <a class="dw-cu__btn dw-cu__btn--mail"
+       href="mailto:info@designerwallcoverings.com?subject={{ dw_cu_subject | url_encode }}">Email us</a>
+  </div>
+
+  <form class="dw-cu__form" id="dw-cu-form-{{ dw_cu_uid }}" novalidate>
+    <input type="hidden" data-f="productId" value="{{ product.id }}">
+    <input type="hidden" data-f="productTitle" value="{{ product.title | escape }}">
+    <input type="hidden" data-f="sku" value="{{ dw_cu_sku | escape }}">
+
+    <div class="dw-cu__row">
+      <div class="dw-cu__grp">
+        <label for="dw-cu-name-{{ dw_cu_uid }}">Your name *</label>
+        <input type="text" id="dw-cu-name-{{ dw_cu_uid }}" data-f="name" required autocomplete="name">
+      </div>
+      <div class="dw-cu__grp">
+        <label for="dw-cu-email-{{ dw_cu_uid }}">Email *</label>
+        <input type="email" id="dw-cu-email-{{ dw_cu_uid }}" data-f="email" required autocomplete="email" value="{{ customer.email }}">
+      </div>
+    </div>
+
+    <div class="dw-cu__row">
+      <div class="dw-cu__grp">
+        <label for="dw-cu-phone-{{ dw_cu_uid }}">Phone</label>
+        <input type="tel" id="dw-cu-phone-{{ dw_cu_uid }}" data-f="phone" autocomplete="tel">
+      </div>
+      <div class="dw-cu__grp">
+        <label for="dw-cu-company-{{ dw_cu_uid }}">Company / business</label>
+        <input type="text" id="dw-cu-company-{{ dw_cu_uid }}" data-f="company" autocomplete="organization">
+      </div>
+    </div>
+
+    <div class="dw-cu__row">
+      <div class="dw-cu__grp">
+        <label for="dw-cu-role-{{ dw_cu_uid }}">I am a *</label>
+        <select id="dw-cu-role-{{ dw_cu_uid }}" data-f="role" required>
+          <option value="">Select&hellip;</option>
+          <option value="interior_designer">Interior Designer</option>
+          <option value="trade">Trade / Dealer</option>
+          <option value="architect">Architect / Specifier</option>
+          <option value="homeowner">Homeowner</option>
+          <option value="other">Other</option>
+        </select>
+      </div>
+      <div class="dw-cu__grp">
+        <label for="dw-cu-qty-{{ dw_cu_uid }}">Quantity needed</label>
+        <div class="dw-cu__qty">
+          <input type="number" id="dw-cu-qty-{{ dw_cu_uid }}" data-f="quantity" min="1" placeholder="e.g. 6">
+          <select data-f="unit" aria-label="Unit">
+            <option value="rolls">rolls</option>
+            <option value="yards">yards</option>
+            <option value="sq_ft">sq ft</option>
+            <option value="unsure">unsure</option>
+          </select>
+        </div>
+      </div>
+    </div>
+
+    <div class="dw-cu__row">
+      <div class="dw-cu__grp">
+        <label for="dw-cu-project-{{ dw_cu_uid }}">Project name</label>
+        <input type="text" id="dw-cu-project-{{ dw_cu_uid }}" data-f="projectName" placeholder="e.g. Madison Ave Residence">
+      </div>
+      <div class="dw-cu__grp">
+        <label for="dw-cu-city-{{ dw_cu_uid }}">City / location</label>
+        <input type="text" id="dw-cu-city-{{ dw_cu_uid }}" data-f="city" placeholder="e.g. Los Angeles, CA">
+      </div>
+    </div>
+
+    <div class="dw-cu__row">
+      <div class="dw-cu__grp">
+        <label for="dw-cu-timeline-{{ dw_cu_uid }}">Timeline</label>
+        <input type="text" id="dw-cu-timeline-{{ dw_cu_uid }}" data-f="timeline" placeholder="e.g. 2&ndash;3 weeks">
+      </div>
+      <div class="dw-cu__grp">
+        <label for="dw-cu-budget-{{ dw_cu_uid }}">Budget</label>
+        <input type="text" id="dw-cu-budget-{{ dw_cu_uid }}" data-f="budget" placeholder="e.g. $10,000">
+      </div>
+    </div>
+
+    <div class="dw-cu__grp">
+      <label for="dw-cu-notes-{{ dw_cu_uid }}">Additional notes</label>
+      <textarea id="dw-cu-notes-{{ dw_cu_uid }}" data-f="notes" rows="3" placeholder="Anything else we should know about your project&hellip;"></textarea>
+    </div>
+
+    <button type="submit" class="dw-cu__submit">Send inquiry</button>
+    <p class="dw-cu__reassure">We typically reply within 1 business day. No obligation.</p>
+    <p class="dw-cu__status" role="status" aria-live="polite" hidden></p>
+  </form>
+</section>
+
+<style>
+  .dw-cu{clear:both;margin:26px 0 8px;max-width:760px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:#3D4246;box-sizing:border-box}
+  .dw-cu *{box-sizing:border-box}
+  .dw-cu__h{font-family:Lora,serif;font-size:20px;font-weight:500;color:#3D4246;letter-spacing:-0.01em;margin:0 0 8px}
+  .dw-cu__meta{margin:0 0 6px;font-size:12px;line-height:1.6;color:#6b6357;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
+  .dw-cu__vendor{text-transform:uppercase;letter-spacing:.07em;color:#8A8A85}
+  .dw-cu__pattern{font-family:Lora,serif;font-size:14px;color:#3D4246}
+  .dw-cu__sku{font-size:11px;letter-spacing:.06em;color:#8a8276;background:#f6f4f0;border-radius:4px;padding:2px 7px}
+  .dw-cu__lede{margin:0 0 14px;font-size:14px;line-height:1.55;color:#5b5f63}
+  .dw-cu__direct{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}
+  .dw-cu__btn{display:inline-block;padding:.65rem 1.15rem;border-radius:6px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;border:1px solid #2a2622}
+  .dw-cu__btn--call{background:#2a2622;color:#fff}
+  .dw-cu__btn--call:hover{background:#000;color:#fff}
+  .dw-cu__btn--mail{background:#fff;color:#2a2622}
+  .dw-cu__btn--mail:hover{background:#faf8f4;color:#2a2622}
+  .dw-cu__form{border:1px solid #e6e0d6;background:#faf8f4;border-radius:8px;padding:18px}
+  .dw-cu__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
+  .dw-cu__grp{margin-bottom:14px}
+  .dw-cu__grp label{display:block;margin-bottom:.35rem;font-weight:500;color:#3a352f;font-size:13px}
+  .dw-cu__grp input,.dw-cu__grp select,.dw-cu__grp textarea{width:100%;padding:.6rem;border:1px solid #d6d0c6;border-radius:6px;font-family:inherit;font-size:14px;background:#fff;color:#3D4246}
+  .dw-cu__grp input:focus,.dw-cu__grp select:focus,.dw-cu__grp textarea:focus{outline:none;border-color:#b9892f;box-shadow:0 0 0 3px rgba(185,137,47,.12)}
+  .dw-cu__qty{display:flex;gap:.5rem}
+  .dw-cu__qty input{flex:1}
+  .dw-cu__qty select{width:auto}
+  .dw-cu__submit{width:100%;padding:.8rem;background:#b9892f;color:#fff;border:none;border-radius:6px;font-weight:600;font-size:14px;cursor:pointer;transition:background .2s}
+  .dw-cu__submit:hover{background:#a3781f}
+  .dw-cu__submit[disabled]{opacity:.6;cursor:default}
+  .dw-cu__reassure{text-align:center;font-size:12px;color:#8a8276;margin:.6rem 0 0}
+  .dw-cu__status{margin:.7rem 0 0;font-size:13px;text-align:center;border-radius:6px;padding:.6rem}
+  .dw-cu__status--ok{background:#eef6ee;color:#2f6b2f;border:1px solid #cfe4cf}
+  .dw-cu__status--err{background:#fdf1f1;color:#8b2f2f;border:1px solid #f0d4d4}
+  @media(max-width:640px){.dw-cu{margin:20px 0 4px}.dw-cu__row{grid-template-columns:1fr}.dw-cu__direct .dw-cu__btn{flex:1 1 100%;text-align:center}}
+
+  /* ------------------------------------------------------------------ *
+   * BELT AND BRACES (TK-11925). The contact-us template omits the price *
+   * and form blocks entirely, so none of the below should ever exist on *
+   * these PDPs. This hides anything price / cart / sample shaped if a   *
+   * block is re-added in the theme editor or an app injects one.        *
+   * Class inventory measured from snippets/product-form-content.liquid. *
+   * ------------------------------------------------------------------ */
+  body.template-suffix-contact-us .product__price,
+  body.template-suffix-contact-us .product__form,
+  body.template-suffix-contact-us .product-price,
+  body.template-suffix-contact-us .product-price__unit-price,
+  body.template-suffix-contact-us [data-product-form] .product__form,
+  body.template-suffix-contact-us [data-product-form] .product__price,
+  body.template-suffix-contact-us .cfp-section,
+  body.template-suffix-contact-us .dw-quote-section,
+  body.template-suffix-contact-us .dw-sample-banner,
+  body.template-suffix-contact-us .add-to-cart,
+  body.template-suffix-contact-us .dl-sample-btn,
+  body.template-suffix-contact-us .dl-second-sample-btn,
+  body.template-suffix-contact-us .product-options,
+  body.template-suffix-contact-us .mm_quantity,
+  body.template-suffix-contact-us .shopify-payment-button,
+  body.template-suffix-contact-us .product-form__buy-buttons,
+  body.template-suffix-contact-us .quick-shop-modal-trigger,
+  body.template-suffix-contact-us .product-details .money{display:none!important}
+</style>
+
+<script>
+(function(){
+  var root=document.getElementById('dw-cu-{{ dw_cu_uid }}');
+  if(!root||root.dataset.dwCuWired==='1')return;
+  root.dataset.dwCuWired='1';
+  var form=root.querySelector('.dw-cu__form');
+  var status=root.querySelector('.dw-cu__status');
+  var submit=root.querySelector('.dw-cu__submit');
+  function say(msg,ok){
+    status.hidden=false;
+    status.textContent=msg;
+    status.className='dw-cu__status '+(ok?'dw-cu__status--ok':'dw-cu__status--err');
+  }
+  function val(name){var el=root.querySelector('[data-f="'+name+'"]');return el?String(el.value||'').trim():'';}
+  form.addEventListener('submit',function(e){
+    e.preventDefault();
+    if(!val('name')||!val('email')||!val('role')){say('Please fill in your name, email and role.',false);return;}
+    var payload={
+      productId:val('productId'), productTitle:val('productTitle'), sku:val('sku'),
+      name:val('name'), email:val('email'), phone:val('phone'), company:val('company'),
+      role:val('role'), quantity:val('quantity'), unit:val('unit'),
+      projectName:val('projectName'), city:val('city'), timeline:val('timeline'),
+      budget:val('budget'), notes:val('notes')
+    };
+    submit.disabled=true;
+    var old=submit.textContent; submit.textContent='Sending…';
+    fetch('https://api.designerwallcoverings.com/api/sku-inquiry',{
+      method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(payload)
+    }).then(function(r){return r.json().catch(function(){return {success:r.ok};});})
+      .then(function(j){
+        if(j&&j.success){
+          say('Thank you — your inquiry was received. We reply within 1 business day.'+(j.requestId?' Reference: '+j.requestId:''),true);
+          form.querySelectorAll('input:not([type=hidden]),select,textarea').forEach(function(n){if(n.type!=='hidden')n.value='';});
+        } else {
+          say((j&&j.message)||'Something went wrong. Please call (888) 373-4564 or email info@designerwallcoverings.com.',false);
+        }
+      })
+      .catch(function(err){
+        console.error('dw-cu submit',err);
+        say('Could not send your inquiry. Please email info@designerwallcoverings.com or call (888) 373-4564.',false);
+      })
+      .then(function(){submit.disabled=false;submit.textContent=old;});
+  });
+})();
+</script>
+{%- endif -%}
diff --git a/theme/templates/product.contact-us.json b/theme/templates/product.contact-us.json
new file mode 100644
index 0000000..5d4475d
--- /dev/null
+++ b/theme/templates/product.contact-us.json
@@ -0,0 +1,83 @@
+{
+  "wrapper": "div.product-section",
+  "sections": {
+    "main": {
+      "type": "product",
+      "blocks": {
+        "vendor": {
+          "type": "vendor",
+          "settings": {}
+        },
+        "title": {
+          "type": "title",
+          "settings": {}
+        },
+        "social_VbD9b7": {
+          "type": "social",
+          "disabled": true,
+          "settings": {}
+        },
+        "50a0828c-24fe-483d-bdd6-ffe922b8a26c": {
+          "type": "tabs",
+          "disabled": true,
+          "settings": {
+            "show_product_description": true,
+            "tab_heading_1": "How to use",
+            "tab_text_1": "<p>Tab 1 content goes here.</p>",
+            "tab_heading_2": "Ingredients",
+            "tab_text_2": "<p>Tab 2 content goes here.</p>",
+            "tab_heading_3": "",
+            "tab_text_3": ""
+          }
+        },
+        "description": {
+          "type": "description",
+          "settings": {}
+        }
+      },
+      "block_order": [
+        "vendor",
+        "title",
+        "social_VbD9b7",
+        "50a0828c-24fe-483d-bdd6-ffe922b8a26c",
+        "description"
+      ],
+      "settings": {
+        "enable_cart_redirection": false,
+        "show_payment_button": false,
+        "images_layout": "slideshow",
+        "enable_zoom": true,
+        "enable_video_autoplay": true,
+        "enable_video_looping": true
+      }
+    },
+    "recommendations": {
+      "type": "static-product-recommendations",
+      "settings": {
+        "show_product_recommendations": true,
+        "product_recommendations_heading": "You may also like",
+        "related_products_position_right": false
+      }
+    },
+    "1634913777acb08a07": {
+      "type": "pxs-image-with-text-overlay",
+      "disabled": true,
+      "settings": {
+        "section_height": "medium",
+        "title": "Give the gift of great skin",
+        "text": "<p>Browse our best-selling face and body sets</p>",
+        "content_position": "center-center",
+        "color": "#ffffff",
+        "overlay_background": "#000000",
+        "overlay_opacity": 15,
+        "link": "",
+        "button_text": "Shop Now"
+      }
+    }
+  },
+  "order": [
+    "main",
+    "recommendations",
+    "1634913777acb08a07"
+  ]
+}

(oldest)  ·  back to Dw Contact Us Pages  ·  product.liquid: render contact block directly below the imag 6660ec4 →