Astroid Framework: возможности и настройки
- Нотан Ройамов
- Шаблоны Joomla
- Просмотров: 10118
Astroid — шаблонный фреймворк последнего поколения от разработчика JOOMDEV, который явно пытается унаследовать лучшее от других современных фреймворков. Шаблонов на Astroid не много, что может объясняться его недавним появлением, однако его функциональные возможности заслуживают внимания, о чем и поговорим в данном материале.
Содержание
Возможности Astroid
Разработчики фреймворка не поленились и подробно расписали все возможности своего творения на официальной странице. Опустим банальные неконкретные восхваления типа «наш фреймворк супер-адаптивный, супер-быстрый, супер-безопасный, использует Font Awesome, Google Fonts и т. д.» — так о своих продуктах не говорит только ленивый.
Лучше обратим внимание на заявленные особенности, отличные от других фреймворков:
Кросс-браузерная совместимость
Фреймворк тестируется во всех современных браузерах и на всех типах устройств.
К слову, так должно быть со всеми подобными разработками, поэтому не удивительно.
Встроенный медиа-менеджер
Astroid позволяет легко управлять медиа-файлами и хранить их в хорошо структурированном виде.
Менеджер работает только в настройках шаблона.
Макеты для шапки сайта
Возможность переопределения элементов макета в шапке сайта.
Функция напоминает аналогичную в YOOtheme Pro, но с большими ограничениями.
Мега-меню и мобильное меню
Astroid оснащен отличным конструктором мега-меню и offcanvas-меню для мобильных устройств.
Функция скопирована с Helix.
Настраиваемые страницы Error 404 и Coming Soon
Данные страницы кастомизируются в настройках шаблона.
Возможностей для кастомизации, увы, не много.
Социальные иконки
Возможность добавления иконок со ссылками на социальные профили.
Хорошо, но этим уже никого не удивишь.
Широкий и коробочный макет
Есть возможность выбора макета в полную ширину или ограниченную ширину экрана.
Аналогичная функция есть во многих современных шаблонах.
Пользовательский код
Возможность вставки пользовательского HTML-, CSS- и JS-кода в различных частях страницы.
Этим никого не удивишь.
Интеграция комментариев
Astroid позволяет интегрировать материалы Joomla с сервисами комментариев Facebook, Disqus, HyperComments, IntenseDebate.
Аналогичная функция есть во фреймворках Helix 3 и Ultimate, но там немного меньше список сервисов для интеграции.
Блок автора
Вывод информации об авторе в материалах Joomla.
Это оригинальная функция.
Метки для материалов
Возможность добавления к материалам специальных меток для выделения.
Это оригинальная функция.
Типы материалов
Возможность присвоения материалам определённого типа: Regular, Video, Gallery, Audio, Review, Quote.
Функция скопирована с Helix 3.
Разметка Open Graph
Создание мета-тегов Open Graph для материалов Joomla.
Аналогичная функция есть во фреймворках Helix 3 и Ultimate, но там мета-теги заполняются автоматически, а здесь их значения можно выбирать отдельно для каждого материала.
AJAX-рейтинг
Возможность оценивать материалы Joomla без перезагрузки страницы.
Аналогичная функция есть во фреймворках Helix 3 и Ultimate.
Связанные материалы
Возможность добавления связанных материалов в материалы Joomla.
Это еще одна полезная опция, которой не могут похвастаться другие фреймворки.
Время прочтения
Возможность указать приблизительное время прочтения материала.
Время подсчитывается и указывается автоматически! Не то, чтобы это как то сильно улучшило материалы в глазах пользователей, но фишка оригинальная и интересная.
Интерфейс настроек шаблонов
- Переход в панель настроек шаблона осуществляется по кнопке Template Options со страницы редактирования стиля шаблона, как в Helix Ultimate и YOOtheme Pro:
- Интерфейс панели выглядит как гибрид интерфейса Helix 3 и Helix Ultimate: навигация по разделам настроек размещена в левом сайдбаре (как в Helix Ultimate), но в основной части отображается не внешний интерфейс, а сами настройки.
Т. е. в отличие от классического для Joomla интерфейса, когда разделы настроек распределены по вкладкам в верхней части окна (как в T3, Gantry 5), в панели настроек шаблона на Astroid данные вкладки размещены в сайдбаре в виде аккордеонов со ссылками на разделы для быстрой навигации по области с настройками. Несколько непривычно относительно традиционного интерфейса, но куда более удобно, чем в Helix Ultimate и даже YOOtheme Pro, т. к. все настройки находятся в основной части страницы, а не в сайдбаре.
Условным минусом такого интерфейса является отсутствие предпросмотра на одном экране вместе с настройками, но для этого в верхней панели инструментов есть кнопка Preview, открывающая внешний интерфейс сайта в новой вкладке.
Кроме этого в основной части экрана с настройками предусмотрен режим предпросмотра для некоторых элементов: все варианты предзагрузчика страниц можно рассмотреть в модальном окне, а для типографии предусмотрена текстовая область:
Настройки стилей шаблонов
Рассмотрим возможности фреймворка на примере бесплатного шаблона Astroid Template Zero, квикстарт которого можно скачать здесь.
В левом сайдбаре располагается меню со следующими пунктами:
-
Basic
Настройки предзагрузчика (предоставляется большой выбор), кнопки «Наверх», выбор типа макета.
-
Header
Настройки шапки и её элементов: логотипа и меню.
-
Colors
Установка цвета текста и ссылок для тегов
bodyиheader, а также для меню (основного, мобильного и для выпадающих элементов).
-
Layout
Конструктор макета.
-
Typography
Настройки шрифтов (семейство шрифтов, насыщенность, размер, преобразование) для тега
body, меню и заголовков (тегиh1-h6).
-
Article/Blog
Активация и настойки дополнительных возможностей для материалов Joomla.
-
Social
Добавление иконок социальных сетей со ссылками.
-
Custom Code
Текстовый области для вставки пользовательского кода.
-
Miscellaneous
Прочие настройки: копирайт, контактная информация, страницы Coming Soon и 404 Error, фавиконка.
-
Export
Экспорт настроек.
-
Import
Импорт настроек.
Большинство настроек является типичными для многих фреймворков и ни чем не удивят опытных разработчиков, поэтому не будем рассматривать каждую в отдельности.
Конструктор макета
Отметим, что набор настроек явно напоминает Helix 3, но в ином интерфейсе, сайдбар которого в свою очередь напоминает Helix Ultimate: ассоциации с Helix возникают постоянно, это касается и конструктора макета.
Функционал конструктора макета (Layout) куда больше напоминает полноценный SP Page Builder, чем ограниченный конструктор макетов Helix'ов.
Основные возможности конструктора:
- функция перетаскивания (Drag & Drop),
- создание строк и колонок,
- настройки стилей и адаптивности для строк и колонок,
- макеты для секций (коробочный, во всю ширину, коробочный без отступов и др.),
- назначение модульных позиций.
В отличие от ограниченного конструктора Helix, здесь мы можем назначать модульные позиции не колонкам строк, а отдельным элементам, которых может быть несколько в колонке:
Кроме этого мы можем создавать строки в секциях (New Row) и дублировать элементы сетки (Duplicate). Панель с данными функциями отображается при наведении на элемент:
Выбор макета строки осуществляется во всплывающем окне, которое открывается при добавлении строки:
Еще одной выгодной особенностью является возможность добавления эффекта анимации любому элементу сетки. Примечательно, что анимационный эффект демонстрируется сразу напротив выпадающего списка:
В целом конструктор макета, демонстрируемый Astroid'ом, сильно опережает всех основных конкурентов, разве что за исключением навороченного конструктора Gantry 5, который является главной фишкой данного фреймворка.
Дополнительные настройки пунктов меню
Astroid очень нагло копирует функционал Helix'а даже за пределами настроек шаблонов, аналогичным образом добавляя дополнительные вкладки на страницы редактирования пунктов меню:
- Astroid Menu Options
- Banner Options
Astroid Menu Options
Данная вкладка идентична вкладкам Helix Megamenu Options (в Helix 3) и Mega Menu (в Helix Ultimate) с несущественными отличиями: здесь можно определить иконку и CSS-класс для пункта меню, ширину и выравнивание выпадающего элемента, а также назначить модули. Конструктор сетки выпадающего меню куда проще в освоении, чем то, что предлагает Helix 3 и Ultimate:
Banner Options
Эта вкладка идентична «хеликсовской» Helix Page Title: при активации опции Enable Banner на страницах, закрепленных за данным пунктом меню, в специальной позиции над областью контента будет выводится баннер с заданными настройками (заголовок, подзаголовок и стили).
Субъективно данная опция очень сомнительная и копировать её было совсем не обязательно.
Дополнительные настройки для материалов
Фреймворк Astroid добавляет 3 новые вкладки на страницу редактирования материалов:
- Article Type Options
- Blog Options
- Open Graph
Article Type Options
Здесь определяется тип материала (Article Type, аналог Post Format в Helix 3) и метка (Article Badge).
Типы материалов отличаются заглавным элементом на странице материала (в стандартных материалах это изображение) и специальной отметкой на картинке, отображаемой в списке материалов.
Существуют следующие типы материалов:
-
Regular
Стандартный материал с картинкой «во главе».
-
Video
Видео из YouTube или Vimeo.
-
Gallery
Слайдер изображений с заданными элементами.
-
Audio
Аудио-запись с Soundcloud или Spotify.
-
Review
Оригинальный тип материала, отлично подходящий для оформления рецензий.
-
Quote
Заглавным элементом будет цитата.
Также в этой вкладке материалу можно присвоить одну из следующих меток (Badge Options):
- Editor's Choise,
- Best Seller,
- Best Price,
- Hot,
- Trending,
- Custom.
Метки отображаются на картинках материалов в списке:
Blog Options
Эта вкладка отличается рядом полезных опций, значения по умолчанию для которых определяются в настройках шаблона (вкладка Article/Blog).
-
Related Articles
Вывод рекомендуемых материалов в табличном виде, количество которых определяется в Настройки шаблона → вкладка Article/Blog → Article Count
-
Social Share
Вывод кнопок «Поделиться» для различных соцссетей. Можно подключать кнопки AddThis и ShareThis (Настройки шаблона → Article/Blog → Social Buttons Type).
-
Comments
Активация комментариев (интеграция устанавливается в Настройки шаблона → Article/Blog → Comments).
-
Article type Icons
Отображение иконки, определяющей тип материала.
-
Read Time
Отображение приблизительного времени прочтения материала.
-
Author Info
Отображение блока с информацией об авторе.
Опции в данной вкладке действительно могут решить множество задач без применения сторонних расширений.
Open Graph
В данной вкладке можно переопределять значения для мета-тегов протокола Open Graph (по умолчанию они формируются из заголовка и мета-описания), который используют соцсети и другие сервисы для формирования постов из внешних URL-адресов.
Отметим, что хоть шаблоны Helix и генерируют OG-теги, но для этого не предусмотрено никаких опций, и в этом отношении Astroid также выглядит предпочтительнее.
Где скачать шаблоны на Astroid?
К сожалению, на момент написания материала шаблоны на Astroid предоставляются только разработчиком JOOMDEV: на сайте имеется ряд шаблонов, 10 из которых можно скачать бесплатно.
С учетом того, что Astroid Framework обходит Helix 3 и Helix Ultimate практически по всем параметрам, вопрос с количеством шаблонов упирается в его популярность.
Выводы и заключение
По ходу обзора рассматриваемый Astroid неспроста постоянно напрашивался на сравнение с Helix 3: фактически он копирует и улучшает возможности хеликса (например, типы материалов и OG-разметка), а также добавляет свои, пусть небольшие, но приятные фишки типа времени прочтения и связанных материалов.
Обзоры других фреймворков:
