Работа с внешним видом сайта ведётся из раздела "Управление - Настройки - Стили". Для любых изменений в дизайне вашей системы, необходимо первым делом создать свой стиль.
Создание стиля
За добавление нового стиля отвечает форма, расположенная над таблицей. Укажите в ней название папки, в которой будет лежать ваш будущий стиль, и нажмите "Добавить".
Новый стиль будет добавлен в папку skin вашей сети. Внутри папки стиля вы можете безопасно размещать любые медиа-файлы, они не будут мешать работе системы и могут использоваться в создании своего оформления.
Экспорт стиля
Вы можете сделать архив стиля для отправки в другую сеть, резервного копирования или создания полной копии. Для этого используйте кнопку "Экспорт", она сохранит в архив всё содержимое папки стиля.
Импорт стиля
Вы можете загрузить в систему стиль сторонней разработки или свой собственный, например, из резервной копии. Для этого воспользуйтесь кнопкой "Импорт" над таблицей. Укажите файл импорта и выберите папку. При импорте стираются все настройки существующего стиля.
Вы можете выполнять импорт только в уже существующие папки. Если вам необходимо импортировать новый стиль, предварительно создайте для него папку.
CSS, JS и картинки
Вы можете управлять медиа-файлами своего стиля напрямую из интерфейса сети. Для этого перейдите по соответствующей кнопке в таблице. Вы можете загружать существующие файлы по кнопке "Загрузить". Для стилей и скриптов доступна возможность создания нового файла и работы с ним во встроенном редакторе по кнопке "Правка".
Расположение файлов внутри стиля:
- Стили: папка -
css, макрос пути -{tpl:skincss} - Скрипты: папка -
js, макрос пути -{tpl:skincss} - Картинки: папка -
img, макрос пути -{tpl:skinimg}
Шаблоны
В разделе "Шаблоны" расположено управление tpl-файлами вашего стиля. Если в активном стиле добавлен какой-либо tpl-файл, система будет автоматически использовать его вместо встроенного. Чтобы добавить системный файл в шаблон для внесения изменений, найдите его в списке и нажмите кнопку "Добавить". Вы можете скачать шаблон для изучения по ссылке в его названии или изменить его в редакторе по кнопке "Правка".
Наиболее полезные шаблоны, которые пригодятся вам в работе:
home- лендинг на главной странице.login- форма входа, регистрации и восстановления пароля.header- заголовочная часть сайта, включая верхнее и боковое меню.footer- подвал сайта с копирайтом и JS-кодом.
Эти файлы крайне редко меняются при обновлении системы. При работе со стилем не рекомендуется изменять другие файлы, поскольку они могут поменяться в любой момент без предупреждения.
Макросы
С помощью макросов вы можете заменять названия классов, используемые во всех шаблонах. Это позволит оставить существующие файлы шаблонов при натягивании нового стиля - структура шаблонов чаще всего совпадает, различаются только названия классов. Например, стандартный блок в AdminLTE называется box, в Bootstrap 3 это panel, в Boostrap 4 это card.
Параметры
Параметры могут использоваться для изменения поведения стиля. Например, вы можете сделать несколько стилей с одинаковым содержимым, но отличающимися в параметрах. Параметры задаются списком названий и их значений. Некоторые стили используют визуальный вариант настройки параметров.
Настройки
В этом разделе настраивается загрузка файлов CSS и JS в стиль.
- Название. Используется для удобства в списке стилей.
- Файлы JS. Список файлов из раздела JS для подключения к стилю. Указываются по одному файлу в строке, без добавления .js в конце. Файлы всегда подключаются после основных JS-файлов системы.
- Файлы CSS. Список файлов из раздела CSS для подключения к стилю. Указываются по одному файлу в строке, без добавления .css в конце. Файлы подключаются после основных CSS-файлов системы.
- Ранний CSS. Список CSS-файлов для загрузки перед основными файлами системы. Указывается аналогично файлам CSS.
- Не загружать системный style.css. Этот файл содержит основные стили AdminLTE и Bootstrap. Не требуется при работе со своим шаблоном на Bootstrap.
- Не загружать системный layout.css. Этот файл содержит описание специфичных для AlterCPA блоков. Рекомендуется включать его при работе со своими Bootstrap-стилями.
- Не загружать системный skin-xxx.css. Этот файл используется для стилизации AdminLTE. Вы можете отключить его и вместо него подключить свой файл цветовой гаммы, созданный на его основе.
- Не загружать системный FontAwesome.css. Файл содержит шрифт с иконками. Не рекомендуется его отключать, не подключив более свежую или платную версию.
- Не загружать app.js от AdminLTE. Файл отвечает за работу AdminLTE, рекомендуется отключать его при работе с уникальными стилями.
- Не загружать bootstrap.js. Файл отвечает за скрипты для Bootstrap 3. Отключите его, если используется другой фреймворк.
- Не загружать jquery.js. Файл требуется практически всем компонентам системы. Не рекомендуется его отключать вообще. Лучше найдите способ сосуществовать с ним в мире и согласии.