Webstudio CMS
The best CMS is the one you already use. Connect to your existing CMS or the one that works best for you.
Headless CMS, without writing code
Use headless CMSs without custom-coded frontends with Webstudio, an advanced visual builder that connects to any CMS.
No designer-developer handoff
Build visually, enabling one person to make any changes.
Compose your tech stack
Choose the best backends and use them together in one cohesive experience.
Dynamic at the speed of static
Cloudflare Workers fetch the data and cache the responses on the Edge, just milliseconds away from any user on Earth.
Connect any headless CMS in three steps
1. Create a dynamic page
_BDn9zNRBJGBsOEsP5_IrC.svg?width=640&quality=80&format=auto)
Similar to a static page, the path includes dynamic parameters, like a post slug. This enables the page contents to change dynamically based on the requested page.
2. Fetch CMS data
Create a query to fetch data from the headless CMS, passing in the dynamic part(s) of the URL. Fetch exactly what you need, whether it's a simple blog post or a complex data model with many relations, filters, and parameters.
3. Bind the data
Connect your CMS fields to Webstudio components. You can bind external data to any component and field within Webstudio, from rich text to meta titles.
Integration guides
Go from zero to a complete frontend, including an overview page, details page, and dynamic sitemap with our setup guides.
Many more platforms are supported. This list only contains the tutorials we've created so far.
Need help deciding? Use the Headless CMS Finder tool.
All the features to build a frontend for your CMS
Whether building a simple blog or a complex portal that fetches data from multiple backends, Webstudio can handle it.
Dynamic routing
Define a dynamic parameter within a page path, like /blog/:slug. When someone goes to /blog/hello-world, your query can dynamically fetch the blog post with the slug hello-world.
Status code
Customize the status code using the Expression Editor.
Expression Editor
Create logical expressions directly in the UI, enabling conditional display, fallback values, concatenation, and more.
Resources
Configure requests to your headless CMS using a Resource. A Resource allows you to define the request URL, method, headers, and body.
Content Embed
Style each rich text element JUST like you style any other instance on the canvas – using the style panel, including Tokens or Local styles.
Localization (full support)
Use a dynamic language parameter inside your URL to render the document's language, as well as localized date and time.
Component bindings
Map CMS data to any Webstudio component and field, such as headers, images, and rich text.
Page settings bindings
Bind CMS data to any page settings, including meta title, description, social image, and custom meta values.
Dynamic redirect
Use expressions for page redirects and dynamic response handling.
Content Collections
Iterate over data with unlimited nested collections.
GraphQL Resources
A GraphQL Resource is for fetching data from a GraphQL API. It allows you to define the query, variables, and headers. Other requests, such as REST, can be fetched using a Resource.
Sitemap
Create a sitemap containing static URLs from Webstudio and dynamic URLs from a CMS.
FAQs
Do I need to know how to code?
No. While some users may find some areas technical, you can use CMS without writing code.
How much does it cost?
For Cloud, CMS is available on all paid tiers. See pricing for more info. For self-hosting, it's free.
Can I use <insert CMS>?
Webstudio CMS supports any content management system (CMS) that provides an HTTP API. While virtually all CMSs are supported, not all features in each CMS may be supported. Refer to the CMS documentation for more info.
Which CMS should I use?
Use the Headless CMS Finder tool to help you decide.
Are the sites dynamic or static?
Dynamic (at the speed of static). You can add searches, pagination, and filters to your pages. Cloudflare Workers and Edge Cache make lucidrous-fast speed possible.
What types of projects is Webstudio CMS viable for?
Anything from a simple blog to complex data structures that need dynamic pages. You can also connect to CRMs, databases, and anything else with an HTTP API.
Is Webstudio stable?
Absolutely. Webstudio is production-grade, leveraging Cloudflare’s robust infrastructure for unparalleled availability, security, and performance. Additionally, the builder is decoupled from live sites, ensuring that once a project is deployed, it operates independently within its own Cloudflare Worker.
