Краткое описание.
Был переопределен стандартный компонент Блог категории материалов. На его базе создан альтернативный макет, включающий в себя файл с настройками blog.xml
Этот макет можно выбрать в настройках меню "Тип пункта меню"
Файлы, находятся в каталогеtemplates/simple5u/html/com_content/category/
- blog5u.php (основной файл макета)
- blog5u_leading.php (макет вывода во всю ширину)
- blog5u_item.php (макет вывода в колонках)
- blog5u_links.php (макет вывода ссылок)
- blog5u.xml (параметры макета)
Кроме того были переопределены некоторые макеты layouts, отвечающие за вывод заголовка и изображений. Для blog5u были созданы в отдельных файлахtemplates/simple5u/html/layouts/joomla/content/
- intro_image5u.php (изображения)
- blog_items_title_blog5u.php (заголовок)
Большая часть кода компонента и часть настроек осталась без изменения.
Были добавлены настройки, отвечающие за оформление контента и более детально формирующие сетку вывода блоков.
Вкладка Блог
Только для Leading
Настройки блока вывода материалов "во всю ширину"
Во всю ширину - количество материалов которые будут выведены во всю ширину
Главный CSS-класс материалов - Теперь это дополнительные классы для внутреннего контейнера отдельно взятого материала.
Ширина изображения - ширина контенера изображения, выбирается из списка
Расположение - выбор из списка, картинка слева/справа. Если Зеркало - то в шахматном порядке
Выравнивание текста - выбор из списка, если задать авто для Зеркало, то выравнивание будет чередоваться
Размер заголовка (leading) - не тег, а именно размер. Выбирается из списка
Режим отображения - выбор варианта макета, можете посмотреть на демо-сайте в одном из вариантов раздела Блог
Только для интро
Text size - ограничение количества символов в материале (если 0 или не указано - без ограничений). Обрезка текста по ближайшему слову (слова пополам не режет) и добавление многоточия. Режет только introtext, контент выведенный после/до него плагинами и доп. полями - не режет.
Только вводный текст - количество материалов выводимых в колонках
Выравнивание текста - выбор из списка в каждом материале, слева/справа/по центру.
Размер заголовка (intro) - не тег, а именно размер. Выбирается из списка
Остальные настройки вкладки Блог - без изменений, как в стандартном Блоге.
Вкладка Styles
Во вкладке задаютя параметры сетки для колонок, и стили оформления блоков материалов и для колонок и во всю ширину.
Intro Grid
Несколько списков с выбором количества колонок для соответствющего разрешения позволяет настроить сетку максимально корректно.
xLarge > 1400 - Список отвечающий за кол-во колонок при ширине экрана более 1400px. Аналогично по всем остальным спискам.
Как настроить
Если вы хотите выводить контент в 4 колонки до разрешения 960px, не обязательно устанавливать значения для более высоких разрешений, достаточно в списке
Medium > 960 поставить 4,
остальные оставить inherit. Посмотрите и оцените что получилось. Если вы видите что контент не позволяет выводить в таком режиме, поставьте
Medium > 960 - 3,
а Large >1200 - 4.
При разрешении меньше 640 сетка автоматически складывается в 1 колонку.
Внешние отступы - горизонтальные отступы между соседними колонками.
Одинаковая высота - при выборе Да - выравнивает блоки в строке по высоте, при выборе Нет - оставляет все как есть, При выборе Masonry - включает режим "Мозаики".
Удобный режим, когда картинки разных пропорций, длинные заголовки, складывающиеся в несколько строк, и т.п.
Item Style
В этом разделе настройки, применяемые к каждому отдельному блоку материала. На скрине выше - стиль Card. Показаны настройки отсупов, режим fullwidth изображения.
Animation
Анимация изображений - список с мультивыбором:
- icon - при наведении отображаетя иконок
- scale - увеличение при наведении
- background - затемнение изображения при наведении
Можно выбрать нескольких пунктов и даже всех одновременно.
Тип иконки - 2 основных варианта и . Вы можете добавить свой.
Анимация при загрузке страницы - попробуйте самостоятельно и выберите свой вариант
Delay - время задержки при анимайии страницы, по умолчанию 300 мс