Sidebar Configuration
Sidebar settings cannot save values and are not configurable. They are informational elements used to provide details and organize input settings.
Sidebar settings are categorized into the following types based on standard attributes:
- group_header
- header
To add input settings (such as checkboxes), refer to Input Settings.
Standard Attributes
The following are the standard attributes for sidebar configuration:
Attribute | Description | Required |
---|---|---|
type | The type of sidebar configuration. | Yes |
label | The text content of the configuration. | Yes |
group_header
Setting type to group_header adds a header element and groups the subsequent configuration items to help organize them better. For example, the following configuration produces the effect shown below:
{
"type": "group_header",
"label": {
"en": "Products",
}
},
{
"id": "superscript_decimals",
"type": "switch",
"label": {
"en": "Zoom out display for decimals of the selling price",
},
"default": true
},
{
"type": "group_header",
"label": {
"en": "Collections",
}
},
{
"id": "collection_grid_shape",
"type": "select",
"label": {
"en": "Shape of collection image",
},
"options": [
{
"value": "square",
"label": {
"en": "Square",
}
}
],
"default": "square"
}
In the theme editor, it appears as:
Grouping Logic of group_header: Render in order; when type is group_header, the following configuration items will be grouped under it until the next group_header configuration is encountered.
header
Setting type to header adds only a header element without grouping the configuration items. For example, the following configuration produces the effect shown below:
{
"type": "header",
"content": {
"en": "Title"
},
"info": {
"en": "Text content"
}
}
In the theme editor, it appears as:
Using Links in Text
You can add hyperlinks in each configuration with an info attribute. Example code:
{
"type": "group_header",
"label": {
"en": "Subcollection"
},
"info": {
"en": "The collection menu configured in the navigation menu will be displayed here. [Know more](https://shoplineapphelp.zendesk.com/hc/en/articles/4404860397977)"
}
}
In the theme editor, it appears as:
Error loading component.