Webstudio
Webstudio is an open source website builder that empowers creators to build highly maintainable and fast websites using modern web standards.
What is Webstudio?
Try WebstudioWebstudio CMS is a headless CMS front-end builder that lets you connect to your existing CMS and build a complete site using a visual editor. You can fetch CMS data dynamically with Cloudflare Workers (dynamic at the speed of static) and bind it directly to pages, components, and page metadata. It’s designed to reduce designer-developer handoff by letting one person make updates visually.
What is Webstudio CMS and how does it help you build websites?
Webstudio CMS lets you build a frontend visually while connecting to the headless CMSs you already use. You create pages (including dynamic routes), fetch the exact CMS data you need, and bind that data to Webstudio components so your content renders dynamically without custom-coded frontends.
Do you need to know how to code to use Webstudio CMS?
No. While some parts may feel technical, Webstudio CMS is designed so you can use a CMS and build your site without writing code.
How does Webstudio CMS handle dynamic pages and routing?
You can define dynamic parameters in your page paths (for example, /blog/:slug). Webstudio uses Cloudflare Workers to fetch CMS data and cache responses at the edge, so the content updates based on the requested URL while keeping performance fast.
How do you connect Webstudio CMS to a headless CMS (and what are resources)?
Connect in three steps: create a dynamic page, fetch CMS data with a query that takes the dynamic parts of the URL, and bind fields to Webstudio components and settings. With Resources, you can configure requests to your headless CMS by defining the request URL, method, headers, and body.
Can you customize what content shows based on conditions or expressions?
Yes. The Expression Editor lets you create logic in the UI for conditional display, fallback values, concatenation, redirects, and even customizing the status code for responses.
What can you bind from your CMS into your site?
You can bind CMS data to page settings and components, including meta titles, descriptions, social images, and custom meta values. You can also map CMS fields to component inputs like headers, images, and rich text, with embeds styled like regular canvas elements.