Choose your preferred SSG:
Choose your preferred SSG:

All Articles

Accessing and configuring your invoices Learn how to access and configure your invoices in CloudCannon.
Add Files with Direct Upload Learn how to directly upload files to your static site with CloudCannon.
Add Project Links to make common tasks even quicker Learn how to add Project Links to your CloudCannon project dashboard. You can use these to navigate to external resources, or often-used parts of the app.
Adding i18n to your site for global audiences Make your website more accessible to an international audience.
Adding password authentication to your site Require a password to access your site.
Adding SAML authentication to your site Restrict access to your site by using a third-party login service.
Adding user account authentication to your site Restrict access to your site to a set of users you invite.
Adding your brand to your CloudCannon account Learn how to make your CloudCannon account feel like home by adding your own custom branding.
Adjusting the uploads path Uploads paths are locations where new asset files are uploaded to within the editor. They also defines the default location when selecting existing files. There are a number of placeholders available to aid in organization.
Allowing users to logout from your site Provide a logout button on your authenticated pages.
Structures reference A list of key options for using Structures.
Building a site with a template Explore the CloudCannon CMS with one of our simple templates.
Caching Gem installs to reduce build times To save time on consecutive builds, CloudCannon can cache Gem installs.
Caching specific folders to reduce build times Learn how to choose specific files and folders to cache between builds with CloudCannon. This can let you bypass install steps, speeding up subsequent builds.
Changing how cards preview your data CloudCannon uses configurable cards to represent your data in different places across the app
Changing your SSG CLI options Most static site generators offer a number of configuration options for use on the command line. Configure these and other CloudCannon-specific build options per site.
Choosing the editors for each file Select the preferred editor and additional editors available to your team members for each file.
Choosing where to create new files When you create a file for a collection in CloudCannon, it is saved at a path generated from a configured pattern. These patterns are called "Create Paths". Create Paths are templates with a mixture of literal text and placeholders. You can use this to organize where your content files are stored as your team members create them.
Choosing which pages require authentication on your site Auth routes allow you to specify the routes you want to be authenticated and keep the rest public.
Choosing your SSG to start your build CloudCannon sites can be configured to build using Jekyll, Hugo, Eleventy, Next.js, Static, or Other. Support for Nuxt.js is currently in private beta. Contact support if you would like to join the beta.
Configuring the Source Editor Learn how to change the appearance and behavior of the Source Editor in CloudCannon to fit your preferences.
Configuring Custom Routing Configure your CloudCannon's hosting by configuring a single json file.
Configuring Extensionless URLs Extensionless URLs do not end with a trailing slash or a file extension.
Configuring your CMS Learn about the three primary ways to configure your CloudCannon CMS.
Configuring your Markdown engine To store and edit Markdown content in CloudCannon, we need to process it into HTML to make it editable. CloudCannon supports the CommonMark and Kramdown specifications. The implementations for these are markdown-it (JavaScript) and kramdown (Ruby).
Connecting a Bitbucket repository as your source Learn how to connect a Bitbucket repository to your site with CloudCannon.
Connecting a GitHub repository as your source Learn how to connect a GitHub repository to your site with CloudCannon.
Connecting a GitLab repository as your source Learn how to connect a GitLab repository to your site with CloudCannon.
Connecting a self-hosted GitLab repository as your source Learn how to connect a self-hosted GitLab repository as your source with CloudCannon.
Connecting your first site Learn how to connect your existing site to CloudCannon.
Connecting your site to an Inbox Connect forms on your site to an Inbox.
Creating a Cloudinary DAM No description.
Creating custom 404 pages Create your own 404 page to blend in with the rest of your site.
Creating a Google Cloud Storage DAM No description.
Creating a new Organization Learn how to create a new Organization in CloudCannon.
Setting up git workflows and branching sites Learn how you Git-based workflows in the CloudCannon CMS
Creating a Tenovos DAM Connect Tenovos to CloudCannon and allow editors to choose files from your DAM
Creating an Azure DAM No description.
Creating an Inbox to receive your forms Create an Inbox to receive your form submissions.
Creating an S3 DAM No description.
Creating backups of your source files Learn how to create backups of your source files with CloudCannon.
Creating collection schemas Learn how to create collection schemas for managing content across files in a collection.
Custom SSL certificates for your sites hosted on CloudCannon Learn how to add custom PEM-encoded SSL certificates.
Customizing CloudCannon to match your brand Learn how to customize CloudCannon to match your brand.
Defining editable regions in your HTML Editable Regions let you edit parts of your HTML visually and with live updates.
Defining more ways to add new files Learn how to create or change actions for the add menu in the collection file list.
Supplying the initial contents for new files Learn how to provide initial front matter and/or content for new collection files in CloudCannon.
Defining what adds to an array Array add values allow you to define which keys in your data should be arrays, what data should be added when 'Add' is clicked, and how the editor can decide what item to add.
Defining your collections Collections allow you to show groups of related content in the Site Navigation. Each collection corresponds to a folder in your site files. Navigating to a collection shows a preview of each file and allows your editors to see all the content at a glance.
Defining your data Defining data allows you to populate select and multiselect inputs. Each data set corresponds to a file or folder in your site files.
Defining your SSG version It's good practice to specify which version of your static site generator you use, to avoid errors and unexpected behavior. CloudCannon offers different methods to manage this based on which generator you use.
Detecting when your site is loaded in the Visual Editor You can define situations where you want to show content to editors when they’re in the Visual Editor, but not show it on the live site.
Disabling authentication on your site How to turn off authentication for your CloudCannon site.
Disabling editor publishing Learn how to disable editor publishing with CloudCannon.
Editing markdown in the Visual Editor Learn how to edit your markdown files as they would appear on your live site, with CloudCannon.
Using Object Inputs to edit your data Object inputs in your data show as a button in the data editor. This button opens a new editor to the side, showing the inputs inside that object. This continues as you click into nested Object inputs. Each object level has a back button to return to the parent scope.
Editing with Eleventy Snippets Learn how to add and edit Snippets in the content of your Eleventy website via CloudCannon.
Editing with Hugo Shortcodes Learn how to add and edit shortcodes in the content of your Hugo website via CloudCannon.
Editor merging and pull requests with publishing Learn how to merge and create and review pull requests with publishing workflows on CloudCannon.
Enabling editor branching with Projects Learn how to group multiple sites from the same repository together with CloudCannon.
Linking to CloudCannon views Editor links allow you to link to other sections of the CloudCannon interface from within the Visual Editor. Use them to create edit buttons for your collection items and blog posts to quickly navigate the app. You can also add front matter Editor links to open the front matter Editor at specified fields.
Extending your build process with hooks Bash scripts that run at different stages in the build to extend the functionality of your sites. There are three hooks available: Preinstall, Prebuild, and PostBuild. All three are configured using extensionless script files.
Introduction to forms on CloudCannon A brief introduction to forms on CloudCannon.
Giving clients access to update a site Learn how to share a site with your clients without them needing to create a CloudCannon account.
Hosting your sites Learn about your options for hosting a site with CloudCannon.
Hosting your site on a custom domain Attach your own domain to a site on CloudCannon.
Hosting your site on a subpath Attach your site to the subpath of another site on CloudCannon
How CloudCannon handles failed payments After a failed payment, we try to give you plenty of time to set up a new payment method.
Customizing your inputs in the Data Editor The Data Editor uses a wide range of different inputs. Each input corresponds to a field in your front matter or data file, providing an editing interface for those values. Inputs have a type, label and a comment.
How to pay for CloudCannon We currently accept Visa and Mastercard credit cards for payment for paid plans and invoicing on Enterprise plans.
How do I use a custom Gemfile with Jekyll? Change your default gem source.
Working with your team and clients Learn how to add your team members to CloudCannon, and share editing with those outside of your team.
HTTPS support for your sites hosted on CloudCannon Secure your site with SSL.
Hugo Starter Guide This guide will walk through the steps required to get your Hugo site built, editable and live on CloudCannon.
Including git folder in your build No description.
Integrating your DAM with CloudCannon Learn how to connect your DAM to your sites in CloudCannon
Integrating your forms with Process your form submissions using bots.
Integrating your forms with email Receive your form submissions by email.
Integrating your forms with IFTTT Process your form submissions with IFTTT applets
Integrating your forms with Make (formerly Integromat) Process your form submissions using Make scenarios.
Integrating your forms with Slack Send your form submissions to a Slack channel.
Integrating your forms with Zapier Process your form submissions with Zapier zaps.
Integrating your site with CloudCannon Integrating a site in CloudCannon means getting your data and content to an editable state. A good starting point for this process is completing a successful build.
Introducing the Content Editor Use CloudCannon's Content Editor to give your whole team a straightforward and intuitive editing experience.
Introducing the Data Editor Easily manage the content of YAML, TOML, JSON, CSV, and TSV files.
Introducing the site dashboard A breakdown of the main sections of a site.
Introducing the Source Editor A code editor in the browser.
Introduction to Visual Editing Visually navigate and edit the content on your site.
Introducing your site navigation Learn about to get around with your site navigation in CloudCannon.
Introduction to Assets and DAMs What is a DAM and how do they apply to CloudCannon?
Keeping content consistent across files in a collection Learn how to keep content and data consistent across multiple files in a collection.
Visual data previews with Svelte Data previews on CloudCannon with Svelte. Edit Front Matter and see the changes show up live.
Managing your connected DAMs Learn how to update the details of your connected DAMs
Managing your Node.js version with nvm CloudCannon uses the LTS (v16.13.0) version of Node.js by default. You can use nvm to select which node version to use with your build.
Managing your Ruby version CloudCannon supports Ruby versions using rbenv. Jekyll sites without the version specified default to version 2.7.x.
Managing your team members After creating an Organization, your account is set up as the owner. There are 4 main types of users in an Organization.
Netlify Hosting with CloudCannon Editing Connect CloudCannon and Netlify to the same Git repo to enable both CloudCannon editing and Netlify builds and deployment.
Next.js starter guide This guide will walk through the steps required to get your Next.js site built, editable and live on CloudCannon.
Optimizing your build by minifying CSS and JavaScript CloudCannon optimizes sites to load as fast as possible. CloudCannon minifies CSS with clean-css and JavaScript with esbuild. Externally hosted assets are not optimized.
Syncing build files from CloudCannon to an external provider Configure a Build Deploy to commit the built version of your site to a repository.
Post processing Configure CloudCannon processes that run after your site builds.
Pre-configure your site before creation on CloudCannon Learn how to pre-configure your site with code, before uploading it to CloudCannon.
Disable CloudCannon window global in the Visual Editor CloudCannon injects an object onto the window object when viewed in the Visual Editor. This article will show how to turn off this behavior.
Recovering access to your organization Resolve Organization ownership conflicts.
Reducing spam by adding Google reCAPTCHA Protect form submissions from automated spam.
Reducing spam by adding hCaptcha Protect form submissions from automated spam.
Resolving ownership over a custom domain When resolving ownership issues, we do our best to protect all parties involved during these processes. If we are asking for proof of ownership, it is well-intentioned.
Saving files from your build back to your source You can configure CloudCannon to commit built/generated files back to your source repository. This ensures that any generated files are consistent between CloudCannon and your source repository.
Scheduling your builds manually Manually scheduled builds are configured in the CloudCannon UI. They are useful for regular period builds or one-off future builds.
Scheduling your next build automatically After building your site, CloudCannon will read your _schedule.txt file and automatically configure a build at the specified time.
Setting global configuration Global configuration for your site is read from a file. The configuration is the mostly the same across SSGs with some minor differences.
Setting up a publish branch with merging or pull requests Learn how to set up a publish branch with merging or pull requests, with CloudCannon.
Sharing on a per-site basis Share a site with others by creating Collaborators.
Transferring sites between Organizations Transfer the ownership of a site to another Organization.
Unlisting files in a collection Hide specific files in a collection so your team members don't accidentally edit them. These files are still used in your site build.
Using a modal with Structures A modal with search, tagging, and bigger images is available when the number of structures you add becomes far too many to manage with a dropdown.
Using Array Inputs to edit your data These inputs are for editing ordered lists of values in your data. Array inputs are grouped lists of inputs in the data editor. They are used for a wide range of use cases, ranging from small text lists to full component builders.
Using Arrays for a gallery Learn how to set the structure for new items in a gallery array.
Using Bearer Tokens to authenticate with your site Require a secret token in your request headers to authenticate the request.
Using Boolean Inputs to edit your data These inputs are for editing true/false values in your data. They can be triggered on or off.
Using CloudCannon DNS to configure your custom domain A fast, scalable DNS service automatically configured for your site.
Using Code Inputs to edit your data Code editor input for blocks of code or mono-space plain text.
Using Color Inputs to edit your data Color picker input with spectrum and transparency controls for editing color values in your data.
Using Date and Time Inputs to edit your data These inputs are for editing date and time values in your data.
Using External DNS to configure your custom domain Use your own DNS servers.
Using geolocation to detect your user's country Customize content based on the location of the visitor.
Using Git LFS Git LFS is used to store large files outside your repository, but use continue using them as if they were part of it. It's a great way to maintain a small repository size for faster syncing and builds, while keeping the external services you rely on the same.
Visual data previews with React Live editing on CloudCannon with React. Edit Front Matter and see the changes show up live.
Visual data previews with vanilla JavaScript Live editing on CloudCannon with vanilla JS. Create your own live previews by hooking into document events.
Using Number Inputs to edit your data These inputs are for editing numerical values in your data.
Using Rich Text Inputs to edit your HTML and Markdown data These inputs give your editors ultimate control by allowing them to write markup directly into your data files.
Using Select inputs to edit your data These inputs are for values from a fixed or dynamic set of options. Useful for linking across pages, collections and data sets.
Using Social Inputs to edit your data These inputs are for editing plain text in your data. Each input includes a specific brand icon.
Using Single Sign On to create team member accounts Enforce Single Sign On for your team members and increase security by using CloudCannon with SAML.
Using Text Inputs to edit your data Details for setting up and using different types of plain text inputs for editing your data.
Using the configuration cascade CloudCannon offers different configuration options for each input and editor. Use this to improve the editing experience for your sites. Configuration can be set from a number of sources, from lowest priority to highest.
Using file path inputs to edit your data These inputs allow editors to upload new files, select existing images, or link to external files.
Using URL Inputs to edit your data Single line input for relative, absolute and fully qualified URLs. URL inputs show a preview of the target.
Viewing your form submissions in CloudCannon View all your form submissions in CloudCannon.
Viewing your site on a testing domain Every site on CloudCannon has a matching URL. Use this to test on a live site, without having to set up your own domain.
Visual Data Bindings with Bookshop Bookshop will automatically add data bindings when live editing in CloudCannon
Visual data bindings with React React allows you to add the `data-cms-bind` attribute on any DOM element
Visual data previews with Bookshop TODO
What are visual data bindings TODO
What is an Organization Organizations help you organize your team, sites and resources in one place.
What is CloudCannon? An overview of the benefits of building static sites on CloudCannon.
What are visual data previews Live editing on CloudCannon lets your editors see exactly what they are changing as they change it.
What version of Go is used in the build environment Currently, the only installed Go version is 1.15.7-linux/amd64.
Why CloudCannon injects width and height onto images CloudCannon automatically adds size attributes (width, height, sizes) to the HTML for images uploaded in the Content Editor and Editable Regions.
CloudCannon link protocol CloudCannon links are a custom protocol that allows you to deep link into CloudCannon.
Creating a form for your site on CloudCannon Create forms on your site and send the submissions to an email address or integrate with your own workflows.
Deprecated 301.txt Redirects 301.txt redirects are deprecated, use routing.json to configure this with more options.
How do I manage the build plugin manually? By default, CloudCannon injects the eleventy-plugin-cloudcannon package into your site. If defaulty setting clashes with your build, you can manage this manually.
Integrating your forms with Integromat Process your form submissions using Integromat scenarios.
Legacy form documentation Create forms on your site and send the submissions to an email address or integrate with your own workflows.
Legacy Forms migration guide A guide to migrating from legacy CloudCannon forms to the new CloudCannon forms
Migrating to global configuration files How you set global configuration in CloudCannon has changed. We recommend updating, but the previous configuration will continue to work. CloudCannon now uses specific files rather than relying on your SSG configuration files.
Migrating to input configuration How you configure inputs in CloudCannon has changed. We recommend updating, but the previous configuration will continue to work. There's now a consolidated key that encompasses our previous keys.
Patching YAML number parsing for Jekyll No description.
Reading form submissions in your inbox Once you have correctly added a form to your site, you can view responses in the CloudCannon inbox.