Storefront Studio – Visual Live Editor & Page Builder for Shopware

About the Extension

The visual live editor & page builder for Shopware 6

Storefront Studio is the native landing page builder and CMS editor for Shopware 6.6 and 6.7: a true WYSIWYG live editor with iframe preview, drag & drop, a visual editor mode and 250+ sections. The native Shopware answer to Elementor (WordPress), Shopify Sections and Storyblok — no external CMS layer, no API round-trips, no double maintenance. Everything stays inside your Shopware back-end, with full DAL, multi-sales-channel and multi-language support.

Landing pages & shopping experiences in minutes – no Twig, no theme rebuild

Whether it is a Black Friday landing page, a seasonal shopping experience, a campaign page or a brand story: Storefront Studio builds every storefront page as a visual editor — drag & drop, live preview, no-code. No Twig template, no theme:compile, no front-end deploy. Changes appear in the iframe preview the moment you make them.

All page types editable – not just the home page

Storefront Studio covers every route of your shop: home, category listing, product detail page (PDP), cart, checkout, finish page, all account routes (login, register, overview, orders, address book, payment, newsletter), search results, 404, contact and CMS static pages. One storefront editor for the entire customer journey.

250+ sections in a well-organised palette

• 12 editorial design blocks — split hero, bento grid, story scroller, before/after reveal, product 360, achievement stats, team cards, trust seals, category preview, value pillars, mega testimonial, blog preview.
• 11 Elementor-style building blocks — shape divider, pricing table, countdown timer, marquee, accordion, tabs, alert box, cookie bar, social icons row, progress bar, icon box.
• 10 WOW elements — coverflow, sticky-scroll story, card flip, Ken Burns, 3D cube, diagonal split, text-reveal on scroll, product-card flip, countdown hero, cinema video.
• 25+ desktop WOW elements — isometric 3D grid, morphing-blob divider, draggable cards deck, circular-progress story, reveal-on-hover split, vertical slider cinema, interactive country map, product sphere 3D, glitch-text hero, frosted-glass cards.
• 24+ SW-native wrappers — product slider, cross-selling, category navigation, buy widget, filter sidebar, breadcrumbs, category menu, rating aggregation, login form, register form, cart summary, order list, address book, newsletter subscribe, search bar.
• 10 interaction elements — FAQ, newsletter, countdown, multi-column, icon grid, spacer, custom code, contact form, Google Maps, social icons.

WYSIWYG live editor with iframe preview

• Click-to-select directly in the front-end preview — click a section, its config opens.
• postMessage bridge between editor and iframe — cross-origin capable.
• Live reload of every CSS/HTML change without page refresh.
• Viewport toggle desktop / tablet (768 px) / mobile (375 px).
• Undo/redo with a 100-step stack (Ctrl+Z / Ctrl+Y).
• Drag & drop media picker on all image fields — including inside items[] arrays.
• Short-text editor with bold/italic/link toolbar for short rich-text fields.
• ENUM dropdowns instead of text inputs for 20+ enum fields (align, layout, variant, size, imageSide).
• German field labels for 90+ config keys.
• Category tree in the editor popover for all category references.
• Section labels A/B/C… overlaid on every section in editor mode.
• Palette tabs "Kommora elements" / "Shopware standard" for clean separation.
• Live preview of the active theme (theme-aware).

Draft / publish with full revision history

• Autosave every 800 ms — no data loss.
• Named snapshots ("before the Christmas campaign" / "after the redesign").
• Revision timeline with type badge (autosave/manual/publish), date, section count.
• One-click restore for any revision.
• Draft/published split — customers only see what has been published.

Multi-language & multi-sales-channel out of the box

Every section stores translatable JSON per language. Multi-sales-channel setups keep a dedicated layout per channel. Cross-origin postMessage capable — works with multi-domain configurations. Ideal for international D2C brands and B2B merchants with several sales channels.

Design system & theme-awareness

CSS custom properties (typography scale, colour tokens, spacing, radius, shadow) are runtime-injected per sales channel. Storefront Studio reads the active custom theme automatically and picks up its colours, fonts and spacing — you work directly in your corporate design, not in a generic editor skin.

Real-world use cases

• Campaign landing page: Black Friday hero + product slider + countdown timer + trust seals + newsletter CTA — built in 15 minutes.
• Seasonal shopping experience: story scroller for the brand story + bento grid for the collection + before/after for the "then and now" effect + team cards for personality.
• PDP redesign: native SW gallery + custom trust signals + rating aggregation + cross-sell slider + FAQ — without a single line of Twig.
• Multi-language B2B shop: German layout with technical terminology, English one with simpler wording — both from the same section config, translatable JSON per language.

Cleanly built – for the store, for you, for your customers

• DAL only — no plain SQL, no direct DBAL in business code.
• ACL-gated admin API with permission checks per endpoint.
• Multi-version support Shopware 6.6 / 6.7 (dual-build Webpack + Vite).
• PHP 8.2+.
• Pre-compiled storefront and admin assets — no npm required on live.
• system_config clean-up on uninstall with "delete all data".

An alternative to Elementor, Shopify Sections & Storyblok – native to Shopware

Storefront Studio is the native Shopware 6 answer to Elementor (WordPress), Shopify Sections and Storyblok. No external headless CMS layer, no API round-trips, no double maintenance between CMS and shop. Everything stays inside your Shopware environment — with full DAL, multi-sales-channel and multi-language support. A visual editor that does exactly what shopping experiences cannot do out of the box: landing pages, PDPs, cart, checkout, account — every page, no-code.

Perfect for

• Marketing teams that want to build landing pages without developers.
• Agencies that want to grow client shops faster (a visual CMS editor instead of Twig tweaks).
• D2C brands that focus on storytelling & editorial content.
• B2B merchants with multi-language and multi-sales-channel requirements.
• Shopware agencies that want a reusable section library.