Хотя система тем позволяет применить практически неограниченное количество возможностей, здесь мы разберём некоторые приёмы, которые мы рекомендуем вам применить. Это упростит процесс создания и использования тем.
Не редактируйте стандартные CSS файлы
Всякий раз, когда изменён файл стандартной темы, процесс обновления сайта становится немного сложнее, потому что должны быть обработаны все изменения. Это просто решить для CSS, т.к. по своей натуре они каскадны - то есть вы можете создать свои собственные CSS файлы, которые могут переопределять значения стандартных CSS файлов, при этом не влияя на процесс обновления CSS при обновлении сайта.
В качестве помощи, в IPS4 поставляется пустой CSS файл под названием custom.css, который вы можете использовать для кастомизации темы. Для простых тем, хранение кастомизаций в данном файле будет достаточным. Однако, вы можете создать несколько кастомных CSS файлов в группе, если хотите, и они будут автоматически подключены (нет необходимости использовать подключение с помощью @import).
Кастомный css файл
Invision Community всегда загружает ваши кастомные CSS файлы последними в очереди загрузки, так вы можете использовать те же селекторы, как в стандартных CSS файлах и ваши новые стили должны переопределять стандартные значения.
Внедряйте минимальные изменения в шаблоны
Редактирование шаблонов также может привести к трудностям при обновлении, поскольку кастомизированные шаблоны могут не иметь новый HTML код для новых функций, или что хуже, нарушать шаблоны, вызывая переменную, которая была удалена.
Тем не менее, в отличие от CSS файлов, шаблоны не каскадны, и в некоторых случаях редактирования шаблона является единственным путём кастомизации. Поэтому, мы рекомендуем вам максимально попытаться минимизировать кастомизацию шаблонов. Существует несколько стратегий для этого:
-
Используйте CSS, где это возможно
Использование HTML кода в шаблонах для достижения необходимого визуального стиля может быть весьма заманчивым. Мы рекомендуем рассмотреть использование CSS для реализации задуманного где это возможно, т.к. это сделает поддержку вашей темы намного проще в долгосрочной перспективе. -
Используйте включение шаблонов и пользовательские шаблоны
Если вы добавляете большой блок HTML кода в шаблон (больше нескольких строк), подумайте над размещением этого кода в кастомном шаблоне, затем вызовите этот шаблон в стандартном шаблоне. Таким образом, кастомизация стандартного шаблона состоит только во включении тега вызова, который можно вернуть в исходное состояние и добавить тег вставки шаблона обратно без особых усилий. Для вызова пользовательского шаблона, вы можете сделать: -
{template="myCustomTemplate" group="<group>" app="<app>"}
где <group> и <app> являются ключами для местоположения, которое вы выбрали при создании вашего кастомного шаблона.
-
Рассмотрите возможность создания хука
Хуки приложения имеет возможность изменять шаблоны с помощью 'перехвата' кода. В некоторых ситуациях, использование хуков может быть более подходящим, чем непосредственное редактирование шаблона.
Помните о поддержке мобильных устройств
Invision Community изначально разработан отзывчивым, то есть стандартная тема корректно работает на всех устройствах, независимо от разрешения экрана, будь то настольный компьютер или мобильный телефон. Когда вы производите изменения в вашей теме, не забудьте о поддержке мобильных устройств и убедитесь в том, что вы также включили адаптивные стили тоже. Вы можете использовать инструмент, подобный веб-инспектору Google Chrome, чтобы имитировать различные размеры экранов, или BrowserStack для тестирования темы на реальных устройствах.
Помните о поддержки справа налево
Invision Community разработан для полноценной работы на типах языков - справа налево (RTL) и слева направо (LTR). Если вы создаёте тему, которой хотите поделиться с другими, помните о поддержки RTL.