O’Reilly Report: Decoupled Applications and Composable Web Architectures - Download Now

Empower your teams & get a 582% ROI: See Storyblok's CMS in action

Skip to main content

Conditional Fields

Plan Limit:

Conditional Fields are available in the Enterprise Plans.

When working on a component schema in Storyblok, it is possible to encounter situations where the schema becomes crowded with a large number of fields or where the value of a field renders another field irrelevant.

1
2
3
NameTypeOptions
Conditional SettingsDropdownIf all of the following conditions are true, or if any of the following conditions are true
ActionsDropdownHide, Required, or Not required

Once the condition settings configured and an action type has been selected, it is possible to add conditions. It is also possible to add multiple conditions if needed.

NameTypeOptions
Choose a fieldDropdownAny fields from the same block would be available for selection
Condition Validation TypeDropdownEmpty, Not Empty, Is equal to, Is not equal to, Is greater than, or Is less than

To better understand this concept, here's an example scenario.


The above image shows a component named Test Component which consists of several fields. The component has two optional fields, as well as a specific field that is required depending on the value of another field.

When this component is incorporated into any of the stories now, it will create the appearance that all fields are visible.

To enhance the experience for content creators, conditional fields can be utilized. To begin, the required_if_title_is_empty field can be set as required. To do this, go to the Edit Field tab of the field and apply the condition as depicted in the image below.

1
2
3
4
5

In regards to the two optional fields, the conditions can be incorporated as depicted in the image provided below.

1
2
3
4
5

Once all the above steps have been followed, incorporating this particular component into any story will result in the following appearance.