Framer Update, CMS

Inline Content Editing

Edo

3:21

6.7K views

Jun 12, 2025

About this lesson

We’re introducing a new way to edit CMS content, inline, in context, and directly on the Canvas. Just double-click any layer with CMS content to start typing right away. Your changes will be instantly synced with the CMS, and you can edit a wide range of fields, including plain text, rich text, dates, references and images. When working with rich text, you can now type / to insert blocks like headings, lists, blockquotes, tables, images, and videos, all fully editable inline. This new editing experience lays the groundwork for even more powerful updates coming soon. The release also includes several fixes and improvements across the board.

https://www.framer.com/updates/inline-content-editing

Follow: https://framer.link/yt-x

Learn: https://framer.link/yt-academy

0:02[Music]0:05Hi, this is Edo from Framer and today I 0:08want to show you a new exciting way to 0:10edit CMS content in line on the canvas.0:14First, I'm going to select a layer to 0:16show you that it's now easier to see 0:17when there is content coming from the 0:20CMS. And when you click it, the overlay 0:22opens with that specific field 0:24highlighted. Now, editing content in 0:26this overlay is a nice shortcut to the 0:28CMS, but it's far from intuitive. And 0:31since our plan is to make content 0:33editing easy for everyone, it all starts 0:36by letting you select and doubleclick to 0:39edit content in line. And this new 0:42intuitive experience applies to a number 0:44of fields. For instance, you can now 0:46doubleclick a date to change it with a 0:49picker with the new date respecting the 0:51format you're using. And you can also 0:53doubleclick to edit references in line.0:57All these changes are immediately 0:59reflected in the CMS as you can see. And 1:02if we go back to the canvas, you'll see 1:04you can also double click an image to 1:06change it specifically for that CMS 1:08item. But the real power comes when you 1:12edit rich text in line. Just like for 1:15other elements, you can doubleclick to 1:17edit. And when you press enter to go 1:20into a new line, you'll see that you can 1:22type slash to add blocks. This new handy 1:26menu allows you to do a number of things 1:28like adding a new heading. And when you 1:30have it open, you can just start typing 1:33to filter out blocks like uh an image 1:37one. I'm going to select this one. And 1:41once it's added, I can just click to 1:44select another image if I want to. Just 1:47by typing slash, you can add pretty much 1:49anything as you're editing in line. For 1:52instance, one of my favorite blocks is 1:55the table one. Once you add a table,1:58it's immediately editable in line. So,2:00you can change things like a title or 2:03select the content of a cell to edit it.2:06And you can even use the three dots menu 2:08to add rows and columns and other 2:11things. As you've seen so far,2:13everything I add is editable, including 2:15block quotes. For instance, let me add a 2:18quick mdash over here. Even code blocks 2:22are now editable in line. So I can just 2:25go over here and type something like 2:28bounce 0.5. And you see that the code is 2:32formatted and respecting the color theme 2:34I chose. And lastly, YouTube videos are 2:38inline editable as well.2:42Now, we feel that overall this is a huge 2:44leap forward in letting you edit content 2:47visually. And of course, editing content 2:49in the CMS or the CMS overlay remains 2:53useful in a number of cases. And that's 2:55why we ported the slash command there as 2:59well when you're editing content in a 3:01rich text field.3:04This update builds the foundation for a 3:06lot of exciting things to come. We 3:09really hope you enjoyed it. Happy inline 3:12editing and see you soon.

TeachesCMS Pages / Dynamic Content CMS Fields

Also coversKeyboard Shortcuts Themes

Watch on YouTube ↗

‹ Generating layouts with AI using Wireframer

Wireframer: Dark Mode ›