The widget library for Squarespace is here Learn more

Cinematic Editorial Portfolio and Video Lightbox List

The Cinematic Portfolio Video List is a high-end, editorial-style gallery widget designed for elite creative agencies, independent designers, and luxury brands. This widget moves away from standard grids, offering a structured interactive list layout that prioritizes white space, minimalist typography, and cinematic motion.

At the heart of the design is an overlapping project title and image system. The massive, fluid typography creates a bold visual anchor, while the central video-preview thumbnail features a hover-active play button. When triggered, it opens a high-performance video lightbox, providing a distraction-free environment for your brand storytelling, commercial showreels, or product walkthroughs.

Key Features & SEO Keywords

  • Editorial Typography Layout: Uses large-scale headers with a classic "lookbook" aesthetic, perfect for high-contrast web design portfolios.
  • Integrated Project Metadata: Includes dedicated editable fields for project categories, production years, and service subcategories, providing deep context for every case study.
  • Hover-Triggered Video UI: A sophisticated overlay play button that scales and fades on hover, improving micro-interactions and user signal for video content.
  • Modern Lightbox Modal: A robust, mobile-responsive video popup that supports MP4, YouTube, and Vimeo, built to bypass common iframe clipping issues.
  • Infinite "Slides" Architecture: Utilizing the Redesignee Slides syntax, users can effortlessly add, delete, and reorder projects via the customizer sidebar.
  • On-Page SEO Optimized: Semantic HTML tags (H2 for titles, spans for meta) ensure your project keywords and brand names are indexed efficiently by search engines.

Primary Usage Cases

  • Luxury Fashion Lookbooks: Showcase seasonal collections (like the Zimmermann example) with a blend of high-fashion photography and cinematic film trailers.
  • Airlines & Travel Promos: Ideal for high-end tourism landing pages or airline promo sites (like the S7 Airlines example) that need to communicate luxury and scale.
  • High-End Web Design Agencies: Present your digital work with a layout that mirrors the quality of the websites you build for clients.
  • Architectural Walkthroughs: Use the meta text for location and project type, while the video modal hosts 3D architectural tours.
  • Product Launch Pages: Perfect for tech startups or D2C brands launching a series of products that require both a strong visual identity and video explanation.

How to use this widget

  • Change your content and adjust the styles to match your design
  • Click export and copy the code
  • Paste it on your web page by adding a code/html block in your website builder (e.g., Squarespace, WordPress, Webflow, Wix) and paste the code.

👋 P.S. Have questions? Leave a comment.

Published:

Apr 26, 2026 08:50 AM

Category: