Add code blocks and snippets to Webflow blog posts

The problem

If you use Webflow CMS and publish content or documentation for a technical audience—you probably need the ability to add code blocks and snippets to posts.

Unfortunately, Webflow's rich text editor doesn't make this easy.

One solution is to embed Github Gists/Codepens or use custom code and scripts. However, we've been building Webflow sites for years and don't recommend it. Here's why:

• Creating a gist/pen for every block is a hassle. We absolutely love Github Gists and Codepen, but if you're publishing frequently, this workflow quickly becomes a mess.
• Custom code/scripts are fragile. If you (or Webflow) make any tweaks to your html schema or classnames, this is liable to break that javascript you copy-pasted from an old forum post.

The best way to add code blocks to CMS items (*updated 2023)

This is where Audienceful steps in. After being annoyed with this ourselves, we built a new, better way to publish posts to Webflow CMS.

We use the Webflow API to publish directly to your site, without ever needing to login to Webflow.

Our Notion-inspired editor has native support for code snippets, code blocks, and many other things you won't find in the Webflow rich text editor.

Best of all, publishing to Webflow sites is 100% free, even if you don't run your email marketing or newsletter on Audienceful.

1. Create a free account with Audienceful

Create a free Audienceful account here. It's fast and only takes about 30 seconds.

2. Connect your Webflow connections

Once you're inside Audienceful, go to Settings > Webflow Collections and click the Connect New button.

Here you'll need to give Audienceful permission to publish to your Webflow sites and need to align fields so your post data goes to the right place.

If you're having issues, here's our full guide for connecting Webflow collections.

That's it. Start publishing!

You can now publish content much faster from a tool that feels like your favorite notes app--with native support for code blocks and snippets.

We actually use Audienceful ourselves to publish all of the content on this website—including the very post you're reading right now.