Add a Shutter Columns section

Visually Engaging and Dynamically Responsive

The "Shutter Columns" section offers a unique, interactive layout that adapts seamlessly to both desktop and mobile devices.  On larger screens, the horizontal accordion creates a sleek and modern feel, while on mobile, the layout intelligently shifts to a vertical accordion for optimal viewing.  Each panel features a customizable background image that dynamically changes as users interact with the section, adding a layer of visual interest and sophistication.  When expanded, each column reveals a heading, subheading, descriptive text, and a call-to-action button, providing ample opportunity to showcase your products and brand message.

Key Features:

  • Interactive Accordion Design: Engage customers with a dynamic, expandable layout that encourages exploration.
  • Customizable Background Images: Set the mood and visually represent each section with unique, high-quality images.
  • Rich Content Integration: Each panel unfolds to reveal a heading, subheading, descriptive text, and a call-to-action button.
  • Responsive Design: Seamlessly adapts to both desktop and mobile devices for a consistent user experience.
  • Horizontal Layout on Desktop: Modern and sleek design that maximizes visual impact.
  • Vertical Layout on Mobile: Optimized for mobile viewing, ensuring a smooth and intuitive experience.
  • Easy Customization: Manage and customize your "Shutter Columns" within the familiar Shopify theme editor.

Use Cases:

  • Homepage Brand Storytelling: Introduce your brand and its values in an engaging and interactive way.
  • Product Feature Highlights: Showcase key product features and benefits with dedicated panels.
  • Collection Spotlights: Present curated collections in a visually appealing and organized format.
  • About Us Section Enhancement: Share your company's story and mission with a dynamic and interactive twist.
  • Landing Page Focus: Guide users through a specific narrative or product journey with compelling visuals and content.

How it works:

  1. After purchase check your email for the "Your new Shopify section download is ready" email and download the file to your desktop.
  2. In your Shopify store open the: Themes page.
  3. Next to your theme click the menu button with 3 dots and choose Edit code
  4. When the editor opens click on the Sections folder and choose: Add a new section.
  5. Leave the Liquid option checked and name the file wau-shutter-columns
  6. Copy the contents of the wau-shutter-columns text file that was downloaded into this new section and click save.
  7. Open your theme editor and add the new section to your store, configure your options and click save.