settings.json

Данный файл отвечает за вывод настроек шаблона.

  1. Группы настроек
  2. Подгруппы настроек
  3. Варианты полей настроек
  4. Использование настроек

Группы настроек

Имеется возможность группировки настроек, которые будут отображаться в виде подменю с заголовком. В случае, если в настройках будет всего одна группа, то заголовок группы отображаться не будет и дроп будет всегда раскрыт. При добавлении параметра general эти настройки шаблона выводятся в первую очередь. Остальные настройки можно будет посмотреть включив Расширенный режим настроек.

Пример:

    {
      "Группа 1":[],
      "Группа 2":[],
      "Группа 3":[]
    }

Подгруппы настроек

Каждую группу можно разделить на подгруппы, которые будут визуально разделять настройки для более удобного их использования.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[]
        },
        {
          "group_name":"Подгруппа 2",
          "items":[]
        },
        {
          "group_name":"Подгруппа 3",
          "items":[]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Если не хочется разделять настройки на подгруппы, то можно использовать такой формат.

Пример:

    {
      "Группа 1":[
        {
          "items":[

          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Варианты полей настроек

В настройках можно использовать несколько видов полей настроек:

  • текст;
  • число;
  • чекбокс;
  • селект;
  • ползунок;
  • кнопки;
  • файл;
  • цвет;
  • шрифт.

Текст (text)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем)
  • type - тип text;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "name":"main_text",
              "label":"Текст",
              "help":"",
              "type":"text"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Основной текст (rich-text)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип text;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "name":"main_text",
              "label":"Текст",
              "help":"",
              "type":"text"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Число (number)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип number;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.
  • with_btns - изменение отображения Range slider на поле с кнопками '+' и '-';
  • min - значение 2 - тип number | число. Минимальное значение настройки.
  • max - значение 2 - тип number | число. Максимальное значение настройки.
  • step - значение 2 - тип number | число. Шаг(интервал) на которое увеличиться число.

Пример:

{
  "class":"range",
  "name":"img-ratio",
  "label":"{{ messages.image_ratio }}",
  "min":0.5,
  "max":2.5,
  "step":0.1,
  "type":"number",
  "with_btns": true
}

Чекбокс (checkbox)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип checkbox;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "name":"hide_caption",
              "label":"Скрыть заголовок",
              "value":null,
              "help":"",
              "type":"checkbox"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Селект (select)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем)
  • type - тип select;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "name":"font_family",
              "options":[
                [
                  "OpenSans",
                  "google:Open+Sans"
                ],
                [
                  "Roboto",
                  "google:Roboto"
                ]
              ],
              "value":null,
              "label":"Шрифт",
              "type":"select"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Ползунок (Range slider)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип range;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | Число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.
  • min - значение 2 - тип number | число. Минимальное значение.
  • max - значение 2 - тип number | число. Максимальное значение.
  • step - значение 2 - тип number | число. Шаг значений.
  • unit - значение "vw" - тип string | строка. Единица измерения (vw, px и т.п)
  • with_btns - значение true или false - Boolean | булевый тип. Изменение отображения Range slider на поле с кнопками '+' и '-'.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "class":"range",
              "name":"layout-pt",
              "min":0,
              "max":10,
              "step":0.5,
              "label":"{{ messages.indentation_height }}",
              "type":"range",
              "unit":"vw"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Кнопки (button-group)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип button-group;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - Значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.
  • min - значение 2 - тип number | число. Минимальное значение.
  • max - значение 2 - тип number | число. Максимальное значение.
  • step - значение 2 - тип number | число. Шаг значений.
  • unit - значение "vw" - тип string | строка. Единица измерения (vw, px и т.п).

  • with_btns - значение true или false - Boolean | булевый тип. Изменение отображения Range slider на поле с кнопками '+' и '-'.

  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.
  • title - значение - {{ messages.align_left }}. Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • icon - значение "vw" - тип string | строка. Пример: mdi-text-align-left.

Пример:

{
  "name":"widget-align",
  "options":[
    {
      "value": "left",
      "title": "{{ messages.align_left }}",
      "icon": "mdi-text-align-left"
    },
    {
      "value": "center",
      "title": "{{ messages.align_center }}",
      "icon": "mdi-text-align-center"
    },
    {
      "value": "right",
      "title": "{{ messages.align_right }}",
      "icon": "mdi-text-align-right"
    }
  ],
  "value":null,
  "label":"{{ messages.alignment }}",
  "type":"button-group"
}

Файл (Пример из настроек шаблона)

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип file;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.
  • min - значение 2 - тип number | число. Минимальное значение.
  • max - значение 2 - тип number | число. Максимальное значение.
  • step - значение 2 - тип number | число. Шаг значений.
  • unit - значение "vw" - тип string | строка. Единица измерения (vw, px и т.п).
  • with-generate-logo - значение true или false - Boolean | булевый тип. Добавить генератор логотипов в редакторе.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "name":"logotype",
              "label":"Логотип",
              "value":null,
              "type":"file"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Цвет

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип color;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.
  • clearable - значение true или false - Boolean | булевый тип. Возможность очистить цвет фона в редакторе.
  • fallback - значение - color-btn-bg или bg. Возвращает заданный цвет если он не указан пользователем.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "name":"color_text",
              "label":"Цвет текста",
              "value":"#ffffff",
              "help":"",
              "type":"color"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Шрифты

Данный вид имеет следующие параметры:

  • name - идентификатор настройки (должен быть уникальным);
  • label - заголовок настройки;
  • value - значение по умолчанию;
  • help - подсказка (будет отображаться рядом с полем);
  • type - тип color;
  • general - значение true или false - Boolean | булевый тип. Вывод настройки в основные в редакторе.
  • general_position - значение 2 - тип number | число. Порядок вывода настройки в основные в редакторе.
  • general_label - значение - "{{ messages.title }}". Добавляет заголовок с переводом из messages в основных настройках шаблона в редакторе.
  • enable_server_reload - значение true или false - Boolean | булевый тип. Перезагрузка шаблона при изменении значения настройки.
  • hide_mobile - значение true или false - Boolean | булевый тип. Скрыть настройку в мобильной версии редактора.

Пример:

    {
      "Группа 1":[
        {
          "group_name":"Подгруппа 1",
          "items":[
            {
              "class": "text",
              "name": "font",
              "label": "{{ messages.font_choice }}",
              "value": null,
              "type": "fonts_select",
              "general": true
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Использование настроек

Пример файла settings.json:

    {
      "Группа 1":[
        {
          "group_name":"Цвета",
          "items":[
            {
              "name":"color-background",
              "label":"Цвет фона",
              "value":"#ffffff",
              "help":"",
              "type":"color"
            },
            {
              "name":"color-text",
              "label":"Цвет текста",
              "value":"#ffffff",
              "help":"",
              "type":"color"
            },
            {
              "name":"color-link",
              "label":"Цвет ссылок",
              "value":"#ffffff",
              "help":"",
              "type":"color"
            }
          ]
        },
        {
          "group_name":"Шрифт",
          "items":[
            {
              "name":"font_family",
              "options":[
                [
                  "OpenSans",
                  "google:Open+Sans"
                ],
                [
                  "Roboto",
                  "google:Roboto"
                ]
              ],
              "value":null,
              "label":"Шрифт",
              "type":"select"
            },
            {
              "name":"font_weight",
              "label":"Начертание шрифта",
              "value":null,
              "min": 100,
              "max": 600,
              "step": 100,
              "type":"range"
            }
          ]
        },
        {
          "group_name":"Логотип",
          "items":[
            {
              "name":"logotype.png",
              "label":"Логотип",
              "value":null,
              "help":"",
              "type":"file"
            }
          ]
        }
      ],
      "Группа 2":[],
      "Группа 3":[]
    }

Пример получения значений настроек:

Вызов значения какого-либо параметра задается переменной {{ settings.необходимый_метод }}

Пример liquid:

Шрифт: {{ settings:font_family }}
Цвет текста: {{ settings:color_text }}

 

Оставить оценку

Оценка успешно отправлена.
Она будет проверена администратором перед публикацией.
Перед публикацией все оценки проходят модерацию

Оценки: 0

Остались вопросы?
Отправь тикет в техподдержку!
Еще нет своего магазина?
Создайте интернет-магазин на платформе inSales
Всё для продаж уже внутри!
Нажимая кнопку «Зарегистрироваться», я принимаю Пользовательское соглашение и Политику конфиденциальности
Недавно просмотренные статьи
Продолжая пользоваться сайтом,
вы соглашаетесь с использованием cookie