Recent searches

in

What is a Code input?

Last modified: November 6th, 2026

On this page

A Code input is an editing interface for code or mono-spaced plain text. You can use this input in the Data Editor, Content Editor, or Visual Editor to edit structured data in data files or front matter.

There is only one type of Code input:

  • Code

Code input types#

Code

The Code input provides an editing interface for code or mono-spaced plain text content.

You can edit the value of a Code input by typing in the code area.

A screenshot of the Code Input in the Data Editor shows code in a text area with syntax highlighting.
The Code input

Code input appearance and behavior#

You can customize the label, comment, documentation link, and context box for all inputs regardless of type.

A screenshot of the Code Input in the Data Editor with a Context Box underneath the code area.
Code Input with Context Box

Depending on how your developer configured the input, your Code input may have a different height for the code area, tab size, theme color, gutter visibility, or syntax highlighting.

A screenshot of the Code Input when configured to show a single line of text.
Single Line Code Input
A screenshot of the Code Input in the Data Editor shows a theme color applied to the text area.
The Code Input with a theme applied

Input validation

Your Code input may have input validation, which requires the input value to meet predefined criteria before you can save your changes. CloudCannon will warn you if your input value is invalid and provide directions on how to fix it.

CloudCannon will show a red * next to the name of your Code input if a value is required.

A screenshot of the Code input in the Data Editor shows that no value is causing an input validation error.
Code Input with required value

If you enter a value under the minimum or over the maximum character count, CloudCannon will display an error message in red text under the input field.

A screenshot of the Code Input in the Data Editor shows an error message as the value is too few characters.
The Code Input with a minimum length error

If your developer has configured a pattern for your input value, CloudCannon will warn you when the value does not match the pattern. CloudCannon will show any error messages underneath the code area in red.

A screenshot of the Code Input in the Data Editor shows an error message as the value does not match the configured pattern.
The Code Input with a pattern error

For more information on configuration options, valid input values, and unconfigured input behavior, please read our developer documentation on configuring a Code input .

Misconfigured Code inputs#

You will see an orange warning box if your Code input is misconfigured.

A screenshot of a misconfigured Code input in the Data Editor shows an orange warning box.
A misconfigured Code Input

Code inputs are misconfigured if:

  • The value is not a string.

For more information on how to fix a misconfigured Code input, please read our developer documentation on configuring a Code input.

Related Resources

Open in a new tab