В Joomla 4.3 появилось интересное нововведение — Guided Tours или Обучающие туры.
По сути, Guided Tours – подсказчики. Они пошагово показывают, куда надо нажать или что заполнить, чтобы реализовать какую-то опцию на сайте. Туры состоят из шагов, с помощью которых вы постепенно выбираете и заполняете все нужные поля и в конце вас поздравят с успешным созданием чего-то.
Содержание
Обучающие туры по Joomla
Если выбрать любой имеющийся в системе Joomla 4.3 тур, то быстро становится понятно, о чем это и зачем.
На данный момент стандартный набор обучающих туров в Joomla 4.3 такой:
- Как создать баннеры;
- Как создать контакты;
- Как создать умный поиск;
- Как заполнить ленту новостей;
- Как создать пользователя;
- Как создать категории;
- Как создать статью;
- Как создать Guided Tour и как добавить шаги в Guided Tour;
- Как создать теги.
Из названий туров легко можно понять, что в итоге получит пользователь при прохождении тура – новую статью, пользователя, баннер, ленту новостей или собственный обучающий тур.
Ссылка на все обучающие туры доступна в верхнем меню на любой странице админки. Для редактирования любого тура необходимо сначала зайти в пункт Система - Guided Tours (к настоящему моменту термин “Guided Tours” не переведен в локализации Joomla, что, наверняка, случаться в ближайшем будущем, поэтому будем использовать его как есть. В будущей локализации он, скорее всего, будет заменен на «Обучающие туры»).
При создании обучающего тура он отображается в списке всех Guided Tours и также доступен в верхнем меню на любой странице админки.
Пример создания обучающего тура
Для примера мы создадим обучающий тур по модулю формы обратной связи Wedal Joomla Callback. Все последующие картинки будут относиться именно к нему.
Настройки модуля выглядят так:
Нам нужно, чтобы при помощи обучающего тура пользователь настроил и опубликовал модуль у себя на сайте.
Этап 1. Планирование
При создании своего собственного тура по Joomla можно сначала прописать каждый этап/шаг в любом текстовом документе. Таким образом у вас под рукой всегда будет скелет создаваемого тура. Поверьте, это очень удобно.
Этап 2. Создание базового тура
Итак, после планирования приступаем к непосредственному созданию тура.
Здесь надо указать:
- Понятное и емкое название тура
- URL, откуда начинается тур. Должен быть относительным, т.е. в формате /administrator/index.php?...
- Описание тура (отображается в списке туров)
- Выбрать селектор компонента: в нашем случае это модуль, поэтому мы выбираем модули.
Так выглядит список туров, в самом низу отображается только что созданный нами тур.
Этап 3. Создание шагов тура
Для того, чтобы создавать или редактировать шаги, нужно нажать на цифру напротив названия тура.
После этого мы попадаем в меню этого конкретного тура. Тур новый, поэтому шагов у него пока нет. Наживаем кнопку «Создать».
Для создания шага необходимо:
- Ввести название шага
- Заполнить описание шага (необязательно)
- Выбрать позицию подсказки
- Заполнить поле target
- Выбрать тип взаимодействия с пользователем
Первые два пункта не должны вызывать сложностей, поэтому рассмотрим поподробнее только 3, 4, 5 пункты.
В поле Position выбираем позицию подсказки относительно элемента, с которым должен взаимодействовать пользователь. Удобнее выбирать позицию: Внизу (Bottom). Но вы конечно можете выбрать любую другую позицию.
По умолчанию выбрана позиция Центр, вот она по использованию неудобна, потому как перекрывает поле, с которым пользователь взаимодействует. Ее можно будет использовать в самом конце тура, когда будем поздравлять пользователя с успешным созданием элемента.
В поле Target надо ввести id или class элемента, на котором будем фокусировать пользователя. Напомню, что id – уникальный идентификатор элемента на странице в то время как class может встречаться на странице неоднократно, система будет выводить первый class на своем пути.
Для определения id или class элемента используем встроенный в браузер инструмент разработчика, он откроется при нажатии клавиши F12. Наводим инструментом выделения на нужный элемент и узнаем его id или class.
Подробнее о том, как это работает можно почитать в статье: Руководство по Firebug для веб-разработчиков (сам Firebug уже не используется – его заменил встроенный в браузер инструмент разработчиков, однако он работает ровно по тем же принципам, что описаны в статье).
Чтобы вставить id нужно добавить перед названием «#». Для вставки class нужно добавить в начало названия «.». По опыту создания туров могу сказать, что это поле чуть ли не ключевое при создании шага. Если ввести неправильный id или class система просто не поймет, куда направить пользователя и вставит подсказку в левый верхний угол страницы.
В поле Type нужно выбрать тип взаимодействия с пользователем. Здесь может быть 3 варианта:
- Кнопка «Next» («Далее») как продолжение тура без взаимодействия;
- «Redirect» («Перенаправление») для перехода на другую страницу;
- «Интерактивно» для ввода данных пользователем. Если вы выбираете этот пункт, то система просит уточнить, какие именно данные будет вводить пользователь: отправлять форму проверки (Form Submit), вводить текстовые данные Text Field, нажимать на кнопку (Button), или что-то выбирать из списка (Other). В случае с вводом текстовой информации одинаково хорошо работают и вариант Next, и вариант Interactive - Text Field.
Этап 4. Проверка созданного тура
После создания тура он появляется в общем списке всех туров.
При запуске тура, он будет перенаправлять пользователя по шагам, которые вы ему указали. Вот так, например, выглядит 4-й шаг созданного нами тура.
В конце созданного тура мы просим нажать пользователя кнопку «Сохранить и закрыть», после чего выходит сообщение об успешно созданном модуле.
Помимо рассмотренных опций созданные туры можно дублировать и перенастраивать каждый из них по своему усмотрению.
Также для разработчиков включили возможность создания языковых констант для туров. Таким образом можно переводить туры на несколько языков как это сделано с созданными по умолчанию турами.
Что в итоге?
Текущие неудобства при создании туров:
- При многократном редактировании шагов тура он может начать работать с ошибками. Если есть шаги в туре, которые нужно отлаживать, есть смысл создать отдельный тур с этим шагом и отлаживать его отдельно от остального тура во избежание ошибок в основном туре.
В целом инструмент замечательный, позволяет буквально водить пользователя за руку. И тут неважно начинающий это пользователь или продвинутый, которому нужно быстро освоить новое расширение.
Разработчики обещают, что имеющийся функционал – это только вершина айсберга. Уже в следующих версиях Joomla запланированы различные дополнения. Туры станут более подробными и полезными. Добавятся другие туры, например, тур по панели инструментов. Будет и такое нововведение как запуск тура после входа пользователя в систему. Туры будут создаваться и для фронтэнда.
В общем, еще есть куда развиваться. Нам же уже сейчас можно изучать и использовать доступный в Joomla 4.3 функционал обучающих туров.
