ВВЕДЕНИЕ
В этой статье я хотел бы рассказать о создании модуля вопросов и ответов для Joomla. В интернете очень много различных примеров, в том числе и в официальной документации, но как правило для новичков бывает сложно самостоятельно разобраться в том или ином примере. Поэтому чем больше существует материалов по данной тематике - тем проще сравнить их между собой, понять принципы, логику и так далее.
В частности в этой статье мы рассмотрим создание модуля вопросов и ответов. Я искал в интернете, нашел кучу статей о создании модулей в принципе, но ни одного, который бы подходил под мои нужды. Поэтому было принято решение написать об этом статью.
Используемые навыки: html, css, bootstrap v4, php, xml, joomla
Что вы узнаете:
- Файловая структура модуля Joomla
- Использование поля subform
- Принципы и порядок создания модулей
Создание модуля F.A.Q. для CMS Joomla
Прежде, чем мы непосредственно приступим к разработке модуля - прочитайте оговорки (это важно на самом деле):
- Правильным было бы упаковать все стили и JS-скрипты в сам модуль, как это сделать - я обязательно напишу, а в данном конкретном примере мне это не нужно, поскольку я писал реальный модуль под реальный шаблон, и все стили модуля - уже есть в шаблоне, дублировать их не имеет смысла.
- При разработке модуля правильным будет создавать языковые файлы и прописывать константы. Я опять же не стал этого делать, почему - потому что на данный момент мне это не нужно.
- Я не использовал в модуле вспомогательный класс helper, поскольку модуль совсем простенький.
Остальное будем рассматривать по ходу статьи.
Техническое задание
И так, наша задача заключается в следующем: необходимо разработать модуль вопросов и ответов (F.A.Q.) для CMS Joomla. Его задача - выводить вопросы и ответы согласно имеющемуся статичному html-шаблону. Также в админке должна быть реализована возможность быстрого добавления вопросов и ответов на них. Вот в принципе и все, а ниже скриншот того, что нам необходимо получить:
HTML-код модуля, который мы будем реализовывать выглядит следующим образом:
Теперь давайте разберем подробнее, что же мы видим. А видим мы что наш модуль использует классы Bootstrap. Также мы видим, что каждый вопрос и ответ на него расположены в блоке card и что эти блоки повторяются:
Теперь давайте посмотрим, что же именно нам нужно менять в каждом из блоков, а что можно оставить в шаблоне:
- Нам нужно вбивать вопрос в админке
- Нам нужно вбивать ответ в админке
Это самое основное, но помимо этого мы видим в нашем коде несколько ID:
И так, первый из них - это ID блока с вопросом id="headingOne", этот же ID дублируется в ответе в атрибуте aria-labelledby="headingOne". Атрибут aria-labelledby предназначен для связи между объектами и метками, он содержит ID меток для того, чтобы вспомогательные технологии (средства чтения экрана и т.д.) могли собрать все метки в каталог. Поэтому нам обязательно нужно, помимо вопроса и ответа, поле ID.
Второй идентификатор, который мы видим в data-target="#collapseOne" - дублируется еще в двух местах, и если вы заглянете в документацию Bootstrap, то увидите, что благодаря именно этому идентификатору у нас работает collapse, то есть схлопывание/развертывание. Если, к примеру, мы возьмем data-target с первого вопроса и назначим этот ID третьему ответу, то при нажатии на первый вопрос нам откроется третий ответ.
Также внизу в коде мы видим еще и два изображения плюс описания для них. Для них мы тоже создадим возможность редактирования с админки.
Подытожим: нам в админке модуля должны быть доступны следующие вещи:
- Написать вопрос
- Написать ответ на этот вопрос
- Написать ID для data-target
- Написать ID для aria-labelledby
- Выбрать изображения
- Написать два описания для них
На этом пока все, но к нашему исходному шаблону мы еще вернемся.
Файловая структура модуля для Joomla
Файловая структура стандартного модуля имеет следующий вид:
- mod_faq.xml
- mod_faq.php
- helper.php
- tmpl
-- default.php
mod_faq.xml - это файл-манифест, он содержит всю информацию о модуле, файлы, которые должны быть установлены, а также параметры конфигурации модуля.
mod_faq.php - единая точка входа для модуля, он вызывает helper, а также подключает макет вывода модуля, кроме этого там же мы подключаем стили и так далее
helper.php - файл, который содержит вспомогательный класс для выполнения необходимых расчетов, обращения к БД и так далее
tmpl - папка с файлами макетов
default.php - макет вывода информации
В нашем случае файловая структура будет немного другой:
- mod_faq.xml
- faq_field.xml
- mod_faq.php
- tmpl
-- default.php
Мы убрали helper, поскольку у нас простой модуль, и можно обойтись без вспомогательного класса, а все необходимые скрипты выполнить либо в mod_faq.php (мы так и сделаем), либо даже в default.php. Кроме того, как я говорил выше - мы не будем подключать стили нашего модуля, поскольку пишем модуль для имеющегося шаблона, в котором эти стили уже есть, нам остается только написать классы и все. По этой же причине я не стал использовать конструкцию $moduleclass_sfx = htmlspecialchars($params->get('moduleclass_sfx')); , которая получает суффикс класса модуля из параметров (Внимание: по хорошему следовало бы ее использовать, поскольку вполне вероятно, что в дальнейшем вы захотите добавить какие-то классы для модуля).
faq_field.xml - специальный файл, который мы затронем позже, пока что просто создайте его и все.
Полностью статью читайте по адресу
