How to Get Started with Decap CMS

Updated

Decap CMS is an open-source, Git-native content management system for static sites. You get started by adding it to a Git-backed static site project, configuring it with a single config.yml file, and pointing it at your repository. The official docs and an interactive demo are the two fastest ways to understand the setup before you commit to a configuration.

What you need before starting

Decap CMS is designed for Git-backed static and Jamstack architectures. Before configuring it, confirm you have:

  • A static site project (the site lists Hugo, Next.js, Gatsby, and Jekyll workflows as supported examples)
  • A Git repository hosted with a major Git provider
  • The ability to add a config file and an admin entry point to your project

The site describes setup as "simple and free," and Decap CMS is MIT-licensed and self-hosted. Pricing details beyond "free and open source" are not specified on the page, so treat hosting and any third-party service costs as separate from the CMS itself.

Step 1: Read the documentation

The primary entry point is the docs, linked from the homepage as "Go to docs." The docs cover installation and configuration, including how to define collections, fields, workflow rules, and media handling. Because the entire CMS is configured through one config.yml file, the docs are where you map your content model to Decap's declarative config.

Step 2: Try the interactive demo

The homepage offers a "Try the interactive demo" link. Use it to see the editing experience before wiring anything up. Note the site's own caveat: the homepage image "is a representation and not how the actual Decap CMS looks like," so rely on the demo rather than marketing imagery to judge the editor UI.

Step 3: Configure the CMS

Decap's configuration is declarative and lives in a single YAML file. In it you define:

  • Collections — the content types your editors manage
  • Fields — structured inputs, rich text, and relation fields
  • Nested structures and slug behavior — so the content model matches your project instead of a rigid schema
  • Workflow rules — the draft, review, and publish statuses
  • Media handling — how assets are stored and referenced

This is the step where Decap's "flexible content modeling" matters most: you shape the config to your project rather than adapting your project to the CMS.

Step 4: Set up the editorial workflow

Decap includes an editorial workflow for draft, review, and publish. Content moves through clear statuses before publication, so teams can keep quality controls without adding a separate workflow tool. The editor UI provides structured fields, rich text, and live preview so non-technical contributors can work with confidence.

Step 5: Choose the setup that fits you

The homepage frames setup around roles — developer, editor, team, and agency — and the "Choose the setup that fits you" section lets you prioritize features by perspective. Match your configuration to how the project will actually be used:

If you are… Prioritize
A developer Git-native history, single-file YAML config, extensibility
An editor Friendly editor UI, real-time preview, clear draft/review/publish statuses
A team Editorial workflow, version history, deployment checks in one system
An agency Flexible content modeling, custom widgets, multi-project reuse

Extending beyond the defaults

When default behavior isn't enough, Decap supports custom widgets (shortcodes), editor components, and plugins. This is the path to take if your editorial UX needs to diverge from the standard field types.

Common sticking points

  • Assuming the CMS stores content in its own database. It doesn't — content stays in your Git repository with full version history and branch workflows.
  • Expecting a hosted backend. Decap is self-hosted and open source; you own the deployment.
  • Judging the editor from the homepage image. Use the interactive demo instead.

Where to go next

Start with the docs for installation and configuration, run the interactive demo to validate the editing experience, then write your config.yml around your actual content model. If you need behavior the defaults don't cover, move on to custom widgets and editor components.