Справочные материалы по работе с CMS Joomla

Конструктор

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

1. Название страницы (имя пункта меню).
2. Название секции.
3. Редактирование секции.
4. Дублировать секции.
5. Сохранение секции в библиотеке. Потом можно использовать на других страницах или скачать в виде файла для использования на другом сайте.
6. Удалить секцию.
7. Добавить элемент (текстовыми блоками, картинками, видео, слайдерами и т.д.).
8. Название элемента.
9. Дублировать элемент.
10. Сохранение элемента в библиотеке. Потом можно использовать на других страницах или скачать в виде файла для использования на другом сайте.
11. Удалить элемент.
12. Редактировать строку.
13. Дублировать строку.
14. Удалить строку.
15. Добавить строку.
16. Иконка, указывающая, что в элементе используется динамический контент.
17. Иконка, указывающая, что элемент отображается на планшетах в ландшафтной (альбомной/горизонтальной) ориентации и на экранах с бóльшим разрешением.
18. Иконка, указывающая, что элемент скрыт на планшетах в ландшафтной (альбомной/горизонтальной) ориентации и на экранах с бóльшим разрешением.
19. Добавить раздел.

Настройки секции. Секция – это одна или несколько строк. Настройки секции разделены на три раздела:

1. Контент (рисунок ниже). Позволяет задать фоновое изображение, видео (с YouTube или Vimeo) и декоративный заголовок.
2. Настройки.
3. Еще.

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

Настройки строки. Строка может состоять из одной или пяти колонок (столбцов). Колонки могут быть разной ширины (фиксированной или нет). Подробнее об особенностях ширины можно узнать в документации к фреймворку UIkit. Настройки строки разделены на два раздела:

1. Настройки.
2. Еще (рисунок ниже). Данный раздел содержит опции аналогичные одноимённому разделу секции.

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

Есть несколько макетов колонок (рисунок ниже). Обратите внимание, что ширина колонок указана не в чётком фиксированном значении в пикселях, а в частях от общей ширины той области, в которой они расположены. Например, «Quarters 2-1-1» – это три колонки, первая (левая) по ширине занимает столько же, сколько занимает вторая и третья колонки вместе взятые, вторая колонка занимает по ширине половину ширины первой колонки, третья – аналогична по ширине второй.

Есть макеты с фиксированной колонкой. Например, «Fixed-Left» – первая (левая) колонка занимает фиксированную ширину, а вторая занимает оставшуюся часть по ширине.

У каждого макета есть свои настройки. Рассмотрим их на примере макета двух колонок с – «Halves» (рисунок ниже). Опции Смартфон в портретном режиме, Смартфон в альбомном режиме, Планшет (Альбомной ориентации), Настольный компьютер и Large Screen позволяют задать ширину каждой колонки в долях или фиксированных значениях для разных экранов.

Например, 1/2 – означает, что колонка будет занимать 50% от доступной ширины (родительского контейнера). А Large – 450 пикселей. 

Обратите внимание, что в сумме все колонки должны занимать всю доступную ширину. То есть, если для первой колонки задано 1/2, то и для второй тоже надо задать 1/2. Также можно для одной колонки задать 1/2 или Small, а для второй – Expand. Expand указывает на то, что колонка должна занять всё оставшееся пространство.

Если значение ширины для какого-то экрана не задано, то применяется значение ширины следующего более маленького экрана.

Опция Order First позволяет указать экран (устройство, точку разрыва) на котором данная колонка будет отображаться перед остальными колонками. На меньших экранах колонка будет отображаться в обычном порядке.