Webstudio Introduces New Content Mode, Content Block & CSS Variables

Alex from Webstudio has just released the December update of its no-code website builder, introducing a new Content Mode, Content Block component, Search & Commands and more.

Let’s look at the new features Webstudio has released over the last three months:

New Content Mode

The new Content Mode allows you to share editing access with your clients or content editors, protecting your designs from accidental changes while allowing editors to change only the areas you specify.

New Content Block Component

Content Block is a new component that enables content authoring with a Notion-like editing experience where everything is accessible via a slash command by typing /. It is more than just a rich text editor as it provides a way to add and remove components available for editing by adding instances to the Templates container within the Content Block.

Just as you design other elements, you can design each block yourself and make it available to content editors. For example, you can design a “Card” and add it to the Templates. The content editor can then press the slash key, insert the “Card” and start editing it immediately.

Search & Commands

As mentioned in The Pier #79, Search & Commands is a new centralized place to navigate the builder and perform actions such as switching pages and adding components – all by simply using the keyboard.

New CSS Variables

CSS variables allow you to create a global design system and enable you to build complex websites in a maintainable way. They can be accessed in the Style Panel fields.

What’s More?

In other news, Webstudio has released Craft, a new standard for building with the website builder, Modern Font Stacks, a new Publish to Staging option, a new AI Support Hub, a new Website Template Marketplace, and more.

Sound interesting? Get your hands on Webstudio today – an open source alternative to Webflow.