Visual Editing in DatoCMS

This video covers how you can use Visual Editing for your content in your DatoCMS project (with minimal configuration needed from your devs!)

Want a quick sneak peek into the feature? Here's the promo video that zips through the capabilities 👇

Visual Editing supports two workflows. Use either one, or both. You pick whichever fits the moment!

Click-to-edit

This is the simplest setup (especially if you've been using Vercel's integration with Headless CMS in the past). You visit your website in draft mode, hover over content to see what's editable, and click to open DatoCMS in a new tab. It works entirely on your frontend, and with any hosting: Vercel, Netlify, Cloudflare, you name it. You don't need any plugins to be installed, nothing. Nada. Just Content Link (that's your dev's problem, not yours).

Side-by-side edit

If you've been using the Web Previewsplugin in the past, this is that plugin on steroids.

The result is the workflow editors have been asking for since headless CMSes became a thing: preview on the left, edit panel on the right. Click on any piece of content, the edit panel opens right there. No tab switching, no context loss, instant live updates.

This plugin also enables you to have preview links in the CMS sidebar, have bidirectional navigation (scroll either panel, the other panel will keep up with context), AND give you full-screen Visual Editing mode.

To get started with Visual Editing, share the docs with your devs and get them to implement it!