Setup Netlify CMS with Eleventy


  Hey there! This article is being published a "work in progress," which means that it is not done. So take everything with a grain of salt.

I may or may not come back and finish this article. Regardless, I hope that it's helpful in its current state.

Netlify’s guide for adding Netlify CMS to your site was really helpful. Consider this a supplemental guide to getting your Eleventy site up and running with Netlify CMS.


Your posts will probably have tags, or a list of strings for organizing content. Netlify CMS has a list widget type that will work nicely:

# admin/config.yml
collections:
- name: "blog"
fields:
- {label: "Tags", name: "tags", widget: "list"}

If you want editors to select from a specific set of options, the select widget type should work for you.


Eleventy will ignore Netlify CMS’ config.yml when building your site, so you’ll need to tell it to copy the file into your build directory:

// .eleventy.js
config.addPassthroughCopy("src/admin/config.yml");

Note: The actual path may vary based on your project structure.

About

My name is Sean McPherson (SeanMcP), and I am a software engineer based in Pittsburgh, PA. Here I write articles about programming for developers of all levels.