Всё для начала освоения Joomla здесь

    Быстрый старт в Joomla

    Подробные видеоуроки, более 70 надежных расширений на все случаи жизни, чек-листы по защите, ускорению и seo-оптимизации.
    Быстрый старт в Joomla
    Центр обучения Joomla
    Helix Ultimate

    Helix Ultimate: возможности и настройки

    Helix Ultimate — шаблонный фреймворк для Joomla последнего поколения, являющийся прямым наследником популярного Helix 3. В этом обзоре мы подробно рассмотрим ключевые особенности и возможности данного фреймворка.

    Содержание

    1. Возможности фреймворка
    2. Настройки шаблона
    3. Настройки пунктов меню
    4. Настройки материалов
    5. Где скачать шаблоны?
    6. Выводы

    Возможности Helix Ultimate

    Перечень возможностей, перечисленных на странице разработчика с нашими комментариями:

    Инновационный интерфейс

    Интерфейс настроек шаблона кардинально отличается от того, что мы видели в Helix 3: теперь все настройки доступны в режиме совмещения внешнего интерфейса и панели управления (в точности как в YOOtheme Pro).

    Bootstrap 4

    Фактически, шаблоны на Helix Ultimate — первые шаблоны для Joomla, применяющие последнюю версию CSS-фреймворка Bootstrap.

    Конструктор мега-меню

    Конструировать мега-меню можно было и в Helix 3, но в Ultimate данный процесс был изменён и доработан.

    Функциональный медиа-менеджер

    В настройках шаблона применяется свой медиа-менеджер, перекочевавший из Helix 3.

    Режим закрытого сайта

    Имеется возможность закрыть доступ к сайту и настроить соответствующую страницу.

    Вариации хедеров

    Фреймворк поддерживает различные вариации хедеров («шапок») с возможностью сохранять свои. Эта фишка явно перенята из YOOtheme Pro, но заметно уступает последнему в отношении реализации и количества вариаций.

    Опции предустановленных стилей

    Относительно Helix 3 данная функция действительно сильно ушла вперёд за счет дополнительных настроек, но она очень далеко позади аналогичной функции в YOOtheme Pro и даже в Warp 7.

    Поддержка SP Page Builder

    JoomShaper рекламируют свой конструктор страниц везде, где это возможно. По существу же SP Page Builder отлично совмещается с шаблонами на других современных фреймворках, хотя настройки Helix Ultimate и внешний редактор SP Page Builder'а имеют схожий интерфейс.

    SVG-логотип

    Через медиа-менеджер Helix Ultimate можно выбирать и загружать SVG-файлы.

    Ajax-рейтинг

    Возможность оценивать материалы Joomla без перезагрузки страницы нельзя назвать «козырной» фишкой, но лишней она уж точно не является.

    Настройки блога

    Настройки, позволяющие кастомизировать вывод материалов, также были в Helix 3, но в Ultimate их несколько больше.

    Сжатие CSS- и JS-кода

    С учетом того, что для максимального ускорения сайта на Joomla принято применять JCH Optimize, данная функция не теряет смысл.

    Интеграция комментариев

    Действительно, в настройках шаблона можно активировать комментарии через IntenseDebate, Facebook или Disqus, однако лучшим решением является применение узконаправленного компонента (смотрите материал Комментарии в Joomla 3).

    Социальные иконки

    В настройках шаблона можно указать ссылки на 11 социальных сетей с выводом соответствующих иконок.

    Поделиться в соцсетях

    Можно активировать кнопки расшаривания в материалах Joomla.

    Пользовательские CSS-стили

    Возможность добавлять пользовательский CSS-код имеется в каждом современном фреймворке.

    Пользовательский код

    Предусмотрена текстовая область для вставки любого пользовательского кода, но в этом нет ничего удивительного.

    Адаптивный дизайн

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

    Страница ошибки

    На страницу 404 можно добавить логотип, выбрать фоновое изображение и опубликовать модуль, но этого явно не достаточно (смотрите Страница ошибки 404 в Joomla 3.x).

    Резиновая или фиксированная ширина

    Имеется возможность выбора между резиновой и фиксированной шириной макета.

    Настройки шаблона на Helix Ultimate

    Рассмотрим возможности фреймворка на примере бесплатного шаблона Helix Ultimate (скачать бесплатно можно с официального сайта) от JoomShaper.

    Интерфейс Helix Ultimate

    Важно знать:
    Все настройки шаблонов, предоставляемые фреймворками, находятся на странице Расширения → Шаблоны → Стили → [Нужный шаблон]

    После нажатия кнопки Template Options на странице стиля шаблона откроется режим, совмещающий панель опций и внешний интерфейс сайта, в котором и осуществляются все настройки:

    Данный интерфейс схож с интерфейсом YOOtheme Pro, однако здесь нельзи ни сворачивать панель опций, ни изменять размер страницы, отображаемой в правой части. Если заглянуть внутрь разделов с настройками, то мы увидим, что вложенные настройки представлены по принципу аккордеонов, что достаточно удобно.

    Список настроек

    В панели опций имеется 8 разделов с настройками:

    Basic

    В данном разделе представлены базовые настройки шаблона:

    Helix Ultimate → Basic
    Helix Ultimate → Basic
    • Logo

      Выбор типа логотипа (картинка или текст) и его высоты, если это будет картинка. Также можно отдельно выбрать логотип для мобильных.

    • Header

      Установка высоты хедера, его «залипания» при скролинге, а также выбор фавикон.

    • Body

      Активация предзагрузчика (без доп. настроек) и фиксированной ширины макета (Boxed layout) с настройками.

    • Footer

      Активация копирайта (с возможностью выбора позиции и текста) и кнопки Go to Top (без доп. настроек).

    • Social Icons

      Активация иконок соцсетей с возможностью выбора позиции и вставки нужных ссылок.

    • Contact Info

      Активация контактной информации (номера телефонов, email и время работы). Сомнительная опция из-за ограниченного количества номеров телефонов, которую лучше реализовать другим способом.

    • Coming Soon

      Перевод сайта в закрытый режим и настройка отображаемой страницы (заголовок, контент, дата, логотип, фоновое изображение и социальные иконки)

    • Error Page

      Настройка страницы, отображаемой при ошибке 404 (выбор логотипа и фонового изображения).

    Presets

    Здесь мы увидим список предустановленных стилей с возможностью их кастомизации:

    Раздел Presets

    После активации переключателя Custom Style можно будет кастомизировать цвета в позициях:

    • Body
    • Header
    • Top Bar
    • Menu
    • Footer

    Layout Builder

    Это всё тот же конструктор макета модулей и позиций из Helix 3, представленный в новом интерфейсе:

    Layout Builder в интерфейсе Helix Ultimate
    Layout Builder в интерфейсе Helix Ultimate

    Конструктор позволяет создавать адаптивные макеты страниц с расстановкой модульных позиций:

    Макет шаблона в Layout Builder
    Макет шаблона в Layout Builder

    Как и прежде, макеты формируются по-принципу 12-колоночной сетки Bootstrap. По умолчанию используются предустановленные настройки, но всегда можно их переопределить: макет будет реагировать на изменение размеров экрана по определённым вами условиям.

    • В Helix Ultimate можно использовать предустановленные хедеры (Predifinied Headers). На текущий момент имеется две вариации с предустановленной схемой. Можно не применять эти вариации, а просто создать свою строку (строки) с нужными модульными позициями.
      Predifinied Headers
      Predifinied Headers
    • Каждая строка имеет собственную структуру колонок.
      Определение структуры строки
      Определение структуры строки
    • Каждая строка и колонка может быть настроена индивидуально (резиновая или фиксированная ширина строк, отображение на разных типах устройств, отступы, фон, цвет текста и другие стили). Настройки открываются при клике на соответствующую иконку внутри строки или колонки.
    • Можно менять местами строки и колонки, используя функцию перетаскивания (Drag & Drop).
    • Добавлять новые строки можно при клике на иконку «+», которая появляется при наведении на существующую строку (новая строка появится под ней).
      Добавление новой строки
      Добавление новой строки
    • На каждую колонку можно назначать одну модульную позицию.
    • Одна модульная позиция может быть назначена в одну и более колонок (в таком случае позиция и модули в ней будут дублироваться на странице).

    Navigation

    Раздел настроек меню с двумя подразделами:

    • Mega Menu

      Здесь выбирается меню, которое размещается в позиции Menu по умолчанию. Также здесь можно установть фиксированную ширину и тип анимации для выпадающих подменю.

    • Off-canvas

      Здесь можно выбрать, с какой стороны будет открываться и отображаться мобильное меню.

    Typography

    Раздел с настройками шрифтов (шрифт, размер, насыщенность и начертание) для разных элементов типографии.

    Helix Ultimate → Typography → Body
    • Body

      Здесь определяются стили, применяемые к глобальному тегу <body>.

    • Headings (h1-h6)

      Опционально можно настроить шрифты для каждого из тегов заголовков.

    • Navigation

      Данные настройки будут применены к элементам навигации (тег <nav>).

    • Custom

      Настройки шрифта для пользовательских элементов, перечисленных в текстовой области.

    • Update Font List

      Здесь можно ввести Google Font API, чтобы быстро обновлять список шрифтов Google.

    Внимание:
    Не рекомендуется использовать слишком много шрифтов и их начертаний, т. к. это может сильно увеличить время загрузки страниц. Оптимально применять не более 2-х шрифтов.

    Blog

    Здесь скрываются дополняющие настройки для материалов Joomla (com_content).

    Helix Ultimate → Blog
    • Images

      Установка фиксированных размеров для вариаций изображений (маленькое, миниатюра, среднее или большое), установленных для материалов: исходные картинки будут уменьшаться и обрезаться до установленных. На разных страницах (блог или сам материал) и в разных её элементах (блог) показываются разные вариации изоборажений.

      Helix Ultimate → Blog → Images
    • List

      Выбор вариаций картинок, отображаемых в списке материалов.

      Helix Ultimate → Blog → List
    • Details

      Выбор вариации картинки, отображаемой на странице материала, а также активация кнопок «Поделиться» (Social Share), информации об авторе (Author Info) и мета-тегов Open Graph.

    • Comments

      Выбор сервиса (Disqus, IntenseDebate, Facebook) для интеграции комментариев с множеством настроек в зависимости от выбранного сервиса.

    Custom Code

    Здесь имеется целых 4 текстовых поля для ввода пользовательского кода:

    • Before </head>

      Любой код, который будет вставлен перед закрывающим тегом </head>. Это может быть мета-тег, CSS, JS или код подключения файла (файлов)

    • Before </body>

      Аналогично, только код будет выводится перед закрывающим тегом </body>.

    • Custom CSS

      Любой CSS-код.

    • Custom Javascript

      Любой JS-код.

    Advanced

    Дополнительные настройки шаблона:

    • Compression

      Здесь можно активировать сжатие и объединение в один файл CSS- и JS-кода. Не следует включать эти опции, если аналогичные функции выполняет другое расширение (например, JCH Optimize).

    • SCSS

      Здесь можно активировать опцию Compile SCSS to CSS.

    • Import & Export

      Здесь можно импортировать или экспортировать существующие настройки.

    Настройки пунктов меню

    Фреймворк Helix Ultimate добавляет 2 дополнительные вкладки на страницы редактирования пунктов меню:

    • Mega Menu
    • Page Title

    Mega Menu

    В этой вкладке находятся дополнительные настройки пунктов меню, добавляемые фреймворком Helix Ultimate.

    Настройки Mega Menu для вложенных пунктов
    Настройки Mega Menu для вложенных пунктов
    • Mega Menu

      Активация расширенных параметров (только для пунктов меню первого уровня):

      • Width - фиксированная ширина выпадающего меню.
      • Align - выравнивание текста в выпадающем меню.
    • Show Menu Title

      Отключение опции позволяет скрыть пункт меню из списка.

    • Dropdown Position

      Положение выпадающего меню относительно родительского пункта.

    • Icon

      Добавление иконки из шрифта FontAwesome к пункту меню.

    • Custom Class

      Добавление CSS-класса к пункту меню.

    • Badge

      Текст метки, отображаемой в пункте меню (если не требуется, то следует оставить поле пустым).

      Helix Ultimate Mega Menu → Badge
    • Badge Position

      Позиция метки (слева или справа от текста).

    • Background Color

      Цвет фона метки.

    • Text Color

      Цвет текста метки.

    Page Title

    Эта опция позволяет отображать название пункта меню в качестве заголовка в специальной позиции шаблона:

    Вкладка Page Title
    Вкладка Page Title
    Отображение Page Title
    Отображение Page Title
    • Enable Page Title

      Активация опции.

    • Alternative Title

      Альтернативный заголовок, который будет отображаться вместо названия пункта меню.

    • Page Subtitle

      Текст, отображаемый под заголовком.

    • Heading H1 or H2

      Тег для заголовка (<h1> или <h2>).

    • Background Color

      Цвет фона позиции.

    • Background Image

      Фоновое изображение.

    Важно знать:
    С точки зрения SEO применять опцию Page Title некорректно, т. к. теги заголовков должны быть в пределах основного контента. К тому же на странице крайне не желательно размещать более одного тега <h1>, а заголовки <h2> должны быть под ним.

    Настройки материалов

    Helix Ultimate добавляет вкладку Blog Options, в которой содержатся дополнительные настройки, определяющие тип материала:

    Вкладка Blog Options
    Вкладка Blog Options
    • Featured Image

      Позволяет определить формат материала (Standart, Video, Gallery, Audio) и выбрать дополнительный контент.

      Это интересная иполезная опция. Например, если задать материалу тип Video, то вместо картинки материала будет отображаться видеоролик (нужно указать URL). Также от типа контента будет зависеть иконка возле заголовка.

    • Post Format
    Важно знать:
    Эта опция практически полностью идентична аналогичной из Helix 3, лишь с тем исключением, что были удалены невостребованные вариации из Post Format.

    Где скачать шаблоны на Helix Ultimate?

    Шаблонов на новом фреймворке на момент написания данного обзора не много, но это лишь вопрос времени: Helix 3 больше не обновляется разработчиком, а Bootstrap 4 постепенно заменяет предыдущую версию.

    • www.joomshaper.com.
      Сайт разработчика фреймворка Helix с шаблонами собственного производства.

    • themeforest.net.
      На текущий момент в списке имеется 29 коммерческих шаблонов на Helix Ultimate.

    Выводы

    Фреймворк Helix Ultimate является обновлённой и усовершенствованной версией Helix 3. В первую очередь различия кроются в интерфейсе и некоторых новых настройках шаблона, а также в применении последней версии Bootstrap.

    Внимание!
    Возможности фреймворка Helix Ultimate подробно рассматриваются в курсе Ваш сервис по созданию Landing Page на CMS Joomla.

    Обзоры других фреймворков:

    Какие шаблоны для Joomla самые лучшие?
    Helix 3 Framework: возможности и настройки
    Warp 7 Framework: возможности и настройки
    Какие шаблоны для Joomla самые быстрые?
    Шаблоны для создания Landing Page на Joomla
    YOOtheme Pro: возможности и настройки
    Helix Ultimate: возможности и настройки
    T3 Framework: возможности и настройки
    previous arrow
    next arrow
    Slider
    • Интересно сравнить этот фреймфорк с Gantry5. Есть ли у него преимущества?
    • Уважаемый Виктор, сам до недавнего времени юзал исключительно Gantry на клиентских сайтах, ибо удобен, практически безглючен и прост. А затем шаловливые ручонки дорвались до Хеликса, и надо сказать, есть у него свои очевидные плюсы - гибкая настройка фона в любой строке чего стоит (в Джантри фоны для секций жестко определены, и надо править вручную шаблон, добиваясь нужного эффекта). Так что да, преимущества всё же есть. Не сочтите за рекламу. Сам пока что однозначного выбора не сделал, да, по-видимому, он и не нужен - суб-движок на Джумлу выбирается либо "потому что знаю досконально", либо "а вот эти встроенные фичи как раз подходят". Успехов Вам.
    • А как же недостатки? Helix 3 пожалуй лучший в мире на данный момент шаблонный фреймворк для Joomla. А вот Helix Ultimate унылое и глючное Г. Несмотря на добавление ряда новых функций, в целом этот фреймворк очень сырой и значительно уступает в удобстве своему предшественнику. UX был принесен в жертву современным тенденциям в дизайне интерфейса и вау эффекту. Совершенно не юзабельное окно предпросмотра, которое только занимает место. Особенно это становится заметным и раздражающим при работе с несколькими стилями. При этом все настройки смещены в сайд бар, очень мелкие, 100500 аккордеонов - всё это заставляет напрягать зрение и совершать миллионы лишних кликов. При плотной работе реально начинает болеть палец от левого клика. Половина функций не работает, поэтому, что бы привести эту хреновину в порядок требуются написание своего css кода. Кэш шаблона ужасен. Для применения некоторых изменений требуется чистить кэш joomla постоянно - то есть внесли мелкую настройку - очистили кэш. Это еще плюс 100500 экстра кликов. Полный оф форум жалоб на этот провал joomshaper. Многие новые "фичи" - это наоборот недостатки. Варианты хедера - их всего два и для пользователя не знакомого например со структурой Helix 3, становится невозможным кастомизировать хэдер. Svg логотип ведет себя непредсказуемо - его то плющит то коробит. Поэтому использование старого доброго png остается в приоритете. И можно продолжать до бесконечности... Разработчики обещают выкатить большое обновление летом. Посмотрим. Но на данный момент не стоит пользоваться этим шаблоном для реальных или сложных проектов. Берите старый добрый Helix 3. Поддержка joomla 4 в нем будет (по заверениям разработчиков). Поэтому бояться перехода не стоит. Конечно же это всё мое ИМХО, но основано оно на постоянной практике работы с этими продуктами
    • Вы частично правы, а именно в отношении багов, что естественно для новых разработок. По сути Helix Ultimate — это всё тот же Helix 3, завёрнутый в другую упаковку и приправленный Bootstrap 4. Интерфейс просто непривычный относительно старого фреймворка, а аккордионы в нём наоборот способствуют юзабилити. И да, явно не хватает привычной возможности работать в полноценной панели управления, но свои плюсы в совмещенном режиме тоже есть.
    • Попробуйте поработать с несколькими стилями шаблона и поймёте всю никчемность и бесполезность совмещенного режима. Не вижу ни одного плюса. В чем плюс аккордеонов? В том, что надо совершать множество лишних кликов и все настройки не перед глазами? Весьма сомнительный плюс. Единственный плюс в том, что всё выглядит красиво ;)
    Комментарии для сайта Cackle

    Как быстро разобраться в Joomla

    Joomla.center is not affiliated with or endorsed by the Joomla! Project or Open Source Matters. The Joomla! name and logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.

    Joomla!® является торговой маркой компании Open Source Matters inc в США и др. странах. Название Joomla! и его вариации используются в рамках ограниченной лицензии, определённой компанией Open Source Matters. Проект joomla.center не относится к компании Open Source Matters или проекту Joomla! Точки зрения представленные на данном сайте не являются официальными точками зрения Joomla Project или Open Source Matters. Торговая марка Joomla® и логотип используются в рамках ограниченной лицензии, предоставленной Open Source Matters.

    © Александр Куртеев. Центр обучения Joomla.
    ОГРНИП 307434525600161, ИНН 434540800305
    Все права защищены. © 2008 - 2019

    Договор оферты | Политика обработки персональных данных
    Согласие с рассылкой | Отказ от ответственности