In recent years, headless CMS has been gaining attention in the field of web development. Among them, I would like to introduce "Storyblok," which is noted for its high functionality.
The power of Storyblok has also been highly rated in Gartner's Customers' Choice survey. Among the many headless CMS options available, Storyblok was the only service selected.
Storyblok is pronounced as "Storyblok," and the reason it is "Blok" instead of "Block" is simply because the domain was not available, as the CEO mentioned at an event.
Now, Storyblok has features that go beyond just being a headless CMS, offering capabilities that address specific needs compared to simpler headless CMS options, and it is supported by many companies and developers who appreciate its convenience.
Realized with Next-Generation Web Manuals!
~ Management update flow built with Modern Frontend × Documentation ~
I would like to highlight and introduce two features of Storyblok.
- Table of Contents
Feature 1 of Storyblok: Visual Editor
First, one of the main features of Storyblok is that it comes standard with a visual editor. This makes it very easy to preview content. By simply specifying a URL, you can have a real-time visual preview and instantly see the changes.
A large preview screen is displayed in the center of the screen. The right side of the screen is the editing interface for the content and block CMS. When you add or change text in this right section, the changes will be displayed in real-time on the preview screen.
You can switch the display for tablets and mobiles with the push of a button. Being able to check information in real-time without saving or deploying changes is a significant advantage.
To do this, you specify a URL for previewing, but it can also be set to localhost, which is a significant advantage as it allows for smooth verification even on sites under development.
Feature 2 of Storyblok: Block Library
Next, there is a componentized page part management feature. This allows you to manage each part used within the page as a component, enabling flexible page construction. Additionally, by utilizing the block library, you can customize and extend according to the requirements of various projects. The process of registering elements that make up the page as blocks and combining them to create the page greatly contributes to the efficiency of development.
You can combine elements that make up the page within the template. For example, let's say there is a landing page for a campaign. That page could be composed of the following elements.
• Title Text
• Subtitle
• Catchphrase
• Title Image
• Logo
• Contact Button
• Call to Action Button
By preparing a page that combines these elements, you can edit the content of these blocks from the CMS management screen, as well as rearrange or combine the structure of the blocks. On the programming side, by defining only the broad framework of the page's elements, editors and designers can manage the content of the internal elements with considerable freedom. For example, the site can be designed in such a way that there is no need to rely on engineers to rearrange the position of buttons.
When Storyblok is Suitable and When It Is Not
Storyblok is a headless CMS with advanced customization and reusability, making it useful for sites that need to continuously add new content. For example, it can easily leverage its powerful CMS features even in e-commerce sites that handle a large amount of product information. The Nordic apparel giant Marc O’polo is often featured as a case study at Storyblok events, and upon checking their site, it is evident that the customization of product pages and other elements is very sophisticated.
Storyblok is suitable for scenarios where you want to freely manipulate highly componentized pages, where there is a need to quickly create landing pages or campaign pages, and for producing content that is prone to obsolescence with version upgrades, such as technical documentation. If content updates are frequent, you will likely find it very convenient to immediately see how the content being edited in real-time affects the page. The high degree of freedom in combining the components of the page through the block library also contributes to a high level of satisfaction.
On the other hand, cases where Storyblok may not be suitable include the creation of one-time events or campaign sites within a short period. In such cases, it may be more efficient to use a simple static website generator instead of a high-functionality CMS like Storyblok. Additionally, if all that is needed is a database to store simple content, it might be better to choose another headless CMS.
Summary
We introduced the visual editor and block library, which are major features of Storyblok. Of course, Storyblok also has the basic functionalities of a headless CMS and can be used as a standard platform for delivering simple content. However, by utilizing these features in projects that can take advantage of them, you can leverage its superiority.
Storyblok offers many features, including team collaboration and ease of use across various front-ends. Its functionalities and services are likely to continue evolving. If you are considering the implementation of a headless CMS, why not consider Storyblok as one option?
Realized with Next-Generation Web Manuals!
~ Management update flow built with Modern Frontend × Documentation ~
Return to the top of the page
+81 35-321-3111[Tokyo Headquarters] 
Contact Us
Resources
