Is Weaverse a headless CMS?

Weaverse is a visual CMS and editor layer purpose-built for Shopify Hydrogen storefronts. It manages page content and components on top of a developer-owned React storefront.

Does Weaverse replace Hydrogen?

No. Hydrogen remains your storefront framework. Weaverse adds the visual editing and content management layer on top of it.

Can developers use custom React components?

Yes. Developers expose their own React/Hydrogen components with schemas, which then become editable building blocks in Weaverse.

Can marketing teams edit without code?

Yes. Once developers expose components and sections, non-developers can compose and update pages without touching the codebase.

Hydrogen CMS

The CMS for Shopify Hydrogen storefronts

Weaverse gives teams a visual CMS for Hydrogen pages without replacing the developer-owned React storefront. Developers build the components; merchants and marketers manage the content.

Start building See showcases

Why Hydrogen needs a CMS layer

Hydrogen is powerful but developer-centric. Marketing teams still need editable pages, campaigns, localization, SEO, and previews. Without a CMS layer, every content change becomes a developer task. Weaverse closes that gap while keeping the storefront in code.

How Weaverse fits the stack

1.Shopify data
Products, collections, and metadata stay in Shopify.
2.Hydrogen storefront
A developer-owned React storefront, hosted on Oxygen or your own platform.
3.Weaverse CMS
The visual editor and content layer on top of Hydrogen.
4.Marketing workflow
Teams launch, localize, and optimize pages on their own.

Hydrogen deployments in the Shopify admin

CMS capabilities

The core tools a team uses to manage a Hydrogen storefront.

Visual building

Edit live Hydrogen pages section by section.

Weaverse Studio editing a Shopify Hydrogen storefront

Scheduled publishing

Prepare campaigns and publish at a planned time.

A summer sale campaign page on a Hydrogen storefront

Localization

Manage localized content for multiple markets.

Switching between markets and locales in Weaverse Studio

SEO management

Own page metadata and content structure.

The SEO manager in Weaverse Studio, with page settings beside Google, Open Graph and X previews

Custom components

Make your own React components visually editable.

Section settings generated from a component schema

For developers

Keep your Hydrogen storefront and React components in your own repo
Define component schemas to control exactly what is editable
Storefront code and components stay in your codebase

app/sections/featured-collections.tsx

import { createSchema } from '@weaverse/hydrogen'

export let schema = createSchema({
  type: 'featured-collections',
  title: 'Featured collections',
  settings: [
    {
      group: 'Content',
      inputs: [
        { type: 'text', name: 'heading', label: 'Heading' },
        { type: 'collection-list', name: 'collections', label: 'Collections' },
      ],
    },
    {
      group: 'Layout',
      inputs: [
        { type: 'range', name: 'gap', label: 'Items spacing' },
      ],
    },
  ],
})