---
title: Create Immersive Shopping Experiences | Shopware Community Hub
description: >-
  Learn about creating engaging, conversion-focused shopping experiences using
  Shopware’s drag-and-drop tools. Learn to build dynamic pages, implement…
canonical_url: 'https://hub.shopware.com/learn/unit/user-shopping-experiences'
---

# Create Immersive Shopping Experiences

<LearningObjectives>

- Understand the concept and benefits of Shopping Experiences in Shopware.
- Learn to create dynamic, content-rich pages combining commerce elements with engaging media.
- Utilize drag-and-drop tools to build pages without coding.
- Explore different layout types: Landing Pages, Category Pages, Product Pages, and Sections.
- Design mobile-optimized and reusable templates to enhance the shopping journey.
- Implement storytelling, immersive media, and event promotion to engage customers.
- Configure interactive sections, product filters, sorting options, and flash deals.
- Build engaging flash deal sections with countdown timers and special offers.

</LearningObjectives>

# Shopping Experiences

<YoutubeEmbed link="https://www.youtube.com/watch?v=1JiD2V-PZoo" />
  
Shopping Experiences in Shopware allow you to design dynamic, content-rich pages that combine commerce (product listings, categories, and filters) with engaging media (images, videos, banners). Instead of offering a static shopping platform, Shopping Experiences lets you deliver a vibrant, immersive environment that guides customers toward purchase decisions.

## Key Features

1. **Drag-and-Drop Design**: Build pages with [blocks](https://docs.shopware.com/en/shopware-6-en/content/ShoppingExperiences?category=shopware-6-en/content#blocks) for text, images, and videos—no coding required.  
2. **Dynamic Updates**: Automatically refresh content, such as stock levels or bestsellers.  
3. **Reusable Templates**: [Create layouts](https://docs.shopware.com/en/shopware-6-en/content/ShoppingExperiences?category=shopware-6-en/content#creating-a-new-layout) once and use them for similar categories or events.  
4. **Mobile Optimization**: Ensure seamless experiences on mobile devices.  

Strum & Co. sells more than just guitars. It offers an emotional connection to music. Shopping Experiences let you showcase your unique craftsmanship, high-quality instruments, and the stories behind each product.  

**Examples for Strum & Co.**:  

- **Storytelling**: A page titled "The Journey of a Guitar" narrates how each instrument is handcrafted, including behind-the-scenes images from the workshop.  
- **Immersive Media**: A sound demo where users can listen to model tonal differences.  
- **Live Events**: Promote events like "Live Jam Sessions" with visiting artists or exclusive customer workshops.

## Creating a Shopping Experience

<ShopdevInstance plugin="lp15" step="DoNotDisplay" plan="rise" />

### Step 1: Define the Goal

Create a landing page for the "Legacy 500" guitar series, highlighting its vintage appeal, sound quality, and customer testimonials.  

### Step 2: Layout Types

Choose a layout that suits your purpose:  

1. **Landing Pages**: Promote limited-time sales like "Winter Blues Sale: Up to 30% Off."  
2. **Category Pages**: Organize products into logical groups, such as "Electric Guitars" or "Vintage Guitars."  
3. **Product Pages**: Provide detailed content for individual items, e.g., "The Legacy 500."

### Step 3: Build Your Page

1. **Hero Section**: Add a full-screen image of a professional guitarist using the Legacy 500 with a tagline: _"Find Your Signature Sound."_  
2. **Feature Block**: Use icons to highlight selling points:  
   - "Handcrafted with premium tonewoods."  
   - "Vintage-inspired pickups for authentic sound."  
3. **Video Demo**: Embed a video comparing the tonal nuances of the Legacy 500 with other models.  
4. **CTA Buttons**: Include "Shop Now" and "Book a Demo."  

### Step 4: Device Optimization

Ensure that the interactive video, product carousel, and other elements adjust perfectly on smartphones.

## What are Sections?

Sections are the structural elements of Shopping Experiences. Each section can be configured to present content in visually distinct ways.  

### **Types of Sections**  

1. **Full-Width Sections**:  
   - **Use Case**: A sweeping image or video header showcasing Strum & Co.'s craftsmanship.  
   - **Example**: A panoramic workshop view with a tagline: _"Crafting Dreams, One String at a Time."_  

2. **Split Sections**:  
   - **Use Case**: Side-by-side layouts for detailed comparisons.  
   - **Example**: A split section showing an image of a guitar and a bulleted list of features like _"Built with AAA-grade mahogany for unmatched resonance."_  

3. **Dynamic Sections**:  
   - **Use Case**: Show auto-updating collections like new arrivals or seasonal offers.  
   - **Example**: A dynamic section labeled _"Recently Restocked"_ with the latest models back in stock.  

4. **Interactive Sections**:  
   - **Use Case**: Add engaging elements like quizzes or product filters.  
   - **Example**: An interactive quiz titled "Which Guitar Matches Your Style?" filters products based on user preferences.  

### **Pro Tips for Sections**  

- Use **contrasting colors** to make CTAs stand out.  
- Include **social proof** like customer reviews or celebrity endorsements in dedicated sections.  
- Optimize **loading times** by compressing images for better performance.

## What are Landing Pages?

Think of landing pages as special web pages designed to achieve a specific goal, like a digital storefront window that catches your customers' attention. They're different from regular product pages because they focus on one main message or offer.

For example, if you're running a special sale on acoustic guitars, instead of showing all your products, you'd create a landing page that highlights just the sale items with eye-catching images, special prices, and a clear "Shop Now" button. It's like creating a dedicated space to showcase your best deals or newest products.

### **Real-World Examples for Strum & Co.**  

1. **Limited-Time Promotions**:  
   - **Page Name**: _"Holiday Strings: Save 25% on Acoustic Guitars!"_  
   - **What it does**: Creates excitement with seasonal imagery, shows countdown timers, and features bestsellers like the "Harmony 300" prominently.  
   - **Why it works**: Customers immediately see the special offer and feel the urgency to act before the sale ends.

2. **Event Pages**:  
   - **Page Name**: _"Live Guitar Maintenance Workshop"_  
   - **What it does**: Provides all event details in one place, includes a simple registration form, and shows where the workshop will be held.  
   - **Why it works**: Makes it easy for customers to learn about and sign up for your events.

3. **Featured Stories**:  
   - **Page Name**: _"The Legends Who Strum"_  
   - **What it does**: Tells the stories of famous musicians who use your guitars, with photos and testimonials.  
   - **Why it works**: Builds trust and shows the quality of your instruments through real-world examples.

### **Making Your Landing Pages More Effective**  

- **Create Urgency**: Use phrases like "Only 5 Left!" or "Limited Time Offer" to encourage quick decisions
- **Show Social Proof**: Include video testimonials from happy customers to build trust
- **Answer Common Questions**: Add a simple FAQ section to address customer concerns quickly
- **Keep it Focused**: Stick to one main message or offer to avoid confusing visitors
- **Make it Mobile-Friendly**: Ensure the page looks great and works well on phones and tablets

## Individual listing pages

Listing pages provide category overviews for browsing multiple products.  

### **Strum & Co. Use Case Examples**  

1. **Electric Guitar Listings**:  
   - Filters: "Body Shape," "Pickup Configuration," and "Genre Suitability."  
   - Featured Section: "Top Picks for Metal Players."  

2. **Beginner Kits**:  
   - List: Bundles including guitars, amps, and straps.  
   - Example: _"Starter Kit: Everything You Need to Begin Your Musical Journey."_  

## Product page layout

Product pages must be both informative and persuasive.  

### **Enhanced Product Page Ideas**  

1. **High-Quality Images**: Offer zoom-in features and alternate views.  
   - Example: Include close-ups of intricate inlays on fretboards.  

2. **Demo Clips**: Let users hear the guitar in action.  
   - Example: Embed audio tracks comparing clean and distorted tones.  

3. **Comparison Tables**: Allow side-by-side specs for models.  

4. **FAQs**: Answer questions like "Does this guitar come with a warranty?"

## Sorting & Filtering

Robust filters simplify navigation for users.  

### **Advanced Filters for Strum & Co.**  

1. **Skill Level**: Beginner, Intermediate, Advanced.  
2. **Body Material**: Rosewood, Maple, Alder, etc.  
3. **Tone Preference**: Bright, Warm, Balanced.

### Step 5: Add Flash Deals & Special Offers

Flash deals and special offers create a sense of urgency and increase conversions by encouraging customers to act quickly before discounts expire. Additionally, gift cards and free shipping incentives boost overall sales by catering to gift shoppers and those looking for additional savings.

### Create a flash deal section

Flash deals help highlight high-demand guitars and accessories with limited-time price drops, making them more appealing to customers.

1. **Add a New Section**  
   - Navigate to your **Shopping Experience Editor** -> **Create New Layout**
   - Choose **Product List Block**
   - Click **"Add Section"** and **choose Full-Width Layout** for maximum visibility.  

2. **Insert a Product List Block**  
   - Drag & drop a **Product List Block** into the newly created section.  
   - Select the **"Time-Limited Sale Products"** option to display discounted guitars and accessories.  

3. **Select High-Demand Sale Items**  
   - Add specific products with significant discounts, such as:  
     - **Gibson Les Paul Standard – 25% Off**  
     - **Fender American Professional II Stratocaster – 20% Off**  
     - **Yamaha FG800 Acoustic Guitar – 30% Off**  
     - **Boss Katana Guitar Amp – 15% Off**  

4. **Enhance the Deal with a Countdown Timer**  
   - Drag & drop a **Countdown Timer Block** below the product list.  
   - Configure the timer to **count down to the sale's end date** (e.g., "Offer Ends in: 2 Days 10 Hours").  
   - **Why?** A visible time limit creates a sense of urgency, pushing customers to buy before the discount disappears.  

5. **Add a Call-to-Action (CTA) Button**  
   - Insert a **"Shop Flash Deals Now"** button beneath the product list.  
   - Link it directly to a **dedicated Flash Deals category page** where all discounted items are displayed.  

#### **Example of How It Will Look to Customers:**

🔥 *Limited-Time Deal!* 🔥  
📅 *Gibson Les Paul Standard - 25% Off!*  
🕒 *Hurry! Sale Ends in: 1 Day 6 Hours!*  
[ **Shop Flash Deals Now** ]  

### Activity: Display Gift Cards & Free Shipping Incentives

Gift cards and free shipping promotions **increase order value** and attract last-minute buyers. This section will **motivate hesitant customers** to complete their purchases.

#### Tips

1. **Add a New Two-Column Section**
2. **Left Column – Promote Strum & Co Gift Cards**  
3. **Right Column – Highlight Free Shipping Offer**  

With these additions, **Strum & Co.'s seasonal sale page** will drive more impulse purchases while increasing overall sales and engagement!

## Final Thoughts

Creating immersive shopping experiences is about crafting a journey that resonates with your customers through strategic layouts, interactive elements, and mobile-optimized designs. By leveraging Shopware's drag-and-drop tools, you can build dynamic pages that tell your brand's story while driving conversions. Remember to test different layouts and elements to see what resonates best with your customers, and continuously optimize based on performance data. With practice and experimentation, you'll develop the skills to create shopping experiences that not only showcase your products but also build lasting connections with your customers.
