Работа с дизайном: редактирование шаблонов

Работа с дизайном: редактирование шаблонов

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

Дизайн сайта состоит из шаблонов. Каждый функциональный модуль имеет свой набор шаблонов. Если подключена PDA-версия сайта (Панель управления - Дизайн - Прочее - PDA-версия сайта), наборы шаблонов продублируются PDA-версией для каждого модуля. 

Глобальные блоки выводят информацию и элементы дизайна либо на группе страниц, где установлен код глобального блока, либо на всем сайте. Это удобно, так как при изменении шаблона глобального блока результаты можно увидеть сразу на всем сайте, не редактируя шаблоны по отдельности.

Таблица стилей — это отдельный шаблон, где прописаны стили для дизайна. Вы можете вносить правки в шаблон стилей, который подключен ко всем шаблонам сайта по умолчанию, или загрузить свои готовые файлы стилей. Если вы решили использовать отдельные файлы стилей, то нужно вручную прописать их в те шаблоны, где они будут использоваться.

  1. Редактирование шаблонов в панели управления сайтом
  2. Редактирование шаблонов с сайта (панель инструментов)

Редактирование шаблонов в панели управления сайтом

Перед внесением каких-либо изменений в дизайн сайта мы рекомендуем сделать резервное копирование шаблона.

Авторизуйтесь в панели управления сайтом (http://ваш сайт/admin - Дизайн - Редактор). Слева в меню вы увидите список отдельных шаблонов, доступных для редактирования, и список модулей.

Выберите необходимый шаблон, внесите правки и сохраните: 

Функции редактора:

  • Добавить $КОД$

Добавление оператора. В каждом отдельном шаблоне работает определенный набор системных операторов. Нажав на кнопку “Добавить $КОД$”, вы увидите список и функциональное описание операторов, работающих в выбранном вами шаблоне (для разных шаблонов списки могут отличаться).

  • Файловый менеджер

Кнопка “Файловый менеджер” позволяет вызвать окно загрузки файла прямо из редактора.

  • Добавить в редактор

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

  • Выравнивание кода

Позволяет в один клик привести код в более удобочитаемый вид.

  • Сменить цвет фона

Позволяет изменить цвет фона редактора (светлый или темный).

  • WYSIWYG

Переключение в режим визуального редактирования. Использовать данный режим крайне не рекомендуется!

  • Отменить последнее действие и Повторить отмененное действие

Позволяет произвести отмену последней правки кода или повторение отмененного действия.

  • Найти и заменить

Позволяет найти участок кода и заменить его на другой.

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

Инструмент будет полезен тогда, когда вы под свои нужды изменяете стандартный шаблон из коллекции или индивидуальный шаблон, установленный с помощью “Каркаса сайта”.

  • Полноэкранный режим.

Редактирование шаблонов с сайта (панель инструментов)

Перед внесением каких-либо изменений в дизайн сайта мы рекомендуем сделать резервное копирование шаблона.

Чтобы подключить редактирование шаблонов с сайта, нужно отключить конструктор: Панель управления - Дизайн - Прочее - Снимите галку с “Конструктор” для управления дизайном - Сохраните.

В первую очередь нужно войти на сайт как администратор, у которого установлено право “Редактировать дизайн сайта”. В панели инструментов нажмите на крайний справа значок “Управление дизайном”.

  • “Управление дизайном сайта” выведет развернутый список всех шаблонов сайта, доступных для редактирования.
  • “Управление дизайном страницы” откроет для редактирования шаблон страницы, на которой вы находитесь.
  • “Список переменных страницы” — переменные, уникальные для каждой страницы. Выводится список переменных страницы, на которой вы находитесь. Переменные страницы используются в условных операторах. Подробнее об условных операторах вы можете прочитать в инструкции в Панели управления - Дизайн - Редактор - Кнопка “Добавить $КОД$”.

Примечание: Для редактирования шаблонов нужны как минимум начальные знания HTML, CSS и JS.
Если вы не обладаете необходимыми знаниями и навыками: 

  • приобретите готовый шаблон и закажите установку (есть бесплатные шаблоны) на официальном сайте http://utemplate.pro/
  • приобретите готовый скрипт (есть бесплатные скрипты) для расширения функционала сайта на http://uscript.pro/
  • закажите любые работы у фрилансеров на https://upartner.pro/
Работа с дизайном: редактирование шаблонов