Пятница, 24 января 2020 г.

Очень давно работаю с Joomla и всегда удивлял один вопрос: почему в этом движке до сих пор используется Bootstrap 2? Когда Твиттер представил вторую версию своей удобной и простой среды вёрстки, у Джумлы была версия 1.7. С тех пор много сменилось версий, как Джумлы, так и Бутстрапа. Но Джумла "из коробки" всегда предлагала только второй Бутстрап. Не вникая в суть такого решения, я долго огорчался по этому поводу и даже часто подмывало написать обращение разработчикам Джумлы с просьбой изменить стандарт вёрстки движка на более удобный и продуктивный.

Некоторое время назад я увидел несколько шаблонов для Джумлы, свёрстанных на третьем бутстрапе. "Ага! Наконец-таки обновили вёрстку" - подумал я, пробуя сам сверстать что-нибудь. Не пошло. Как так? Почему не пошло?

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

Что делаем? Сначала скачиваем нужный дистрибутив Бутстрапа. Я скачал облегчённый дистриб с сайта русской документации Bootstrap 4. Из архива достаём два файла. bootstrap.min.css из папки css кидаем в папку /templates/<папка шаблона/css, а bootstrap.min.js из папки js кидаем в папку /templates/<папка шаблона>/js. После этого в index.php шаблона перед закрывающим тегом </head> прописываем

<link rel="stylesheet" href="/templates/<папка шаблона>/css/bootstrap.min.css" type="text/css" />
<script type="text/javascript" src="/templates/<папка шаблона>/js/bootstrap.min.js"></script>

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

Таким образом, получается, что Джумла, наоборот, предоставляет очень большой и гибкий выбор в плане подключаемого инструментария. И с этой стороны использование Bootstrap 2 (он, кстати, доступен и на фронте по умолчанию) показывает степень совместимости движка с разными средами. Хочешь - спанами верстай, хочешь - колами с кучей брейкпойнтов. Вид сайта зависит только от фантазии разработчика-верстальщика.