Шаблоны Joomla 3.4

Недавно вышел релиз Joomla 3.0 Alpha-2, который предназначен исключительно для тестирования и ознакомления с новыми возможностями системы. Мы хотели бы ознакомить вас с его новинками, которые будут внедрены в новую версию CMS. Напомним, что выход стабильной версии Joomla 3.0 запланирован на 26 сентября 2012 года. Но прежде всего напоминаем еще раз - не используйте данный альфа-релиз на готовых и рабочих сайтах.

Новые возможности Joomla 3.0

Новый установщик пакета

Процесс установки был полностью пересмотрен. Сам процесс теперь занимает всего три шага. Вы можете также отправить конфигурацию и пароль по электронной почте (по соображениям безопасности).

Isis - новый шаблон административной части

Isis - это имя нового шаблона административной части сайта, который берет свое название из имен египетских божеств, на подобии уже знакомых Hathor и Khepri. Построен на фреймворке нового поколения Bootstrap, Isis берет все лучшее из разметки Bootstrap и поддерживает отображение на различных устройствах. Шаблон также использует функции jQuery UI для drag'n'drop, Icomoon иконки шрифтов для всех своих иконок и Chosen селект-боксы для всех инпут-полей.

Protostar - новый стандартный шаблон сайта

Релиз Joomla 3.0 поставляется вместе с обновленной версией шаблона Beez, но вы можете включить и новый шаблон Protostar. Protostar продолжает серию космических названий шаблонов Солнечной системы и Млечного пути (Protostar - это звезда, которая находиться в постоянном потоке движения и изменяет свой размер). Как и Isis, Protostar полностью построен на платформе Bootstrap. Если вы разработчик и хотите протестировать свое расширение на Bootstrap стилях, то смело тестируйте на Protostar.

JUI - библиотека Joomla User Interface

Появилась новая библиотека JUI, которая используется для новых возможностей. Все необходимые инструменты теперь находятся в ядре, и будут постоянно обновляться.

JUI включает:

• Bootstrap
• Расширенный Bootstrap для Joomla
• jQuery
• jQuery UI
• Icomoon, шрифтовые иконки
• Chosen js для селект-боксов

Миграция на jQuery

Релиз Joomla 3.0 поставляться с одновременно включенными jQuery (в режиме noConflict) и Mootools. Библиотека jQuery выбрана для JUI, поскольку Bootstrap спроектирован под jQuery, а еще jQuery UI используется для drag'n'drop и разных других вещей. Цель - оставить в новой Joomla 3.0 только jQuery в качестве обязательной библиотеки, а Mootools поддерживать ради разработчиков расширений и обратной совместимости.

Drag'n'drop, Select и Sort

Административная часть сайта теперь использует jQuery UI для drag'n'drop. Для просмотра, убедитесь, что вы изменили сортировку на «Сортировка». Если вы разработчик и хотите добавить drag'n'drop сортировку и другие новые возможности в ваш компонент, тогда необходимо изучить дополнительную документацию. Команда JoomlaShine добавила drag'n'drop, Michael Babker - Sort и Order селект-боксы.

Bootstrap JHtml в ядре

Релиз содержит новые Bootstrap подсказки, вкладки и аккордеоны. Разработчики могут выбрать родную Bootstrap разметку или воспользоваться расширенными возможностями JHtml. Если вы ранее использовали JPane, то это не покажется вам незнакомым. Подробную документацию и разработку Bootstrap JHtml библиотеки для новой Joomla 3.0 предоставил Dave Horsfall с HWD. Ожидается еще больше Bootstrap возможностей в будущих релизах.

Шрифтовые иконки Icomoon

145 векторных иконок были включены в JUI как стандарт для использования во фронтальной и административной частях сайта. Изюминкой шрифтовых иконок является то, что они бесконечно масштабируются (достаточно измените размер шрифта). Разработчики внедрили иконки Icomoon в точности как Bootstrap иконки, подразумевая то, что вы можете использовать <i class="icon-home"></i> также, как вы сделали бы это в Bootstrap. Это даже лучше, так как теперь нет необходимости использовать Bootstrap класс icon-white, поскольку эти иконки автоматически подстраиваются под цвет шрифта! Здесь вы можете посмотреть все иконки для Joomla 3.0.

Новые расширенные опции модуля

В расширенных настройках модуля теперь можно изменять:

• Теги модуля для изменения div на section
  
• Bootstrap Size для изменения Bootstrap span grid-класса
  
• Тег заголовка h3 на h1 , h2 и т.д. для SEO
  
• Класс заголовка для добавления такого класса Bootstrap как page-header
  
• Стиль модуля для изменения Joomla модуля на любом из установленных шаблонов.
  

Bootstrap сетка разметки

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

• span2/span6/span4 - для панели управления боковыми панелями
  
• span2/span10 - для списков / таблиц с левой боковой панелью и меню (подробности здесь)
  
• span10/span2 - для режимов редактирования с правой боковой панелью
  
• span12 - ​​для полной ширины.
  

Новый селектор выбора позиции модуля

Anderson Grüdtner Martins разработал более простой селект-бокс для выбора позиции модуля вместо модального окна. Селект-бокс использует Chosen js для поиска в реальном времени, и Anderson переделал его так, что он позволяет добавить новую или свою позицию, в случае если поиск не дал никакого результата

LESS CSS шаблонов Joomla 3.0

Одним из крупнейших изменений в разработке шаблонов для новой Joomla 3.0 будет использование всех возможностей LESS. Шаблоны сайта и административной части теперь будут включать директорию /less и файл template.less, который будет импортировать все Bootstrap и JUI less-файлы с /media/jui/less. Разработчики шаблонов теперь с легкостью смогут выбрать какой из LESS файлов импортировать в JUI и какой из них они предпочитают включить для своего шаблона. Например, для простого изменения всех цветов темы, пользуйтесь variables.less вместо стандартного Bootstrap. Таким же образом вы можете изменить иконки в icomoon.less. Для примеров загляните в /templates/protostar/less и /administrator/templates/isis/less .

Изюминка данного подхода в том, что все CSS-файлы вашего сайта и всех компонентов будут находиться в одном скомпилированном template.css файле! Все без перераспределения и дублирования СSS как это было раньше в Joomla. Конечно, если вы хотите, то вы можете использовать CSS в вашем шаблоне и импортировать JUI/Bootstrap CSS с /media/jui/css.

Bootstrap группы кнопок для полей радио-переключателей

Обратите внимание, что radio-переключатели в релизе Joomla 3.0 Alpha-2 теперь сгруппированы. Разработчики расширений могут просто добавить class="btn-group" в <field> параметры xml-файл формы их компонента, и radio-переключатели превратятся в группы кнопок в административной части.

Уже совсем скоро на официальном сайте CMS Joomla появится подробная документация по работе с новой версией, ну а сейчас нам остается только ждать официального релиза Joomla 3.0.