Comment on page
Schema
No-code customisation for your template directly from within the creator panel.
A template schema allows other team members or consumers of your template to change its appearance, for example providing colour pickers to change the colours of your template without the need to edit the CSS or HTML manually. This is especially useful if you are a template designer and you're selling access to your custom template for many different stores to use.
To edit the schema of a template, first open the template editor and select the Change Schema page from the navigation on the left. Any config options you add within the schema will appear within the Appearance section of the creator panel when you click edit on the template.
{
"author": "Tebex",
"support_email": "[email protected]",
"config": [
{
"header": "Customize Template",
"options": [
{
"id": "nav-style",
"name": "Navigation Style",
"description": "Set the location for your navigation.",
"type": "select",
"default": "Vertical Nav in Sidebar",
"values": [
"Horizontal Nav in Header",
"Vertical Nav in Sidebar"
]
},
{
"id": "server-ip",
"name": "Server IP",
"default": "",
"description": "Enter your server IP - it will be used in the copy server IP section.",
"type": "textarea"
},
{
"id": "discord",
"name": "Discord",
"default": "",
"description": "Enter your Discord invite url - it will be used in the header Discord section.",
"type": "textarea"
}
]
}
]
}
You're able to implement several different types of config options within your template schema, from colour pickers to text boxes.
Display a select dropdown to allow the store to select from multiple options.
{
"id": "nav-style",
"name": "Navigation Style",
"description": "Set the location for your navigation.",
"type": "select",
"default": "Vertical Nav in Sidebar",
"values": [
"Horizontal Nav in Header",
"Vertical Nav in Sidebar"
]
}
To dynamically access the config option from within your template you can use the
config()
Twig function. This will output the entered option value, allowing you to use it however you wish within your template, such as outputting a text area into a specific location or altering CSS via a colour picker.Last modified 2mo ago