Future recommendations: Netlify CMS features - 18F/federalist-jekyll-netlify-cms-guides GitHub Wiki

Netlify CMS features to implement

The following are available features that would require collaboration with your developers. We recommend enabling these features based on your future workflow.

Nested collections

https://www.netlifycms.org/docs/collection-types#nested-collections-beta

Each collection displays in the left sidebar of the Content page.

Nested collections is a Netlify beta feature that allows a folder collection to show a nested structure of entries and edit the locations of the entries. This feature is useful when you have a complex folder structure and may not want to create separate collections for every directory. As it is in beta, please use it with discretion.

Custom roles

https://github.com/HHS/childcare-gov/settings/role_details

In addition to adding roles and managing permissions, GitHub allows you to create custom roles. This feature allows you to customize views and actions granted to members and teams in your organization.

Open authoring

https://www.netlifycms.org/docs/open-authoring/

On the Editorial Workflow screen, the normal three columns are replaced by two columns instead — Draft and Ready to Review. Once you’re ready to submit your changes, you can move the card into the Ready to Review column to create a pull request. Open authoring users cannot publish entries through the CMS. This allows users to contribute changes without having write access to the repository.

Custom real-time preview

https://www.netlifycms.org/docs/customization/

Netlify CMS allows developers to register a custom CSS stylesheet and HTML template with a collection. Exposing these to the preview pane allows content managers to see their content changes in real-time – just as they would appear on a published page.

Custom widgets

https://www.netlifycms.org/docs/custom-widgets/

Ideally, developers can convert Kramdown styles into custom What You See Is What You Get (WYSIWYG) widgets. This would allow a content manager to choose between an external link and a normal link without using any code.

i18n Support

https://www.netlifycms.org/docs/beta-features/#i18n-support

The CMS can provide a side-by-side interface for authoring content in multiple languages. Configuring the CMS for internationalization (i18n) support requires top level configuration, collection level configuration, and field level configuration.

Image widget file size

https://www.netlifycms.org/docs/beta-features#image-widget-file-size-limit

You can set a limit as to what the maximum file size of a file is that users can upload directly into an image field.

Collection media folders

https://www.netlifycms.org/docs/beta-features/#folder-collections-media-and-public-folder

By default, the CMS stores media files for all collections under a global media_folder directory as specified in the configuration. However, developers can configure media files to be saved in the same directory as the entry, and the image field can be populated with the relative path to the image.

NetlifyCMS custom previews

A few of the collections within Netlify CMS would greatly benefit from having a custom preview created for them. Previews by default in Netlify CMS render all of the fields/widgets that are assigned to the collection, which can create busy and/or confusing-looking previews for content folks.

The NetlifyCMS UI while editing a consumer education page with preview enabled

The NetlifyCMS UI while editing a consumer education page with preview enabled

In the screenshot above, the Child Care Options page is being edited. The editor UI (left side) is showing all of the fields that are defined inside the collection as being editable. The Consumer Education pages are special because they contain information inside their Markdown files that’s used to display data on two different pages. This leads to the potentially confusing preview you’ll see on the right side — the preview is showing values from all of the configured fields when ideally it would only render the fields that you’d see on the page that lives at the permalink. This is where custom previews are great.

The other page that gets information to display from the Child Care Options page is the Consumer Education page. The title, image, and description for the Child Care Options tile all come from the Markdown document that is being edited in the screenshot above.

A custom preview can be created to help eliminate the confusion. The custom preview would not render the permalink, section name, sort order, Learn More description, or Learn More image because those fields represent information for another page.

Check out the Netlify CMS custom preview docs to get started.