Configuration

This document describes how you can configure your theme

Global Settings Config configs/custom.json

This file contains the settings for the entire theme and to make development easier you may separate sections into groups and add headings through the setting groups depending on the amount you need.

[
    {
        "name": "Group 1",
        "settings": [
            {
                "type": "header",
                "content": "This is an example header"
            },
            {
                "type": "colour",
                "id": "theme_example_colour",
                "label": "Example Colour",
                "default": "#02B4FE"
            },
        ]
    },
    {
        "name": "Group 2",
        "settings": [
            {
                "type": "header",
                "content": "This is an example header"
            }
        ]
    }
]

Setting References

Because settings are usable in sections as well as the configs/custom.json page, the references sections show each different configuration option as easily copy and paste-able objects you can use when needed

Section Types

Option	Description
type	Defines the type of input the option takes
id	Must be unique. It is how the settings are references in the theme.
label	Describes to the user what the option is for.
placeholder	A value for the input's placeholder text. This is for text-based setting types only..
default	define a default value for the option.
info	Provide additional info about the option to the end user.

Settings:

Setting	Description
colour	Allows the user to choose a colour with a colour picker
font	Allows the user to select from a list of fonts
richtext	Allows the user to add text and with minimal styles also links
markdown	Allows the user to add markdown content
text	Allow the user to input a single line text field
textarea	Allows the user to input multi line text
media	Allows the user to upload images
radio	Allows the user to select from radio buttons
select	Allows the user to select from a drop-down
checkbox	Allows the user to check a box return a true or false value
range	Allows the user to choose a value withing a range with a range slider

Header

This setting is only usable on configs/custom.json and is not necessary for sections

{
    "type": "header",
    "content": "This is an example header"
}

Colour

{
    "type": "colour",
    "id": "theme_example_colour",
    "label": "Example Colour",
    "default": "#02B4FE"
}

Font

{
    "type": "font",
    "id": "theme_example_font",
    "label": "Example Font"
}

Richtext

{
    "type": "richtext",
    "id": "theme_example_richtext",
    "label": "Example Rich Text"
}

Markdown

Automatically converts inputted markdown to html

{
    "type": "markdown",
    "id": "theme_example_markdown",
    "label": "Example Markdown"
}

Text

{
    "type": "text",
    "id": "theme_example_text",
    "label": "Example Text"
}

Textarea

Similar to text but adds a large input surface for easier reading

{
    "type": "textarea",
    "id": "theme_example_textarea",
    "label": "Example Textarea"
}

Image/Media

{
    "type": "media",
    "id": "theme_example_image",
    "label": "Example Image"
}

Radio Button

{
    "type": "radio",
    "id": "theme_example_radio",
    "label": "Example radio",
    "options": [
        { "value": "one", "label": "Radio One" },
        { "value": "two", "label": "Radio Two" }
    ],
    "default": "one"
}

Select Box

{
    "type": "select",
    "id": "theme_example_select",
    "label": "Example Select",
    "options": [
        { "value": "one", "label": "Option A" },
        { "value": "two", "label": "Option B" },
        { "value": "three", "label": "Option C" }
    ],
    "default": "one"
}

Checkboxes

{
    "type": "checkbox",
    "id": "theme_example_checkbox",
    "label": "Example Checkbox",
    "options": [
        { "value": "", "label": "Select" },
        { "value": "one", "label": "Checkbox One" },
        { "value": "two", "label": "Checkbox Two" }
    ],
    "default": ""
}

Range slider

{
    "type": "range",
    "id": "theme_example_range",
    "label": "Example Font Size",
    "min": 12,
    "max": 18,
    "step": 1,
    "unit": "px",
    "default": 16
}

pages.json

The pages.json controls where and what content can be displayed on the website, this can include anything from articles to category ranges.

Available Pages

These are pages that currently work with this new system

Page Name	Action	Description
index
articles.collection
articles.collection.show
articles.show
products.all
products.show
category.listing
category.landing
category.all
calendar.show
contact
gallery
locations
stockists
route
search
tags.listing
testimonials
wishlist

Available Features

Feature	Description
banner
category
slider
feature	Only available on products.show pages
filter
content_table
gallery
tag
calendar_widget
menu