An Input is an editing interface for structured data in your data files or the front matter of markup files. Inputs appear in the Data Editor, as well as in the sidebar and data panels of the Content and Visual Editors.
This article covers all keys available in CloudCannon for configuring your Inputs. For more information, please read our documentation on Inputs in general and configuring your Inputs.
All Inputs options are configured within the _inputs
key in your CloudCannon configuration file.
This key defines which inputs are available at a given level of the configuration cascade.
The following nested keys are available for each input inside _inputs
:
type
label
comment
context
hidden
disabled
instance_value
cascade
options
This key has no default. If undefined at higher levels of the configuration cascade, _inputs
will default to any values configured in the CloudCannon configuration file.
Show exampleHide example
In this example, we have configured the date_created
Date input, which will automatically populate when you create a file using this input. Editors cannot alter this input as the interface is disabled.
_inputs:
date_created:
type: datetime
label: Date of article creation
comment: UTC +0 timezone
context:
open: false
title: Help
icon: help
content: This date field will automatically populate when you create an article.
hidden: false
disabled: true
instance_value: NOW
cascade: true
options:
timezone: Etc/UTC
{
"_inputs": {
"date_created": {
"type": "datetime",
"label": "Date of article creation",
"comment": "UTC +0 timezone",
"context": {
"open": false,
"title": "Help",
"icon": "help",
"content": "This date field will automatically populate when you create an article."
},
"hidden": false,
"disabled": true,
"instance_value": "NOW",
"cascade": true,
"options": {
"timezone": "Etc/UTC"
}
}
}
}
In this example, we have configured the blog_tags
Multiselect input for the blog
Collection.
collections_config:
blog:
_inputs:
blog_tags:
type: multiselect
label: Blog type
comment: Select a blog type
context:
open: false
title: Help
icon: help
content: |
Blog tags help our users filter articles by topic.
options:
values:
- Opinion
- Feature
- Resource
{
"collections_config": {
"blog": {
"_inputs": {
"blog_tags": {
"type": "multiselect",
"label": "Blog type",
"comment": "Select a blog type",
"context": {
"open": false,
"title": "Help",
"icon": "help",
"content": "Blog tags help our users filter articles by topic.\n"
},
"options": {
"values": [
"Opinion",
"Feature",
"Resource"
]
}
}
}
}
}
}
General configuration options#
These keys configure the appearance and functionality for all input types.
This key changes the type of editing interface used for an input. Each input has a different appearance and functionality, processes and accepts different types of values, and has different configuration options.
Value can be one of the following: auto
, checkbox
, switch
, code
, color
, datetime
, date
, time
, file
, document
, image
, number
, range
, object
, array
, select
, multiselect
, choice
, multichoice
, text
, textarea
, email
, html
, markdown
, or url
.
If the type or value of an input is misconfigured, CloudCannon will display an orange warning instead of an input. If type is not configured for an input, CloudCannon will attempt to determine input type based on value or key name conventions.
This key has no default.
Show exampleHide example
In this example, we have configured the page_description
input as a markdown Rich Text Input using the type
key.
_inputs:
page_description:
type: markdown
options:
show_count: true
{
"_inputs": {
"page_description": {
"type": "markdown",
"options": {
"show_count": true
}
}
}
}
In this example, we have configured the related_links
input as a URL Input using the type
key.
_inputs:
related_links:
type: url
comment: Reference a different page
{
"_inputs": {
"related_links": {
"type": "url",
"comment": "Reference a different page"
}
}
}
This key changes the bold title text above an input.
By default, CloudCannon generate the value for from the input key name, in title case (e.g., page_title
will become "Page Title").
This key changes the subtitle text above an input. CloudCannon supports a limited selection of Markdown formatting for the value of this key: links, bold, italic, subscript, superscript, and inline code.
This key has no default.
This key enables you to define a context box for extra information about an input. The following nested keys are available:
open
title
icon
content
(required)
This key has no default.
This key determines whether the context box is open to display text content by default.
By default, this key is false
(i.e., closed).
This key determines the title of the context box.
By default, this key value is "Context".
This key determines which icon appears next to the context box title. The value must match an icon name from Google’s Material Icons list.
This key has no default.
This key determines the text content inside the context box. CloudCannon supports a limited selection of Markdown formatting for the value of this key: links, headings, bold, italic, subscript, superscript, and inline code.
This key is required for the context
object to function.
This key has no default.
This key toggles the visibility of an input in the Data Editor or the sidebar of the Visual or Content Editor. Hidden inputs are useful when you want an input to exist, but not be visible or editable outside of the Source Editor.
Value can be a boolean or a string. A boolean value of true
will hide the input.
A string value can hide an input based on the value of another input. You can reverse the value with a !
character at the beginning.
published
hides an input when the sibling inputpublished
is truthy!published
hides an input when the sibling inputpublished
is falsy
For reverse values in YAML
files, the string should be in '
or "
quotation marks.
By default, this key follows the input naming convention where key names beginning with an underscore are hidden true
.
This key toggles whether the value of an input is editable in the Data Editor or the sidebar of the Visual or Content Editor. Disabled inputs are useful if you want CloudCannon to display the input value, but prevent team members from editing the value outside of the Source Editor.
The value of this key can be a boolean or a string. A boolean value of true
will prevent team members from editing the value.
A string value can prevent team members from editing an input based on the value of another input. You can reverse the value with a !
character at the beginning.
published
hides an input when the sibling inputpublished
is truthy!published
hides an input when the sibling inputpublished
is falsy
For reverse values in YAML
files, the string should be in '
or "
quotation marks.
By default, this key is false
(i.e., team members can edit input values).
Show exampleHide example
In this example, we have configured the date_created
Date input, which will automatically populate when you create a file using this input. Editors cannot alter this input as the interface is disabled.
_inputs:
date_created:
type: datetime
label: Date of article creation
comment: UTC +0 timezone
disabled: true
instance_value: NOW
options:
timezone: Etc/UTC
{
"_inputs": {
"date_created": {
"type": "datetime",
"label": "Date of article creation",
"comment": "UTC +0 timezone",
"disabled": true,
"instance_value": "NOW",
"options": {
"timezone": "Etc/UTC"
}
}
}
}
This key determines whether an input is automatically populated with a value when the input is created. This occurs when creating a new file, or adding array items containing this input.
Valid values are UUID
or NOW
.
UUID
generates a uuidv4 key (extremely unlikely to generate duplicates), useful for identifying unique items (e.g.6ec0bd7f-11c0-43da-975e-2a8ad9ebae0b
)NOW
generates the current datetime in the Site's configured timezone
This key has no default.
This key determines whether CloudCannon should merge this input configuration with any matching, less specific configurations elsewhere in the configuration cascade.
The configuration cascade works by finding the most specific _inputs
entry. Usually, once an option is found in the cascade, there's no reason to keep looking. When this key is true
, the cascade continues looking and each entry found is merged.
This key allows you to define some options globally while using specific options for other keys at different levels of the cascade. For example, define a comment
globally, but use collection-specific label
for inputs in different collections. You can stop the cascade at any point in the configuration cascade by setting cascade
to false
.
By default, this key is true
(i.e., merges all configurations for an input in the cascade).
This key determines the configuration specific to each input type. If this key and nested keys are not defined, CloudCannon will use the default configuration options for that input type.
This key has no default.
For more information on options, please read our documentation on each input type.