Keep an eye on your inbox!
Hmm, that didn't work. Try again?

Building the Webflow blog — in Webflow

How I used Webflow to build our blog. In less than 1 hour.

Mat Vogels
November 20, 2015
Web design

We use Webflow a lot here at Webflow HQ. In fact, we use it to build everything that isn’t the app itself — including our marketing site, help center, landing pages, and this blog.

As many of you know, we released our new CMS last month. Since then, we’ve seen thousands of designers build incredible things with it. Blogging ranks as the most popular use for the CMS, since it lets Webflow users create, design, and publish content dynamically. Without messing with code.

Here’s how we build ours with Webflow CMS.

The first Webflow blog — before the CMS

Even before the CMS, we used Webflow to create our blog. We published dozens of posts by duplicating a blog template page, then swapping out the content.

It was tedious. Very tedious.

And it lead to a lot of human error (like forgetting to change links, or update authors). It wasn't pretty, but it taught us a lot about what we wanted Webflow CMS to be.

It's much better now.

The future is now

After months of hard work, we finally started to publish dynamic content using the CMS.

But the blog wasn't our first CMS-driven site — our marketing site took that honor.

It also wasn't the second — our Help site (with its hundreds of pages) came next.

Finally — more than a month after the launch — the blog was ready to shine.

Now, you might think building a totally custom, 100%-content-driven blog the whole Webflow team could contribute to might take a lot of time to create.

It took one morning.

Vlad (CEO of Webflow) and I recently attended the Future of Web Design conference in San Francisco, and one of the demos I gave covered using Webflow to build a blog from scratch.

Little did my audience know I was literally building Webflow's blog even as I spoke.

We walked through the whole process: from adding content with the CMS, designing this content on the page itself, to finally pushing the page live. It took less than an hour, and the Webflow blog was born.

Now, I’d be lying if I said that was it. We’re still making tweaks to optimize the experience. But the bulk of the project took a single morning at a small conference booth in San Francisco.

And this is just the start! We have big plans for the Webflow Blog, and will continue to provide valuable content, insights into our workflow, and more.

Want to see us cover something in particular? Let us know on Facebook or Twitter!

5. Zestful

Zestful helps companies book fun, unique, and local group activities available through their platform. You might expect a site like theirs to scream FUN! Well they don’t disappoint. Their upbeat vibe supports their mission to help teams socialize outside the office without the usual headache that comes with event planning.

6. Petal

Petal is a younger company, but they stand out because design pervades the focus and direction of their marketing. Even their product (a new, no-fees credit card) features a stunning and unique design. Their website follows suit — it’s a breath of fresh air — with beautiful colors, generous whitespace, and clear, concise copy.

‍Petal’s website supports their mission of providing easy credit access by making credit feel simple, approachable, and maybe a bit fun too.

7. BankMobile

BankMobile’s website makes banking look hip and modern, as hard as that might sound. With bold colors, clearly presented information and a consistent feel throughout the site, we especially appreciate the unique horizontal scrolling section they use to walk through the UI on their mobile app.

8. Bonsai

Freelancers are constantly on the lookout for new tools and products to make managing their business easier — Bonsai focuses on checking as many of those boxes as possible with tools that range from invoicing and payments to proposals and contracts. With so many features in their platform, their marketing site needs to effectively explain and differentiate how their products can help freelancers. A dedicated page for each one does just that.

‍Bonsai provides detailed product overviews with dedicated landing pages for all of their major features.

Bonsai gets bonus points for creating an impressive resource hub for freelancers. They share survey data about rates, best tools for freelancers, and the top places to find new work.

‍Bonus points for great, useful content for their freelance audience.

9. AltSchool

As an education partner, AltSchool has an important story and mission that underpins their work. Their website does a great job sharing their story with photography, copy, and a consistently communicated mission: to enable all children to reach their potential.

AltSchool uses photography and to bring their mission as educators to the fore.‍copy

Ready to build a business site of your own but not sure where to start? We’ve got you covered. Check out our full business site rebuild course on Webflow University.

Did we miss any standouts? Let us know in the comments!

Mat Vogels

Mat is a web creator and evangelist at Webflow. Follow me at @matvogels.

You might also like...

More

Join the conversation

Get free web design insights...

In your inbox, every other week. And unsubscribe in a click, if you want.

Keep an eye on your inbox!
Hmm, something went wrong. Try again?

What's Webflow?

Try it for free

Designer

Bring your wildest web designs — and client sites — to life, without writing code.

CMS

Build completely custom content structures for client sites and prototypes.

Hosting

World-class web hosting at your fingertips, without all the usual hassles.