Using the schema editor

You'll find the schema editor in any area where you can create or edit schemas. In this article, we'll show you the general layout of the editor and how to use it in each area of the studio.

๐Ÿ“˜

Environments

Schemas are only available to edit in their highest available environment. So, if your schema is available in production, you'll only be able to edit it in production.

Component schema

To open the component schema editor, click Components on the dashboard or the left-hand navigation. Then, click Create schema. You can also drag in a schema file or click the Upload schema button.

The JSON editor is on the left. If you upload a schema file, this will be filled with your JSON. You need to input the required fields (in this case, tasticType). This must be the same as specified when registering the React component in tastics/index.tsx.

Once you've finished writing your JSON, click the Validate and preview button. This will make sure you've entered a valid schema. It checks for all required properties, required fields for each type, correct syntax, and values match types. The preview of how it'll look in the page builder will appear on the right if it's valid.

๐Ÿ“˜

The preview can't save the information you enter in it. It's for visualization purposes only. If you want to set default information, you need to do this in the JSON.

If it's not a valid schema, errors will appear on the right and let you know what line(s) need fixing.

Click the help icon on the right of your screen to open the help section. Use the X to close it. You can copy the code examples from the help and paste them into your JSON.

You can publish your schema and download the JSON file when you've finished.

Click the back arrow on the top left of the screen to exit the editor without saving your changes.

To open an existing schema, click the name of the component and click Edit schema.

You can edit an existing schema, but be careful. A schema must always be backward and forward compatible, or it can break your site.

Click the copy icon to copy all the JSON code to your clipboard. Then, you can paste it into a new schema.

Project settings schema

To open the project settings schema editor, click Developer on the dashboard or the left-hand navigation and then click Schemas. Then click Project schema. You can also add a schema file. Click the Upload schema button to do this.

Then click Edit schema.

The JSON editor is on the left. If you upload a schema file, this will be filled with your JSON.

If you have a new project, this will be empty to start with. You can input any settings here.

Click the Validate button to check your schema is valid. If you click Publish, this will also validate your schema.

If it's not a valid schema, errors will appear on the right and let you know what line(s) need fixing.

Click the help icon on the right of your screen to open the help section. Use the X to close it. You can copy the code examples from the help and paste them into your JSON.

Click the back arrow on the top left of the screen to exit the editor without saving your changes.

Page folder schema

To open the project settings schema editor, click Developer on the dashboard or the left-hand navigation and then click Schemas. Then click Page folder schema. You can also add a schema file. Click the Upload schema button to do this.

Then click Edit schema.

The JSON editor is on the left. If you upload a schema file, this will be filled with your JSON.

You can input any settings here.

Click the Validate button to check your schema is valid. If you click Publish, this will also validate your schema.

If it's not a valid schema, errors will appear on the right and let you know what line(s) need fixing.

Click the help icon on the right of your screen to open the help section. Use the X to close it. You can copy the code examples from the help and paste them into your JSON.

Click the back arrow on the top left of the screen to exit the editor without saving your changes.