Вход | Регистрация

Создаём модуль для Joomla

создание модуля для Joomla 3

Рассмотрим как создать свой модуль для Joomla 3. На примере создания кнопки Вконтакте "Напишите нам".


Что нужно для самостоятельного создания модуля для Joomla?

  • Умение работать с самой Joomla
  • Знание HTML и CSS
  • Понимание в PHP (хотя бы чуть чуть)
  • Немного внимательности

Этого достаточно) Остальное придёт с опытом.

Создание модуля для Joomla условно можно поделить на 4 этапа.

  1. Создание главного функционала (или поиск готового решения)
  2. Подготовка файлов модуля
  3. Внедрение функционала в модуль
  4. Тестирование

 

Создание главного функционала

Обычно функции модулей довольно простые.
Это вывод чего либо на сайте: виджет группы, слайдер, соц.кнопки, карта Яндекса, форма заявки и т.д.
Т.е. здесь не нужны массовые вычисления.

Поэтому можно взять что-то готовое и немного изменить под задачи.

К примеру, когда я делал свой первый модуль для Joomla, то взял готовый скрипт формы обратной связи.
Он был уже протестирован и код его был очень простой.
3 поля и кнопка отправить + скрипт который получал данные из формы и отправлял их при помощи функции mail()

Мы с вами тоже не пойдём в дебри, и возьмём готовый код виджета Вконтакте, который выводит кнопку "Напишите нам".
Код виджета можно получить здесь - https://vk.com/dev/ContactUs

как сделать модуль для joomla 3

Из настроек тут только ID группы.
Чтобы людям было проще, разработчики ВК сделали поле для ссылки на группу.
Обычная ссылка на группу выглядит так - https://vk.com/club27841519
Где 27841519 - это ID группы.

Мы тоже сделаем такое поле, но не для URL адреса группы, а для её ID.
Чтобы не заморачиваться с получением ID из ссылки, будем сразу указывать ID.

Мы будем подставлять в код виджета переменную из нашего поля, пусть она будет называться $group_id

На этом подготовка (и продумывание) главного функционала готово)

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

 

Подготовка файлов для модуля Joomla

Для работы модуля нужно несколько системных файлов.

Но для начала давайте дадим название этому модулю. Пусть это будет vk_contactus

От этого названия и будем отталкиваться при создании файлов.

Создаём папку vk_contactus и в ней файлы:

mod_vk_contactus.php - основной файл модуля. Как видите у него есть приставка mod_ 
Такая приставка используется для модулей.
В этом файле можно подключить JS скрипты, CSS файлы и включить некоторые другие опции.

mod_vk_contactus.xml - это xml файл настроек модуля и параметров при его установке

ru-RU.mod_vk_contactus.ini - перевод языковых констант на русский язык.

КОНСТАНТА="русский перевод, каждый с новой строки, без запятых"

ru-RU.mod_vk_contactus.sys.ini - перевод системных языковых констант на русский (обычно этот файл пустой).

Можно создавать дополнительные языковые файлы, например en-GB.mod_vk_contactus.ini - для английского перевода.
Если будет несколько переводов, то удобнее положить их в папку language.

Далее создаём папку tmpl - она нужна для хранения шаблонов (макетов) модуля.

default.php - это собственно файл с шаблоном модуля. Он у нас будет один, больше нам и не надо.

 

Скачать архив файлов для создания модуля можно по этой ссылке.
В файлах уже приведён некотрый код для примера.

Либо в конце можно скачать готовый модуль.

В каждом php файле нужно указать defined('_JEXEC') or die;
Это запрет на прямое обращение к файлу извне.

Файл настроек давайте разберём подробнее.

 

XML файл настроек

Что там внутри?

xml version - версия xml документа и кодировка.

extension - тип расширения, в данном случае - модуль.
Ещё тут указывается версия joomla, client - это site или admin (сайт или админка) и метод установки - upgrade позволяет устанавливать новую версию модуля поверх старой. Это удобно, если вы постоянно обновляете свой модуль.

файлы модуля joomla 3

name - название модуля

author - имя автора модуля

creationDate - дата создания

license - тип лицензии

authorEmail - емейл автора

authorUrl - сайт автора

version - версия расширения

description - краткое описание модуля, здесь можно указать языковую константу, и потом в языковых файлах перевести её на нужный язык.

В блоке files указываются файлы и папки модуля.
filename - имя файла (для главного файла модуля добавляется module="его название", смотри пример в файле)
folder - имя папки

В блоке languages указываются языковые файлы
Если языковые файлы лежат без папки, то folder="language" не указывается.

В блоке config записываются поля для настройки модуля.

fields - Блок с полями для ввода параметров

fieldset - вкладка с полями, где name - название вкладки

field - поле с параметрами.

Будет лучше, если вы сами посмотрите этот файл и разберёте его содержимое.
А сейчас немного о типах полей.

 

Типы полей для ввода настроек

По сути, это обычные поля типа input, select и т.д.
Просто в Joomla они называются немного по другому.

Полный список полей можно посмотреть в документации

Мы добавим одно поле, в котором будем указывать ID группы ВК.

поле для настроек модуля joomla

И разберём что здесь.

  • name - уникальное имя поля
  • type - тип поля (текстовое, выпадающий список, выбор цвета и т.д.)
  • default - значение поля по-умолчанию (необязательное)
  • label - подпись поля, я указал языковую константу
  • description - всплывающая подсказка (необязательное)

В документации по ссылке выше указаны все типы полей, посмотрите.

 

Внедрение функционала в модуль

Модуль простой, поэтому внедрение тоже простое.

Главный файл модуля mod_vk_contactus.php

В главном файле модуля мы указываем:

$document = JFactory::getDocument(); 

это нужно для подключения css и js файлов в шапку сайта (head).

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

CSS файлы подключаются так:

$document->addStyleSheet(JURI::base() . 'modules/mod_vk_contactus/css/default.css');

Где modules/mod_vk_contactus/css/default.css - это путь до css файла.

 

JS файлы подключаются так: 

$document->addScript(JURI::base().'modules/mod_vk_contactus/js/script.js');

где modules/mod_vk_contactus/js/script.js - путь до js файла.

 

Кроме подключения файлов, нужно ещё включить суффикс класса модуля, для него есть специальное поле в настройках каждого модуля.
Он нужен для кастомизации внешнего вида модуля. Суффикс включается этой строчкой:

$class_sfx = htmlspecialchars($params->get('class_sfx'));

И в самом конце подключаем шаблон (макет) модуля. Это файл default.php в папке tmpl
Делаем это вот такой строкой:

require JModuleHelper::getLayoutPath('mod_vk_contactus', $params->get('layout', 'default'));

При разных условиях, могут быть разные макеты.

 

Файл макета default.php

Здесь мы объявляем переменную и вставляем код виджета.

Переменная, в неё пишем значение из поля ID группы

$group_id = $params['group_id'];

 

Код виджета, со вставкой переменной $group_id:

 

Тестирование

Здесь настроек почти нет, и функционал прост, поэтому на тестирование уйдёт всего пара минут)

Если же вы создаёте более сложный модуль, то обязательно тестируйте его на ПК и на мобильных, при разных условиях, и в разных браузерах.

На этом всё, спасибо за внимание.
Готовый модуль можно скачать тут >>

Можете разобрать код других наших модулей, ради благого дела я не против)

Желаю удачи!

С уважением, Олег Касьянов.

С уважением, Олег Касьянов

Сохраните эту информацию к себе, чтобы не потерять:

И подписывайтесь на наш онлайн-журнал.
С уважением, Олег Касьянов.

Комментарии

Оставьте ваше мнение

*

Получать уведомления о новых комментариях

X

Спасибо!
Ваш комментарий появится после одобрения

нашли ошибку? напишите
X

Вход

Ваш e-mail:

Ваш пароль:


Забыли пароль?
Регистрация

X

Нашли ошибку или баг? Напишите мне.

placeholder="Опишите пожалуйста где вы нашли ошибку и какую, буду вам очень благодарен">

^ Наверх