How to create a theme bootstrapped theme with custom schemas and data
If you need more control over the schcemas you can manually create them using the Built Studio Theme Designer
It's easy to create a reusable theme with custom schemas using Built Studio.
Create and configure a theme in Built Studio
In the themes workspace of Built Studio, click the "Create Theme" button. You can choose to create a theme using the Built.js CLI, which requires an OpenAI API Key, but this guide focusses on creating one manually through Built Studio. Select the "Manual Creation" option, give your theme a name and click the "Create Theme" button. Use the Theme Designer to define all the pages, sections, collections and other items for your theme.
Export the and set up the theme
Download and extract the theme zip file and follow the instructions in the README to create a Next.js project and set the configurations. This includes running npx create-built-app update to update the theme with the plugins specified in the theme.json file.
Create your theme's templates (React components)
Go to the project's components/templates directory and design each template. The section data you defined (when creating the theme in Built Studio) will be available to use in the template.
You can also use AI to create the templates by running npx create-built-app design --templates. This will create fully styled React components using the description for each template in public/data/templates.json in the AI prompt.
Publish the theme
Publish your theme to your Built Studio workspace by running:
The studio will first validate the theme to make sure it meets the basic requirements.
Learn more about a theme's lifecycle.