Fields for content types
Fields are the structural building blocks that make up content types. Authors fill in fields as they create a content entry, which is based on a content type.
Configure fields#
The configuration options for each base field type differ.
Asset#
The asset field collects metadata-rich images and other media that may be stored in a data resource, an external asset library, or within Uniform's asset library. It also supports inline linking to external URLs. Learn about asset utilities provided by the Uniform SDK.
tip
View the guide on media assets for a more lengthy explanation on differences between an asset and an image URL.
When adding an asset field, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'
The help text in context of a composition.Required Indicates whether setting an asset is required when the component is used. Default: false. Number of assets Specify a minimum and maximum number of assets that can be added to the selection Use as display name Setting this value to true will show the alt attribute of the first asset as the name of the entry. Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Blocks#
Blocks are used to model repeated data within an entry. They expect an array of data that's only shared in relation to something else. For example, on a site selling coffee beans you wouldn't present roasts or grind levels independent of the context of coffee beans. Learn about block utilities provided by the Uniform SDK.
To add a block field to a content type:
Create or navigate to the content type to which you want to add a block at Experience > Content Types.
In the fields section click Add field as described above.
Select Content Blocks from the list of field types.
Enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether setting a block is required when the component is used. Default: false. Number of blocks - Minimum: The minimum number of blocks to allow in the field.
Maximum: The maximum number of blocks to allow in the field. Search for a type: A field to select other content types to connect to the block field. List of content types to connect to the block field. Allowed block types A search field and available blocks are provided to find the block types you want to add. If you haven't yet created a block, you will see a message stating that there are no blocks created. You can add this field now, but it won't be useful until at least one block type is created and allowed in it. Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Checkbox#
The checkbox field type has no configuration settings. It displays a checkbox for the user along with the Field Name value.
When adding a checkbox field, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether setting a checkbox is required when the component is used. Default: false. How Uniform stores the value
{ "type": "checkbox", "value": true }Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Date#
The date parameter adds an area where authors can either enter a date (in mm/dd/yyyy format) or use a calendar selector to pick a date.
When adding an date parameter, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the parameter or its purpose. Public ID Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. Help text
A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether setting an asset is required when the component is used. Default: false. No earlier than Specify a date before which no author can set a value. No later than Specify a date after which no author can set a value. Use as display name Setting this value to true will show what's entered as the Date as the name of the entry in lists. Click Save on the bottom of the dialog to update the component configuration. To add a new parameter you can also select Save and add another option in the button dropdown.
After all component updates are complete, make sure to save the component to apply your changes.
Dropdown list#
The dropdown list lets a user select a single value from a list of options that are assigned to the parameter. It's used when you want to limit the options that are available to the user.
This field type has the following configuration settings:
When adding a dropdown list field, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Options The values that populate the dropdown list. The individual options are separated by the pipe character |.
For example, if you want the user to select from "top," "middle" and "bottom," you would use the following value:top|middle|bottom.
This field type also supports cases where the value used is different from the value the user selects from. For example, if you want the user to select from "greater than," "equal to" and "less than," but you want the selected value to be ">," "=" or "<," you would use the following value:greater than:>|equal to:=|less than:<.Required Indicates whether setting a link is required when the component is used. Default: false. Use as display name Setting this value to true will show what's selected in Dropdown list as the name of the entry within lists. How Uniform stores the value
{ "type": "select", "value": "######################" }Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Image URL#
The image URL field provides a visual preview for an image URL. Images may be uploaded to the image URL field and stored by Uniform or an external URL may be used to add an inline link to an image.
When adding an image URL field, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether setting an image URL is required when the component is used. Default: false. Validation Regex (optional) Validation logic that limits the text the user can enter. This uses the regular expression features in the user's browser. Validation Regex Message Message displayed to the user when the input doesn't match the validation regex. Only used if the validation regex is specified. Use as display name Setting this value to true will show what's entered in Image URL as the name of the entry within lists. How Uniform stores the value
{ "type": "image", "value": "https://my-website.dev/welcome.png" }note
Uniform doesn't optimize the image when rendered in Canvas. Try to keep the image file size as small as possible.
Upload images to Uniform
The Uniform image URL field always requires an image URL to function correctly. You can provide this directly from an image hosted in a remote source (such as a DAM, CMS or brand gallery), or Uniform can generate this URL for you through the upload utility.To upload an image, drag the image into the image URL field and Uniform will upload the image a Uniform server and automatically set the image URL. If you decide to change the image in the future, the previously uploaded image will be deleted. Uniform doesn't recommend copying and reusing image URLs from Uniform-hosted images across teams or projects.
Uniform serves all Uniform-hosted images through a global CDN on the domain
img.uniform.globalto ensure fast load times.note
The upload size limit is 10 MB per image.
Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
JSON data#
The JSON data field lets you store any data that's serialized in valid JSON.
When adding a JSON field, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether setting JSON data is required when the component is used. Default: false. Expected JSON schema By providing a JSON schema you can provide validation rules to specify the expected shape and value types of the field's JSON data. The JSON schema needs to follow the Draft 7 specification. Use as display name Setting this value to true will extrapolate a value from the JSON data entered as the name of the entry within lists. { "type": "object", "required": ["name", "sku"], "properties": { "name": { "type": "string" }, "sku": { "type": "string" }, "description": { "type": "string" }, "price": { "type": "number" }, "currency": { "type": "string" } }, "description": "A simple product schema" }How Uniform stores the value
{ "type": "json", "value": { /* any JSON data */ } }Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Link#
The link field lets a user create a link to a project map node, simple static URL, email address, or telephone number.
In the case of project map, the link will automatically update when the path of the node is updated by moving the node to another location in the node tree.
When adding a link field, enter the following values:
Name Description Notes Name A text box to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Types of links Types of link you can configure in the field: Project Map, URL, Email address, Telephone number. By default all types are enabled. Use as display name Setting this value to true will show what's entered in Link as the name of the entry within lists. How Uniform stores the value: Project map
{ "type": "link", "value": { "type": "projectMapNode", "path": "/path/of/node", "nodeId": "<some-id-value>", "projectMapId": "<some-id-value>" } }How Uniform stores the value: Url, email address, or telephone number
{ "type": "link", "value": { "type": "url", // or "email" or "tel" "path": "https://localhost:3000", // or "address@gmail.com" or "+45 88 88 88 88" } }How to render in React using the HREF attribute
const CtaButton = ({ label, link }) => { let href = link.path; if (link.type === 'tel') { href = `tel:${href}`; } else if (link.type === 'email') { href = `mailto:${href}`; } return ( <a href={href}>{label}</> ); }Learn more about the HREF attribute.
Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Number#
The number field lets a user enter a numeric value.
When adding a number field, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether setting a number is required when the component is used. Default: false. Integer Use this when the number is a whole number (such as 3, 17, 101, 5000). Radio button Decimal Use this when the number is a fractional number (such as 12.44, 400.00, 1044.80). Radio button Number of decimal places This controls how precise a number can the user enter. This option is only available for decimal numbers. Minimum The user can't enter a value less than this. Optional Maximum The user can't enter a value greater than this. Optional Use as display name Setting this value to true will show what's entered in Number as the name of the entry within lists. How Uniform stores the value
{ "type": "number", "value": "####.##" }tip
Notice that the value is stored as a string, not as a number.
Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Rich text#
With the rich text field, users can apply various formatting options such as heading levels, bold, italics, underline, strike through, and more to emphasize specific words or phrases. Additionally, it supports the inclusion of hyperlinks (both static and project map), bullet points, and numbered lists.
When adding a rich text field, enter the following values:
Name Description Notes Name A text area to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't change once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether setting a link is required when the component is used. Default: false. Allowed controls Controls which formatting and element options are available to users. By default all options are enabled. 
The allowed controls available in rich text.Use as display name Setting this value to true will show what's entered in Rich text as the name of the entry within lists. How Uniform stores the value
{ "type": "richText", "value": { "root": { "type": "root", "children": [] } } }Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Text#
The text field lets a user enter a simple text value.
When adding a text field, enter the following values:
Name Description Notes Name A text field to enter a descriptive name for the field or its purpose. Required Public ID Name that uniquely identifies the field. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. Required Help text
A user is responsible for setting a value on the field. This text appears below the user-interface available for setting the field value.
The user interface for setting the value on a text field with help text set to 'Enter a short description of the event.'The help text in context of a composition.Required Indicates whether the value is required when the component is used. Allow multi-line text If selected, the user enters the text into a multi-line text box. Multi-line text is saved in a string with the line-break character \nused to separate lines.Text input size Directs the line height of the entry field. Only available when the allow multi-line text option is enabled. The options are: - Small (2 lines)
- Medium (5 lines)
- Large (10 lines)*
Number of lines Enter or use the up and down arrows Only available if the user selects Custom text input size. Validation Regex (optional) Validation logic that limits the text the user can enter. This uses the regular expression features in the user's browser. Test If a value is entered it's checked against the validation regex. Validation Regex Message Message displayed to the user when the input doesn't match the validation regex. Only used if the validation regex is specified. Use as display name Setting this value to true will show what's entered in Text as the name of the entry within lists. How Uniform stores the value
{ "type": "text", "value": "######################" }Click Save on the bottom of the dialog to update the content type configuration. To add a new field you can also select Save and add another option in the button dropdown.
After all the content type updates are complete, make sure to save the content type to apply your changes.
Group fields#
Component fields may be grouped to help cluster related ideas together in the Canvas editor. For example, you may collect fields for meta title and meta description in a group called "Meta data."
To create a field group, navigate to Experience > Content Types and select the appropriate content type in your project.
Click the tab Fields.
Click the chevron on the Add field button to open the menu.
Select “Add field group”
Enter the following values:
Field Description Name The group name will be displayed in the canvas editor. it's the only label visible when the group is collapsed. Is collapsed by default? If checked, the group will be collapsed by default. If unchecked, it will be expanded by default. Editors can always expand or collapse the group in the canvas editor. Default: checked Click Save to save the field group.
After all the content type updates are complete, make sure to save the content type to apply your changes.
A group of fields in the content type.Fields can be added to the group by dragging and dropping them into the group. Groups can also be rearranged in the same way. The order shown in the table is the order they will be displayed in the entry.
note
Placing a field in a group doesn't modify the API response from Uniform.
Delete a field#
In your project, navigate to Experience > Content Types and select your component.
Click the tab Fields.
Click > Delete.
Delete fields from your content type.Click Save to save the changes to the component.
About this step
If the deleted field is used in any composition, when you
select the field in an entry you will see a warning
about "orphan field data." This tells you that Uniform is storing a value for a field that's not defined in the content type. You must remove this value before you are able to save any changes to the entry.
Click Remove to remove this value from the entry.