Framer Update, AI, CMS

Wireframer: Blogs and Changelogs with CMS

3:40

5K views

Oct 1, 2025

About this lesson

The October Update brings CMS support to Wireframer. Generate blog layouts powered by the Framer CMS, with all Links and Fields set up for you. This means Wireframer can now generate Collections, making it much easier to get started with your first blog in Framer. Wireframer can now generate multiple pages too, and apply updates across pages, like navigation elements. See what else is new in the October Update here: https://framer.com/updates/wireframer-cms

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

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

0:00Introducing CMS support for Wireframer.0:04This is a blank project. And here I can 0:07press W to bring up the Wireframer 0:10panel. And I'll start writing a prompt 0:12to generate a new blog about Framer. I 0:16would like the post titles to be short 0:18and sweet. And I want about three 0:22paragraphs for each post. And then I'll 0:25ask for a few subheadings, but not on 0:28top of every single paragraph.0:31And finally, I'll ask for a list of 0:34posts with little previews. And then 0:37it's time to generate.0:41As you can see, Wireframer will now let 0:43us know what it's doing at every step.0:46And not only is it generating our blog 0:49index page, it's also actually 0:51generating detail pages for every single 0:54post with real relevant content matching 0:58our prompt. So now it's done. And as you 1:01can see, we have a real blog post 1:04generated right here in Framer. And we 1:07can also go back to take a look at the 1:10index page. And the magical thing here 1:14is that Wireframer has actually created 1:17a real CMS collection ready for you to 1:21customize with all relevant fields 1:24already set up for you like title, slug,1:27date, image, and content. And when we 1:31give this a preview, you'll see we have 1:34just generated a fully functional blog 1:38with real links to real posts. Next,1:41let's iterate a little bit on our 1:44generated pages. This new version of 1:46Wireframer lets you ask for changes 1:49across multiple pages, like a navigation 1:53bar, and Wireframer will now know to 1:55apply the same content and the same 1:58sections across multiple pages, which is 2:01perfect for consistent navigations and 2:05footers. Plus, we can now iterate on 2:08CMSbased setups. Here, we're also asking 2:12for a single column layout for these 2:14blog posts. And there we go. So, let's 2:18have a look. We have a new navigation 2:21with a placeholder logo and some links 2:24on the right like we asked for. It has 2:27correctly applied these to both the 2:29detail page of every post plus the index 2:33page. And we have a simplified layout on 2:36the index page with a single column.2:40From here, we could also ask it to 2:42feature the latest blog post. And being 2:45able to iterate on a blog page design 2:49like this is a huge workflow booster as 2:52typically you could spend quite some 2:54time setting up all the variables and 2:57fields manually. And yes, theming now 3:00also works across multiple pages. And 3:04I'll toggle the framer UI theme to match 3:07here. And just like that, we have our 3:10entire blog now in dark mode. In just a 3:14few short minutes, we were able to 3:17design and iterate on this starting 3:20point for a real functional blog that we 3:23can continue customizing directly in 3:26Framer. And that's the power of CMS 3:29support in Wireframer.

TeachesAI Generation Collections

Also coversCMS Pages / Dynamic Content Links Themes Variables

Watch on YouTube ↗

‹ Optimizing Video files for the Web

Creating persistent animations between pages in Framer (Animation Lesson 15) ›