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.

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.

Data sources schema

To open the data source schema editor, click Developer on the dashboard or the left-hand navigation and then click Data sources. 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, customDataSourceType). The customDataSouceType must be the same as the data source extension key in backend/index.ts.

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.

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.

Dynamic page schema

To open the dynamic page schema editor, click Developer on the dashboard or the left-hand navigation and then click Dynamic pages. 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, dynamicPageType). The fields provided in the editor are the only fields you can add in a dynamic page schema.

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.

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.

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.


Did this page help you?