Jump to content

Редактор шаблонов

Стандартным способом редактирования темы является использование инструмент редактирования шаблонов, который доступен в вашем админцентре. Он обеспечивает лёгкий доступ к шаблонам и CSS стилям и не требует каких-либо специальных настроек.

Для начала редактирования темы, перейдите на страницу Кастомизация > Внешний вид > Темы и нажмите на иконку кода справа от темы, которую хотите изменить.

Если тема, которую вы хотите изменить, изначально создана с помощью Простого редактора, иконка кода будет расположена в выпадающем меню.

themes_list.png Кнопка редактирования шаблонов темы

 

После этого вы увидите следующее:

temp_editor.png Редактор кода шаблонов и CSS файлов

 

1. Список файлов

Боковая панель содержит список доступных шаблонов/CSS файлов в данной теме. В списке тем шаблоны сперва сгруппированы по их приложению, затем по front/global, и, наконец, по области применения.

  • front - используется в публичной части сайта;
  • global - используется как в публичной части, так и в админцентре.

Четыре различные иконки могут отображаться справа у каждого элемента в списке, обозначающие статус элемента:

  • - Этот файл был изменён в предыдущей версии Invision Community и может быть устаревшим.
  • - Этот файл был изменен в текущей версии the Invision Community.
  • - Этот файл наследуется от родительской темы. Изменения в файле родительской темой будут отражены применены и здесь.
  • - Этот файл является уникальным для данной теме (т.е. он был добавлен вручную).

Вы можете переключаться между шаблонами и CSS файлами с помощью вкладок, расположенных сверху списка элементов. Оба типа файлов могут быть одновременно открыты в редакторе.

2. Редактор

Основное окно редактирования может иметь вкладки, сам редактор подсвечивает синтаксис кода и позволяет вам редактировать код шаблонов и CSS файлы одновременно. Откройте вкладку, кликнув на файл в боковом блоке; закройте вкладку, нажав на X на вкладке.

Если файл содержит несохранённые изменения, вместо X во вкладке будет отображена жирная точка, напоминающая вам об этом.

3. Поиск

Легко найти любой шаблон или CSS файл с помощью данной формы поиска. Эта форма производит поиск по названию шаблона и его содержимому.

4. Вернуть

Если текущий выбранный файл имеет сохранённые изменения (то есть она отличается от этого же шаблона в стандартной теме), кнопка Вернуть будет доступной для нажатия на неё. Клик по ней вернёт данный файл в исходное состояние - любые изменения в нём будут удалены. Это может быть полезно после обновления, когда данный файл может стать устаревшим. В подобных ситуациях лучшим выходом будет возврат файла в исходное состояние и повторное применение внесённых ранее изменений.

5. Переменные

Большинство шаблонов имеют переменные, передаваемые в них серверным кодом; эти переменные часто используются для отображения необходимых данных или контроля отображения в в зависимости от обстоятельств.

Нажав на кнопку Переменные, вы увидите всплывающее окно со списком переменных, используемых в данном шаблоне, таким образом вы можете знать, какие данные передаются в шаблон.

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

6. Настройки редактора

Настройки редактора представляет из себя выпадающее меню, содержащее несколько опций, которые влияют на поведение редактора. Вы можете настроить их в соответствии с вашим собственным вкусом.

7. Новый файл

Кнопка "Новый" позволяет вам добавить собственный HTML шаблон и CSS файл в тему. Это отличный способ, чтобы держать ваши изменения изолированными от стандартных шаблонов/css файлов, что позволяет легче переносить обновление сайта, об этом мы поговорим в другой инструкции.