g.ssgs.includes(selected_name))[0] ?? null; " class="c-docs-ssg-callout" x-data="{"guides":[{"url":"/documentation/guides/jekyll-starter-guide/","id":"jekyll-starter-guide","image":"/documentation/static/ssgs/jekyll.svg","title":"Jekyll Starter Guide","description":"Learn how to set up your website on the CloudCannon Jekyll CMS.","ssgs":["Jekyll"]},{"url":"/documentation/guides/astro-starter-guide/","id":"astro-starter-guide","image":"/documentation/static/ssgs/astro.svg","title":"Astro Starter Guide","description":"Learn how to get your website set up on the CloudCannon Astro CMS.","ssgs":["Astro"]},{"url":"/documentation/guides/gatsby-starter-guide/","id":"gatsby-starter-guide","image":"/documentation/static/ssgs/gatsby.svg","title":"Gatsby Starter Guide","description":"Learn how to set up your website on the CloudCannon Gatsby CMS.","ssgs":["Gatsby"]},{"url":"/documentation/guides/docusaurus-starter-guide/","id":"docusaurus-starter-guide","image":"/documentation/static/ssgs/docusaurus.svg","title":"Docusaurus Starter Guide","description":"Learn how to get your website set up on the CloudCannon Docusaurus CMS.","ssgs":["Docusaurus"]},{"url":"/documentation/guides/sveltekit-starter-guide/","id":"sveltekit-starter-guide","image":"/documentation/static/ssgs/sveltekit.svg","title":"SvelteKit Starter Guide","description":"Learn how to set up your website on the CloudCannon SvelteKit CMS.","ssgs":["SvelteKit"]},{"url":"/documentation/guides/nextjs-starter-guide/","id":"nextjs-starter-guide","image":"/documentation/static/ssgs/nextjs.svg","title":"Next.js Starter Guide","description":"Learn how to set up your website on the CloudCannon Next.js CMS.","ssgs":["Next.js"]},{"url":"/documentation/guides/eleventy-starter-guide/","id":"eleventy-starter-guide","image":"/documentation/static/ssgs/eleventy.svg","title":"Eleventy Starter Guide","description":"Learn how to get your website set up on the CloudCannon Eleventy CMS.","ssgs":["Eleventy"]},{"url":"/documentation/guides/nuxt-starter-guide/","id":"nuxt-starter-guide","image":"/documentation/static/ssgs/nuxtjs.svg","title":"Nuxt Starter Guide","description":"Learn how to set up your website on the CloudCannon Nuxt CMS.","ssgs":["Nuxt"]},{"url":"/documentation/guides/universal-starter-guide/","id":"universal-starter-guide","image":"/documentation/static/hand.png","title":"Universal Starter Guide","description":"Learn how to get your website set up on the CloudCannon CMS.","ssgs":[]},{"url":"/documentation/guides/mkdocs-starter-guide/","id":"mkdocs-starter-guide","image":"/documentation/static/ssgs/mkdocs.svg","title":"MkDocs Starter Guide","description":"Learn how to set up your website on the CloudCannon MkDocs CMS.","ssgs":["MkDocs"]},{"url":"/documentation/guides/hugo-starter-guide/","id":"hugo-starter-guide","image":"/documentation/static/ssgs/hugo.svg","title":"Hugo Starter Guide","description":"Learn how to get your website set up on the CloudCannon Hugo CMS.","ssgs":["Hugo"]}],"selected_name":null,"guide":null}" x-init=" selected_name = $store.conditionals.selected('ssg-name'); guide = guides.filter(g => g.ssgs.includes(selected_name))[0] ?? null; " x-show="guide">
You're currently viewing the universal guide, but a more specific guide exists for .
Check out the for a tailored onboarding experience.
How strict is your SSG about organizing your site’s content?
Some SSGs, like Jekyll, Hugo, Astro, and Eleventy, have strong opinions about how to organize the content in your repository. CloudCannon can run automatic processes on these SSGs and provide basic editing out-of-the-box. Other SSGs take a less opinionated approach, allowing you to decide where and how content is stored.
SSGs with strict organizational structure naturally integrate with CloudCannon’s editing concepts. For less strict SSGs, you will need to configure CloudCannon to match your content structure. We will configure other editors later in this guide.
CloudCannon organizes data using two main ideas:
- Data — These are standalone data files. This is ideal for site configuration or files that don’t need to be repeated. Data is edited by altering a single file.
- Collections — A collection is a single folder of files with a repeated format. For example, a collection might include pages, blogs, staff members, or recipes that share a format. Collections are edited by altering any file or adding more files.
CloudCannon supports a set of file formats for files in Data or Collections:
- Structured data files: JSON, YAML, TOML, CSV, TSV
- Markup files: HTML, Markdown, MDX
- Combination files: HTML with front matter, Markdown with front matter, MDX with front matter
Front matter refers to a section at the top of a markup file that contains structured data. CloudCannon supports JSON, YAML, and TOML front matter. Markdown comes in many flavors, so be sure to check out configuring your Markdown engine.
If you need another supported format, get in touch with our support team, and we would be happy to look into it.