Learn about Shopstory core concepts, features and architecture.

What is Shopstory?

Shopstory is a visual no-code builder (similar to Squarespace or Webflow) that is based on two basic principles:
  1. 1.
    Platform-agnostic (embeddable into existing CMSes or other systems)
  2. 2.
    Compatible with custom-coded frontends.


Shopstory is not a standalone tool. It is designed to be embeddable into other systems. The most common host systems for Shopstory are headless CMSes (Contentful, ContentStack, Sanity, etc), but there is no limitation over where Shopstory can be used (e-commerce platforms, custom software, etc). You can think of Shopstory as super-advanced rich text field.
For now we provide a built-in integration with Contentful, stay tuned for new ones soon! If you're interested in integrating Shopstory into your system, let us know.

Compatible with custom code

No-code tools like Webflow or Squarespace have their limits. They're great for simple websites but when you build something serious you need custom code. Shopstory is a visual builder that is compatible with custom code.
The main idea behind Shopstory is that developers can keep working as they like in a framework of their choice. Literally nothing changes. However, in certain parts of the website developers can now place <Shopstory content={content_built_visually} /> component that renders the content built without code. So it's still developers who decide which parts of website are controlled by a no-code builder.
Right now Shopstory is compatible with any React-based front-end, next.js, Gatsby, etc.

Which parts of the website should be controlled by Shopstory?

The "marketing" parts, because they change most frequently. Landing pages, content blocks in product pages, custom collection pages, popups, banners. Basically all the things that marketing wants to change a lot and developers don't want to be bothered with

Custom components

Some components are complex and shouldn't be built by marketers but they should still be available in a no-code builder. Imagine e-commerce site and a ProductCard component. ProductCard can handle a lot of things:
  • data fetching from e-commerce platform, CMS, PIM or any combination of these. Data fetching can be optimised heavily.
  • handling multiple variants
  • quick buy, connecting to cart
  • analytics
Obviously you don't want marketing team to build such thing. Shopstory allows you build ProductCard with a code and make it available for editors in the visual builder.


In a traditional content architecture when marketer or designer comes up with a new idea then it usually must go through the following process:
  1. 1.
    Developer builds new content blocks with code.
  2. 2.
    Developer adds new content types in a headless CMS.
  3. 3.
    Developer writes a code that fetches the data from the CMS and renders the components in the front-end.
It takes a long time in bigger organisations. For many businesses that don't have their own resources and rely on agencies it is a painful process requiring scoping, invoicing etc. And let's be honest, how many developers like to be bothered all the time with these small marketing requests?
With Shopstory this process can be completely avoided. Marketer or designer can build new blocks without code and push to production with no developer involvement.

Does this mean I don't need a headless CMS anymore?

Absolutely not.
You still need a CMS for data modelling, localisation, regionalisation, workflows (reviews, permissions, scheduling), apps, etc. And a lot of your content still needs to be structured.
At Shopstory we believe that there are enough headless CMSes on the market and we don't want to become another one. Our goal is simply to extend existing ones with the power of no-code. Shopstory is a new layer in the stack.