Today, we’re happy to introduce you to a new way of editing your content with Strapi! We are thrilled to announce our latest feature - the integration of Vercel's Visual Editing. This integration brings an intuitive visual editing experience to your content creation process. Collaborate seamlessly with your team while visually crafting your content. Let's take a look at what this means for you.
Simply copy and paste the following command line in your terminal to create your first Strapi project.
npx create-strapi-app my-project
Visual Editing by Vercel was released on May 3rd 2023, and it enables editors to seamlessly transition from the displayed content on your frontend to the corresponding fields in the CMS that govern it. This tool now allows for real-time editing of content on websites powered by Strapi. It's a bridge between content visualization and seamless collaboration.
Real-time visualization, seamless collaboration, and direct editing without needing to dive into the backend - this is the future of content management. The process becomes more efficient, reducing back-and-forth communication, which means faster, more effective changes.
Ease of Use: For non-technical users, such as content creators, marketers, and editors, a visual interface is much more intuitive than entering raw data or markdown. You can easily see how the content will appear once published.
WYSIWYG (What You See Is What You Get): With visual editing, you can get a live preview of how your content will look, allowing you to make real-time adjustments and refinements. This eliminates the guesswork of how the content might render on the frontend.
Faster Content Creation: Visual tools can often speed up your content creation process. Editing functionality, for instance, makes it much quicker to change copy or other elements on a page.
Exciting news! Strapi now supports Vercel Visual Editing, currently in Beta. We've taken steps to fully integrate Strapi with Vercel's Visual Editing feature. Here’s a snapshot:
Strapi Plugin - Content Source Map We've created the source map plugin for Vercel, allowing editors to navigate directly from rendered content on the front-end to the Strapi fields that control it. The Content Source Map Plugin is available to our Enterprise customers and Pro, Team and Custom Cloud customers.
Imagine hovering over a piece of content on your website and, with a single click, jumping directly to the related CMS field in Strapi for editing. It's that simple, fast, and intuitive! Gone are the days of switching between tabs to see how your content looks. With Strapi's support for Vercel’s Visual Editing, what you see is what you edit; everything is streamlined for efficiency!
By leveraging the @strapi/plugin-content-source-map, we've bridged Strapi with this fantastic real-time visual editing tool. We've seamlessly incorporated the source map plugin to ensure that you get the best visual editing experience.
Getting started is a breeze:
Niklas Winkels is Senior Product Marketing Manager at Strapi, the leading open-source Headless CMS. He's a developer relations expert with a background in demand generation. In his free time, Niklas loves making music, travelling, and surfing 🏄♂️