03 Intro to Netlify CMS for content managers - 18F/federalist-jekyll-netlify-cms-guides GitHub Wiki

What is Netlify CMS?

Netlify CMS is an open source content management system (CMS) integrated with your Git workflow. It can be combined with any static site generator for a faster and more flexible web project.

Netlify CMS provides an editor-friendly interface, including rich-text editing, real-time preview, and drag-and-drop media uploads. It also provides an intuitive workflow for content teams.

The CMS should not be confused with Netlify.com, which is a state site generator (SSG). For ChildCare.gov, Jekyll is the platform SSG. Not all Netlify sites use Netlify CMS, and not all sites using Netlify CMS are on Netlify.

Read more about Netlify CMS at https://www.netlifycms.org.

Pages and tools

Netlify CMS provides a user interface (UI) based on your content. This allows writers and editors to manage site text without needing to know any code, reducing your dependency on developers.

Netlify CMS Contents page Netlify CMS Contents page

Contents is the CMS landing page. It allows you to navigate all the content on your site. We’ll go over Workflow and Media later in the documentation.

On the top right of the above screenshot, you’ll see your GitHub profile picture. Click on this link and select Logout from the menu to log out of the CMS.

On the left, you’ll see Collections. Collections is a Netlify-specific name for types of content on your site. Netlify CMS is extensible so developers can convert more and more site content from code (they have to update) to customizable content (you can update).

We’ve identified the following most commonly updated content on ChildCare.gov:

Basic Pages covers pages with a simple title-and-text layout. This includes the About ChildCare.gov page, COVID resources page, and Disclaimers page.

Contact page in the editor and in the browser Contact page in the editor and in the browser

Consumer Ed Pages include the Learn More landing page and all of the Consumer Education pages.

Contact page in the editor and in the browser Consumer Education page in the editor and in the browser

State Resource Pages are divided into 56 states and territories. Each state has four sub-pages:

  • Understanding and Finding Child Care
  • Financial Assistance For Families
  • Health & Social Services
  • Child Development & Early Learning

State Resource page in the editor and in the browser State Resource page in the editor and in the browser

Site Navigation allows you to edit the links at the top of each page (COVID-19, Find Child Care, See your State’s Resources, and Learn More). There are a maximum of four links in this section to make sure they always fit on desktop, tablet, and mobile.

Site navigation in the editor

Site navigation in the Netlify CMS editor

Site navigation in the browser

Site navigation in the browser