[object Object]

← back to Dw Marketing Reels

Storefront: DW Collection Films custom-liquid section (flip books for DW Shopify homepage)

1cda4a2e13b1eaf71451e40172f6267e64bdf0b8 · 2026-08-10 12:59:04 -0700 · Steve Abrams

Files touched

Diff

commit 1cda4a2e13b1eaf71451e40172f6267e64bdf0b8
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Mon Aug 10 12:59:04 2026 -0700

    Storefront: DW Collection Films custom-liquid section (flip books for DW Shopify homepage)
---
 majilite-jewelry/majilite-attache-rose-gold/2.png  | Bin 2804687 -> 0 bytes
 majilite-jewelry/majilite-attache-rose-gold/3.png  | Bin 2857148 -> 0 bytes
 .../majilite-burnished-metal-mercury/2.png         | Bin 2967090 -> 0 bytes
 .../majilite-burnished-metal-mercury/3.png         | Bin 2965768 -> 0 bytes
 majilite-jewelry/majilite-charm-antique-gold/2.png | Bin 2869072 -> 0 bytes
 majilite-jewelry/majilite-charm-antique-gold/3.png | Bin 2829739 -> 0 bytes
 .../majilite-charm-metallic-taupe/2.png            | Bin 2641474 -> 0 bytes
 .../majilite-charm-metallic-taupe/3.png            | Bin 3065143 -> 0 bytes
 .../majilite-eclipse-fx-metallic-taupe/2.png       | Bin 2985046 -> 0 bytes
 .../majilite-eclipse-fx-metallic-taupe/3.png       | Bin 3319606 -> 0 bytes
 .../majilite-finesse-pearl-pewter/2.png            | Bin 2783018 -> 0 bytes
 .../majilite-finesse-pearl-pewter/3.png            | Bin 2734155 -> 0 bytes
 .../majilite-finesse-pearl-platinum/2.png          | Bin 2587826 -> 0 bytes
 .../majilite-finesse-pearl-platinum/3.png          | Bin 2864515 -> 0 bytes
 .../majilite-hammered-metal-midnight/2.png         | Bin 2815398 -> 0 bytes
 .../majilite-hammered-metal-midnight/3.png         | Bin 2898837 -> 0 bytes
 majilite-jewelry/majilite-infinity-grey/2.png      | Bin 2599889 -> 0 bytes
 majilite-jewelry/majilite-infinity-grey/3.png      | Bin 2543634 -> 0 bytes
 .../majilite-metallic-paragon-slate/2.png          | Bin 2601846 -> 0 bytes
 .../majilite-metallic-paragon-slate/3.png          | Bin 2836448 -> 0 bytes
 majilite-jewelry/majilite-nuance-pewter/2.png      | Bin 2646916 -> 0 bytes
 majilite-jewelry/majilite-nuance-pewter/3.png      | Bin 2450835 -> 0 bytes
 majilite-jewelry/majilite-shimmer-pewter/2.png     | Bin 2601109 -> 0 bytes
 majilite-jewelry/majilite-shimmer-pewter/3.png     | Bin 2460417 -> 0 bytes
 majilite-jewelry/majilite-shimmer-slate/2.png      | Bin 2586684 -> 0 bytes
 majilite-jewelry/majilite-shimmer-slate/3.png      | Bin 2647973 -> 0 bytes
 majilite-jewelry/majilite-stature-gold/2.png       | Bin 3078855 -> 0 bytes
 majilite-jewelry/majilite-stature-gold/3.png       | Bin 2840212 -> 0 bytes
 majilite-jewelry/majilite-stature-rose-gold/2.png  | Bin 2584888 -> 0 bytes
 majilite-jewelry/majilite-stature-rose-gold/3.png  | Bin 2507129 -> 0 bytes
 storefront/dw-collection-films.liquid              |  69 +++++++++++++++++++++
 31 files changed, 69 insertions(+)

diff --git a/majilite-jewelry/majilite-attache-rose-gold/2.png b/majilite-jewelry/majilite-attache-rose-gold/2.png
deleted file mode 100644
index 4a4655e..0000000
Binary files a/majilite-jewelry/majilite-attache-rose-gold/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-attache-rose-gold/3.png b/majilite-jewelry/majilite-attache-rose-gold/3.png
deleted file mode 100644
index beeb2dd..0000000
Binary files a/majilite-jewelry/majilite-attache-rose-gold/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-burnished-metal-mercury/2.png b/majilite-jewelry/majilite-burnished-metal-mercury/2.png
deleted file mode 100644
index aaed63a..0000000
Binary files a/majilite-jewelry/majilite-burnished-metal-mercury/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-burnished-metal-mercury/3.png b/majilite-jewelry/majilite-burnished-metal-mercury/3.png
deleted file mode 100644
index ffa8240..0000000
Binary files a/majilite-jewelry/majilite-burnished-metal-mercury/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-charm-antique-gold/2.png b/majilite-jewelry/majilite-charm-antique-gold/2.png
deleted file mode 100644
index d3960f4..0000000
Binary files a/majilite-jewelry/majilite-charm-antique-gold/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-charm-antique-gold/3.png b/majilite-jewelry/majilite-charm-antique-gold/3.png
deleted file mode 100644
index 859c939..0000000
Binary files a/majilite-jewelry/majilite-charm-antique-gold/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-charm-metallic-taupe/2.png b/majilite-jewelry/majilite-charm-metallic-taupe/2.png
deleted file mode 100644
index 74c718b..0000000
Binary files a/majilite-jewelry/majilite-charm-metallic-taupe/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-charm-metallic-taupe/3.png b/majilite-jewelry/majilite-charm-metallic-taupe/3.png
deleted file mode 100644
index 82e293a..0000000
Binary files a/majilite-jewelry/majilite-charm-metallic-taupe/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-eclipse-fx-metallic-taupe/2.png b/majilite-jewelry/majilite-eclipse-fx-metallic-taupe/2.png
deleted file mode 100644
index 89193ef..0000000
Binary files a/majilite-jewelry/majilite-eclipse-fx-metallic-taupe/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-eclipse-fx-metallic-taupe/3.png b/majilite-jewelry/majilite-eclipse-fx-metallic-taupe/3.png
deleted file mode 100644
index ac5f942..0000000
Binary files a/majilite-jewelry/majilite-eclipse-fx-metallic-taupe/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-finesse-pearl-pewter/2.png b/majilite-jewelry/majilite-finesse-pearl-pewter/2.png
deleted file mode 100644
index b815cc6..0000000
Binary files a/majilite-jewelry/majilite-finesse-pearl-pewter/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-finesse-pearl-pewter/3.png b/majilite-jewelry/majilite-finesse-pearl-pewter/3.png
deleted file mode 100644
index ecf25ec..0000000
Binary files a/majilite-jewelry/majilite-finesse-pearl-pewter/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-finesse-pearl-platinum/2.png b/majilite-jewelry/majilite-finesse-pearl-platinum/2.png
deleted file mode 100644
index e190c0e..0000000
Binary files a/majilite-jewelry/majilite-finesse-pearl-platinum/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-finesse-pearl-platinum/3.png b/majilite-jewelry/majilite-finesse-pearl-platinum/3.png
deleted file mode 100644
index 7cc5f33..0000000
Binary files a/majilite-jewelry/majilite-finesse-pearl-platinum/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-hammered-metal-midnight/2.png b/majilite-jewelry/majilite-hammered-metal-midnight/2.png
deleted file mode 100644
index 270332f..0000000
Binary files a/majilite-jewelry/majilite-hammered-metal-midnight/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-hammered-metal-midnight/3.png b/majilite-jewelry/majilite-hammered-metal-midnight/3.png
deleted file mode 100644
index 02a04a2..0000000
Binary files a/majilite-jewelry/majilite-hammered-metal-midnight/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-infinity-grey/2.png b/majilite-jewelry/majilite-infinity-grey/2.png
deleted file mode 100644
index 5dab0a7..0000000
Binary files a/majilite-jewelry/majilite-infinity-grey/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-infinity-grey/3.png b/majilite-jewelry/majilite-infinity-grey/3.png
deleted file mode 100644
index 632ad86..0000000
Binary files a/majilite-jewelry/majilite-infinity-grey/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-metallic-paragon-slate/2.png b/majilite-jewelry/majilite-metallic-paragon-slate/2.png
deleted file mode 100644
index 5229521..0000000
Binary files a/majilite-jewelry/majilite-metallic-paragon-slate/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-metallic-paragon-slate/3.png b/majilite-jewelry/majilite-metallic-paragon-slate/3.png
deleted file mode 100644
index 971ff35..0000000
Binary files a/majilite-jewelry/majilite-metallic-paragon-slate/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-nuance-pewter/2.png b/majilite-jewelry/majilite-nuance-pewter/2.png
deleted file mode 100644
index 028a896..0000000
Binary files a/majilite-jewelry/majilite-nuance-pewter/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-nuance-pewter/3.png b/majilite-jewelry/majilite-nuance-pewter/3.png
deleted file mode 100644
index c6ee457..0000000
Binary files a/majilite-jewelry/majilite-nuance-pewter/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-shimmer-pewter/2.png b/majilite-jewelry/majilite-shimmer-pewter/2.png
deleted file mode 100644
index 0c937e0..0000000
Binary files a/majilite-jewelry/majilite-shimmer-pewter/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-shimmer-pewter/3.png b/majilite-jewelry/majilite-shimmer-pewter/3.png
deleted file mode 100644
index a419d8e..0000000
Binary files a/majilite-jewelry/majilite-shimmer-pewter/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-shimmer-slate/2.png b/majilite-jewelry/majilite-shimmer-slate/2.png
deleted file mode 100644
index 09dd1fd..0000000
Binary files a/majilite-jewelry/majilite-shimmer-slate/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-shimmer-slate/3.png b/majilite-jewelry/majilite-shimmer-slate/3.png
deleted file mode 100644
index c0971e8..0000000
Binary files a/majilite-jewelry/majilite-shimmer-slate/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-stature-gold/2.png b/majilite-jewelry/majilite-stature-gold/2.png
deleted file mode 100644
index d868055..0000000
Binary files a/majilite-jewelry/majilite-stature-gold/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-stature-gold/3.png b/majilite-jewelry/majilite-stature-gold/3.png
deleted file mode 100644
index c8851dc..0000000
Binary files a/majilite-jewelry/majilite-stature-gold/3.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-stature-rose-gold/2.png b/majilite-jewelry/majilite-stature-rose-gold/2.png
deleted file mode 100644
index 5ecd0c1..0000000
Binary files a/majilite-jewelry/majilite-stature-rose-gold/2.png and /dev/null differ
diff --git a/majilite-jewelry/majilite-stature-rose-gold/3.png b/majilite-jewelry/majilite-stature-rose-gold/3.png
deleted file mode 100644
index eedeecb..0000000
Binary files a/majilite-jewelry/majilite-stature-rose-gold/3.png and /dev/null differ
diff --git a/storefront/dw-collection-films.liquid b/storefront/dw-collection-films.liquid
new file mode 100644
index 0000000..3c8b31d
--- /dev/null
+++ b/storefront/dw-collection-films.liquid
@@ -0,0 +1,69 @@
+{%- comment -%}
+  DW Collection Films — homepage video band featuring the flip-book lookbooks.
+  Paste into: Online Store → Themes → Customize → Add section → Custom Liquid.
+  Self-contained (scoped styles). Videos + posters are served from marketing.designerwallcoverings.com.
+  Shop links are same-domain (relative), so they resolve on the live store.
+{%- endcomment -%}
+
+<style>
+  .dwcf { max-width: 1280px; margin: 0 auto; padding: 56px 20px; font-family: inherit; }
+  .dwcf__head { text-align: center; margin-bottom: 34px; }
+  .dwcf__eyebrow { font-size: 12px; letter-spacing: .28em; text-transform: uppercase; color: #9a8f80; margin: 0 0 10px; }
+  .dwcf__title { font-size: clamp(26px, 4vw, 40px); font-weight: 400; letter-spacing: .01em; margin: 0; color: #1a1a1a; }
+  .dwcf__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; margin-top: 34px; }
+  @media (max-width: 760px){ .dwcf__grid { grid-template-columns: 1fr; } }
+  .dwcf__card { position: relative; border-radius: 6px; overflow: hidden; background: #efe9df; box-shadow: 0 1px 0 rgba(0,0,0,.06); }
+  .dwcf__vidwrap { position: relative; aspect-ratio: 16/9; background:#000; }
+  .dwcf__vidwrap video { position:absolute; inset:0; width:100%; height:100%; object-fit: cover; display:block; }
+  .dwcf__play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; cursor:pointer; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.35)); transition: opacity .25s; }
+  .dwcf__play svg { width:64px; height:64px; filter: drop-shadow(0 2px 8px rgba(0,0,0,.4)); }
+  .dwcf__meta { padding: 18px 20px 22px; }
+  .dwcf__name { font-size: 20px; margin: 0 0 4px; color:#1a1a1a; }
+  .dwcf__sub { font-size: 13px; color:#8a8072; margin: 0 0 14px; letter-spacing:.02em; }
+  .dwcf__cta { display:inline-block; font-size: 12px; letter-spacing:.16em; text-transform:uppercase; color:#1a1a1a; text-decoration:none; border-bottom:1px solid #1a1a1a; padding-bottom:2px; }
+  .dwcf__cta:hover { color:#7a6f5f; border-color:#7a6f5f; }
+</style>
+
+<section class="dwcf">
+  <div class="dwcf__head">
+    <p class="dwcf__eyebrow">Collection Films</p>
+    <h2 class="dwcf__title">Leaf Through Our Lookbooks</h2>
+  </div>
+  <div class="dwcf__grid">
+
+    <div class="dwcf__card">
+      <div class="dwcf__vidwrap">
+        <video preload="none" playsinline controls
+               poster="https://marketing.designerwallcoverings.com/public/collections/maya-romanoff-poster.jpg">
+          <source src="https://marketing.designerwallcoverings.com/reels/maya-romanoff-flipbook.mp4" type="video/mp4">
+        </video>
+        <div class="dwcf__play" onclick="var v=this.previousElementSibling; v.play(); this.style.display='none';" aria-label="Play">
+          <svg viewBox="0 0 64 64" fill="none"><circle cx="32" cy="32" r="31" fill="rgba(255,255,255,.92)"/><path d="M26 20l20 12-20 12z" fill="#1a1a1a"/></svg>
+        </div>
+      </div>
+      <div class="dwcf__meta">
+        <h3 class="dwcf__name">Maya Romanoff</h3>
+        <p class="dwcf__sub">A Study in Materials — beadwork, marquetry, metallic luster & natural fiber</p>
+        <a class="dwcf__cta" href="/collections/all?filter.p.vendor=Maya+Romanoff">Shop the Collection</a>
+      </div>
+    </div>
+
+    <div class="dwcf__card">
+      <div class="dwcf__vidwrap">
+        <video preload="none" playsinline controls
+               poster="https://marketing.designerwallcoverings.com/public/collections/majilite-metallics-poster.jpg">
+          <source src="https://marketing.designerwallcoverings.com/reels/majilite-metallics-flipbook.mp4" type="video/mp4">
+        </video>
+        <div class="dwcf__play" onclick="var v=this.previousElementSibling; v.play(); this.style.display='none';" aria-label="Play">
+          <svg viewBox="0 0 64 64" fill="none"><circle cx="32" cy="32" r="31" fill="rgba(255,255,255,.92)"/><path d="M26 20l20 12-20 12z" fill="#1a1a1a"/></svg>
+        </div>
+      </div>
+      <div class="dwcf__meta">
+        <h3 class="dwcf__name">Majilite Metallics</h3>
+        <p class="dwcf__sub">A Colorway Story in Four Metals — faux-leather metallics on walls & furniture</p>
+        <a class="dwcf__cta" href="/collections/all?filter.p.vendor=Majilite">Shop the Collection</a>
+      </div>
+    </div>
+
+  </div>
+</section>

← 1871275 reels: Majilite jewelry-case image pipeline + spotlight reel  ·  back to Dw Marketing Reels  ·  Glitter Walls flip book (color story, 24 SKUs, walls&furnitu 9c2e670 →