Начало работы с дизайном

После установки AlterCPA вам необходимо выполнить саму важную настройку - выбрать цветовую гамму для системы. Вам доступны несколько вариантов работы с внешним видом своей сети.

  1. Поменять цветовую гамму и вписать название. Самый простой вариант, который подходит для использования внутри арбитражных команд и других закрытых проектов.
  2. Выбрать существующий вариант оформления. Несколько вариантов дизайна идёт в комплекте с системой. В них можно слегка сменить цветовую гамму и использовать в работе.
  3. Поменять существующий стиль на что-то своё. У вас есть полный доступ к шаблонам и файлам оформления внутри инструмента «Стили». Вы можете вносить любые изменения во внешний вид своей сети.

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

Выбор цветовой гаммы

Базовые настройки внешнего вида вашей системы находятся в разделе "Управление - Настройки - Внешний вид". Настройки цветовой гаммы могут использоваться не только стандартным, но и дополнительными стилями системы. Рекомендуется указать их:

  • Цвет меню - отвечает за основной файл стиля системного меню и панели навигации. Почти не используется дополнительными стилями.
  • Цвет кнопок - отвечает за окраску основных кнопок действий на сайте. Дополнительные кнопки окраску при этом не меняют. Используется всеми стилями.
  • Цвет блоков - отвечает за цвет виджетов с данными, например, на главной странице. Используется практически всеми стилями.

Дополнительные параметры в цветах и стилях, отвечающие за загрузку или отключение файлов стилей, применять не рекомендуется. Эти настройки лучше указать внутри соответствующего стиля.

Стандартные стили оформления

Вы можете активировать поддержку стилей оформления. Для этого перейдите в раздел "Управление - Настройки - Стили" и нажмите на кнопку активации. Загрузятся стандартные стили оформления системы.

  • Brilliant - один из первых шаблонов админки на базе Bootstrap-3, лежит здесь для ностальгии и в качестве образца натягивания шаблона.
  • Bootstrap 3 - абсолютная классика дизайна. По кнопке "Параметры" позволяет выбрать 17 различных стилей оформления. Некоторые очень даже приятные.
  • DiffDash - красивая светлая тема оформления, очень полюбилась нашим заказчикам.
  • Classic dark theme - классическая тёмная тема оформления.
  • Classic top navigation - классическая тема с горизонтальным меню.
  • Classic dark theme with top navigation - классическая тема в тёмном оформлении с горизонтальным меню.

Чтобы активировать тему, нажмите кнопку "Выбрать" в столбце "Активный". Чтобы настроить параметры отображения - кнопку "Параметры" (актуально для Bootstrap). Не вносите изменения в существующие стили, они сотрутся при обновлении!

Создание собственного стиля

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

Вам доступно изменение файлов шаблона, добавление своих CSS и JS файлов, загрузка картинок, работа с макросами и параметрами. Все эти действия разобраны в разделе "Дизайн" нашей базы знаний.

Лайфхак! Чтобы взять любой из существующих стилей за основу своего собственного, действуем вот так:

  1. Создайте новый стиль.
  2. Нажмите на "Экспорт" у понравившегося вам системного стиля.
  3. Нажмите на "Импорт" над табличкой стилей.
  4. В поле "Папка" выберите созданный стиль, в поле "Файл" - скачанный файл экспорта.
  5. Нажмите "Импорт", стиль загрузится.
  6. Найдите загруженный стиль. Название у него будет из пункта 2, папка из пункта 3.
  7. Нажмите "Настройки" у выбранного стиля и задайте ему старое название, стёртое при импорте.
  8. Меняйте стиль как вам будет удобно.