Получите сайт "под ключ" за 20 дней: удобный функционал, современный дизайн, более
200 интеграций
для бизнеса Реклама. ООО «Инсейлс Рус»‎ ИНН 771484376 erid: 2Ranynxjx8G
Получите продающий сайт «под ключ» за 20 дней: уникальный дизайн, подключение интеграций, удобный функционал
Реклама. ООО «Инсейлс Рус»‎ ИНН 771484376 erid: 2Ranyo5dJeU

Редактор кода шаблонов четвёртого поколения

Для построения шаблонов используются HTML, CSS и JavaScript, а также шаблонизатор Liquid. Чтобы полноценно работать с шаблонами, нужно изучить Liquid. Подробнее

  1. Общий вид редактора
  2. Редактирование виджетов
  3. Возможности редактора

Общий вид редактора

Чтобы открыть редактор, перейдите в Сайт ⟶ Дизайн и нажмите "Редактировать шаблон":

Выберите виджет, код который хотите изменить, нажмите на шестерёнку и в панели слева на "Редактировать код":

HTML — разметка виджета.

SCSS — стили виджета.

JS — скрипты виджета.

Переводы сообщений для формы (JSON) — перевод на разные языки в формате .json, возможно добавлять новые, делая по аналогии с теми, которые есть:

Форма настроек (JSON) — описание пунктов настроек виджета в формате .json, которые появляются, когда нажимаешь на шестерёнку у виджета:

Настройки по умолчанию (JSON) — определяет настройки, с которыми будет опубликован виджет при его добавлении на сайт:

Подробнее о формате JSON

Редактирование виджетов

Изменение кода конкретного виджета не влияет на другие виджеты, то есть работу можно вести модульно, не опасаясь, что изменения в одном месте приведут к изменениям в другом. Данное правило также относится и к одинаковым виджетам, например возможно добавить несколько виджетов "Промо слайдер", каждый из них независим от другого.

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

Чтобы посмотреть историю изменения виджетов, в панели администратора Сайт ⟶ Дизайн у нужного шаблона нажмите Действия ⟶ История изменений виджетов:

Если в разделе истории изменений нажать на название виджета, то откроется редактор кода виджета:

Возможности редактора

По основным возможностям редактор кода в inSales обладает базовыми функциями Visual Studio Code:

  • подсветка синтаксиса;
  • emmet — расширение, которое упрощает написание HTML и CSS разметки;
  • подсказки с автодополнением кода, с помощью этого можно преобразовать Emmet-код в разметку;
  • поиск с автозаменой, включается с помощью горячих клавиш CTRL + F, затем нужно нажать на панель поиска и выбрать нужную опцию;
  • CTRL + S — сохраняет изменения;
  • CTRL + Z — отменяет изменения;
  • CTRL + { и CTRL + }  перемещают участки кода влево и вправо соответственно;
  • ALT + Page Up (стрелочка вверх) и ALT + Page Down (стрелочка вниз) перемещают участки кода вверх и вниз соответственно.

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

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

Оценки: 0

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