JL Slideshow

  • Эффект появления при "скролле" мышью

    AOS - анимация

    далее...

  • Возможность доп. анимации

    title - meta - description

    далее...

  • Слайд-шоу имеет несколько режимов

    push - pull - slide - fade - scale

    далее...

 15 июня 2022 года вышел новый релиз компонента Gantry 5.5+ , который в корне меняет подход к "генерации" стилей на сайте. Релиз 5.5.14 реально упрощает работу администратора - теперь не надо переносить данные по шрифтам и вариациям стилей из старого, модернизированного файла theme.yaml в новый при  обновлении шаблона, например Helium.

План модернизации стилей на любом шаблоне Gantry5 под управлением Joomla3 может состоять из следующих пунктов:

Замена стилей кнопок навигации вперед - назад.
Замена размера кнопок в частицах Gantry5 и добавление новых цветов для кнопок.
Добавления нового базового цвета в сам шаблон.
Добавление спецэффектов для секции и кнопок.
Добавление новых стилей для текста, картинок и т.д.
Спецэффекты при размещении частицы в определенной секции или модуле

При простом обновлении шаблона Helium на Gantry 5.4.37 до новейшей версии 5.5.7 на экране сразу возникает ошибка 500 - белый экран с надписью ERROR , а в адимистративной панели появляется  список с множественными ошибками, связанных с модернизацией scss файлов в папке custom

Сайт падает - теряем клиентов. Надо срочно исправлять ошибку 500. Что делать?

Gantry 5  - это новая, революционная система управления контентом,  созданная для облегчения работы веб-разработчиков сайтов. За счет великолепной интеграции может работать с популярными движками CMS - Joomla, WordPress и Grav. Gantry5 использует удобный графический интерфейс и функцию перетаскивания мышью, которые позволяют изменить макет вашего сайта за считанные секунды.

Любой шаблон от Gantry5 имеет, как правило, несколько предустановленных стилей, идущих в комплекте с базовым стилем. При этом увеличить количество цветов шаблона, например с 2-х до 6-и цветов, достаточно просто. В Gantry5 это можно осуществить с помощью yaml- и scss- файлов. Yaml позволяет создать в административной панели блок с заданными цветовыми решениями, а scss отобразить все это на стороне браузера пользователя.

Box 2

Стиль этого элемента HTML настроен так, чтобы посетители проявляли удивление, просматривая страницу вашего сайта.

button button-4

Почти все современные сайты используют файлы с расширением .SVG. Код SVG встречается в формате шрифтов, кнопок, иконок и изображений. Использование SVG дает приемущества использования на сайте. Первое, это векторная технология - рисунок не теряет качество отображения на различных экранах. Второе, это легковесность файла -  обычно не больше 10 килобайт. 

Любой шаблон от Gantry5 имеет, как правило, несколько предустановленных стилей, идущих в комплекте с базовым стилем. При этом увеличить количество цветов шаблона, например с 2-х до 6-и цветов, достаточно просто. В Gantry5 это можно осуществить с помощью yaml- и scss- файлов. Yaml позволяет создать в административной панели блок с заданными цветовыми решениями, а scss отобразить все это на стороне браузера пользователя.

button default

button button-pink

button button-3

 

При навигации по статьям в одной категории в Joomla предусмотрены стилизованные кнопки "вперед" и "назад". В шаблоне Helium (Hydrogen) в этом случае появляются несуразно большие овальные кнопки навигации. Есть несколько путей изменения стилей этих кнопок : вариант 1 - модернизация стиля кнопки в в файле _core.scss в самом шаблоне или изменение стиля кнопки в  файле _core.scss с помощью папки custom (вариант 2 и 3).

Создание уникального стиля для сайта дело хлопотное, но его можно существенно облегчить, используя как типовые фреймворки и библиотеки - UIKIT 3.3, BOOTSTRAP 4.4, JQUERY 3.4, SWIPER 5.3 и т.д., так и конструкторы сайтов (платные и бесплатные). Документация по популярным фреймворкам расположена на официальных сайтах, здесь же приведены примеры использования HTML - кода и подключения необходимого javascript для создания типовых модулей со спецэффектами.

В сентябре 2018 года команда разработчиков Joomlead выпустила новые обновленные Particles for Gantry5 (частицы для Гентри5), почти полностью заменив старую линейку Particles и Atoms. Теперь к бесплатному применению пользователю предлагаются некоторые частицы, которые раньше были в premium пакете. В новом бесплатном пакете всего предлается 26 частиц и атомов. 

Стандартное основное горизонтальное меню представлено на шаблонах Gantry5 довольно таки хорошо. Меню может сочетать в себе анимацию при наведении (fade, zoom, bounce), а также содержать иконки Icon и Image для наглядности. Возможна настройка ширины выпадающего списка (в px) и количества колонок в выпадающем списке (при этом должна соблюдаться кратность в px - например, стандартная ширина меню в шаблоне 180px (вкладка Layout шаблона Helium) 

При переносе новых particles и sections к себе на сайт, при рекомпиляции, частенько возникает ситуация, когда в правой части административной панели шаблона возникает оранжевое предупреждение  - не определена переменная, функция, миксин.

Возможности модернизации бесплатных шаблонов (в т.ч. через папку custom) от разработчиков фреймворков T3, HELIX, ASTROID, WARP, YOOTHEME и GANTRY5 и их сравнение. 

Возможность отсутствует.
Возможность предусмотрена.
Реализовано так-себе. 
Реализовано неплохо. 
Реализовано относительно хорошо. 

 

Любой шаблон на Gantry 5 от Rockettheme можно модернизировать, улучшить. Не секрет, почти все ранние версии шаблонов - Antares, Acronym, Citadel, Ethereal, Flux, Galatea, Interstellar, Isotope, Notio, Protean, Remnant, Salient, Supra, Sienna, Versla, Xenon и др. - содержат те или иные ошибки. Конечно, Вы можете оформить платную подписку на эти шаблоны и регулярно получать обновления от разработчиков, не заморачиваясь - но этот путь не для меня. Во-первых, это дороговато - 49$, а во-вторых, вы получете только доспуп только к частицам одного шаблона, а их всего на коммерческом шаблоне около 30 штук.

Создать красивый, адаптивный сайт с безупречным дизайном мечта любого фронтенд-разработчика. Но не всегда красота и быстрая загрузка сайта идут в паре. Как раз все наоборот. Одним  из критериев успешного проекта по созданию сайта на Gantry5 является скорость загрузки страницы.

На коммерческих шаблонах Rockettheme установлено около 10 модификаций частицы Image Grid - она присутствует на каждом шаблоне. Служит для вывода фотографий и изображений - и может иметь поля навигации при просмотре всего альбома картинок.

1 тип - галерея картинок имеет сдвиг колонн по вертикали, а при наведении на изображение подсвечивает надпись в оверлее (шаблоны Versla, Gemini)

1-ое место по популярности среди всех типов частиц Gantry5 занимают всевозможные слайдеры - ни один сайт не обходится без них. При этом смена изображений в модуле слайдера  может происходить как простое чередование галереи фотографий с opacity, так и с замысловатыми переходами, со спецэффектами. Обязательными аттрибутами являются кнопки перехода - так называемые sidenav (next/prev) и dots.

Как мы выяснили, частицы-исходники Gantry5 на коммерческих шаблонах от Rockettheme - это игра в лотерею. При переносе на шаблон, даже с учетом рекомендаций по структуре папок и файлов, Вам может не повезти, и частица не будет правильно работать или не будут правильно отображаться стили, задуманные разработчиком.  Чтобы избежать этого, выполним процедуру лечения частиц Gantry5 (только для продвинутых пользователей Gantry5)

Для создания новых секций воспользуемся шаблоном Antares - названия и стили возьмем готовые - Bottom, Extension, Fixedside, Showcase, Slideshow, Top, Overlay, Старые и новые секции (*) разместим в нужном для нас порядке 

При установке на любой шаблон Gantry 5 нескольких типовых частиц от Rockettheme может наблюдаться ситуация, когда при очередной установке новой частицы вдруг нарушается вся структура сайта (сдвигаются кнопки, пропадает навигация, изменяются размеры и толщина букв и т.д., вплоть до исчезновения модулей на странице).