Приветствуем Вас уважаемые сайтостроители. В этом мини курсе от Виктора Гавриленко хотели предложить Вам ознакомиться с видео уроками по теме создание компонента для Joomla за 2 вечера.

Сегодня в интернете, Вы сможете найти большое количество компонентов для CMS Joomla. Каждый компонент решает свои задачи и само собой возникает вопрос — зачем создавать, когда можно найти готовый. Скачать или приобрести его и установить движок.

Но не каждый компонент который установите, может идеально работать и выводить именно те функции и задачи, которые Вы желаете видеть. Многие веб мастера стараются найти бесплатные решения и не платить за него. Тогда в этом, Вам поможет мини курс Виктора Гавриленко создание компонента для joomla за 2 вечера.

Но если Вы не продвинутый веб мастер и только еще познаете азы сайтостроения тогда можете использовать три варианта:

• первый вариант — это купить не смотря на её цену,
• второй вариант — это подыскать бесплатный вариант и заняться тем, чтобы его адаптировать для своего сайта, а также приходиться и платные компоненты редактировать под нужды Вашего сайта.
• третий вариант — это научиться создавать самому собственный компонент и решить поставленные задачи на сайте.

Если Вам подходит третий вариант и Вы готовы научиться создавать сами, тогда смотрите мини курс создание компонента для joomla за 2 вечера.

А если Вы сможете выделить еще два вечера, тогда сможете изучить и сверстать шаблон для сайта и в этом Вам поможет обучающий мини курс

Урок 1. Файловая структура компонента Joomla

В первом уроке миникурса мы поговорим о том, как и по какому принципу, работают компоненты системы управления контентом Joomla, как осуществляется взаимодействие элементов компонента, а также создадим файловую структуру будущего расширения.

Урок 2. Установка компонентов Joomla

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

Поэтому в данном уроке мы добавим инструкции по установке компонента в файл манифест, а также поговорим о локализации – то есть переводе элементов расширения на определенный язык.

Урок 3. Точка входа компонента Joomla. Первый вид

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

Урок 4. Страница добавления нового элемента

В данном уроке мы начнем создавать страницу добавления нового элемента в базу данных. При этом мы поговорим о том, как создать форму для ввода данных, как создать дочерний контроллер и каково его предназначение, а также в логическую схему работы компонента добавим модель, которая необходима для формирования данных и последующего сохранения нового элемента в базу данных.

Урок 5. Создание модуля формы Joomla

Из данного урока Вы узнаете, как формируются поля будущей формы, какие типы полей доступны в стандартном функционале CMS Joomla, как отобразить сформированные поля на экране браузера, а также какие особенности создания различных типов полей.

Урок 6. Сохранение и редактирование новостей

В данном уроке мы реализуем механизм сохранения и редактирования новостей будущего компонента. При этом Вы узнаете, как обеспечить работоспособность элементов управления страницы, как сохранить информацию в базу данных о прикрепленном изображении, а также, как и по какому принципу осуществляется сохранение новых элементов.

Урок 7. Отображение списка добавленных новостей

В данном уроке мы закончим функционал панели администратора разрабатываемого компонента, а именно, отобразим на главной странице компонента список ранее сохраненных новостей. При этом Вы узнаете, как получить данные, используя модель, как сформировать запрос для выборки записей из базы данных, как вывести данные, используя макет, а также как реализовать механизм изменения состояния новостей.

Урок 8. Список новостей пользовательской части

В данном уроке мы отобразим в пользовательской части сайта список ранее добавленных новостей. При этом Вы узнаете, как формируется пользовательская часть компонента, как реализовать ссылку в главном меню сайта на интересующий вид компонента, а также как выбрать из базы данных записи по определенным условиям.

Урок 9. Страница детального просмотра новости

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

Третий урок по созданию MVC компонента

В этом уроке мы создадим форму для отправки сообщений, а так же отправим его на указанный E-mail указанный в настройках, сохраним запись в базу данных и выведем пользователю сообщение об успешной отправке сообщения!

Для начала отредактируем XML файл с нашей формой. Файл у нас находится по адресу: components/com_form/models/forms/form.xml
Сейчас этот файл содержит следующий код:

В нашей форме только одно поле с именем test. Нам нужно его удалить(или изменить) и сделать что бы у нас было 3 поля: Имя , E-mail и Сообщение

После добавления этих полей форма у нас будет выглядеть так:

Если обратить внимание у нас появилось несколько дополнительных атрибутов в полях field:

• required="true" - означает что поле будет обязательное, если его не заполнить будет ошибка!
• validate="email" - означает что выполнится проверка или в это поле введен E-mail адрес (проверка будет выполняться только на стороне сервера)

Теперь нам нужно вывести эти поля в форме!
Для этого откроем файл components/com_form/views/form/tmpl/default.php

Для вывода полей формы, которые мы перед этим создали в XML файле, используются строки:

//для вывода метки поля из атрибута "label" echo $this->form->getLabel("name"); //для вывода самого поля, название поля содержится в атрибуте "name" echo $this->form->getInput("name");

Теперь нам нужно вывести три наших поля в форме, и код шаблона нашей формы изменится на такой:

В форме у нас есть одно скрытое поле:
это поле означает что наш скрипт запустит задачу save в контроллере form

И еще одна непонятная конструкция в форме это: .
Эта конструкция на самом деле всего лишь вставляет скрытое поле с уникальным значением! Служит это поле для защиты отправки формы вне сайта, то есть не выйдет создать на каком то чужом сайте форму с такими полями и отправлять на адрес этой формы какой либо спам!
Приблизительная его работа - в сессии генерируется случайное значение, и выводится в этом поле, после отправки формы проверяется или это значение пришло и совпадает ли оно с тем что установлено в форме!

На этом вывод формы завершен!

Теперь нам нужно зайти в контроллер нашей формы который находится по адресу: components/com_form/controllers/form.php . В нем есть такая строка:

$this->view_list = "Form";

В этой строке мы указываем на какой вид мы попадем в случае успешной отправки нашей формы. Так как мы хотим выводить отдельный вид result на котором будет сообщение которое мы заполняем в конфигурационном файле, то смело меняем значение в этой строке на result :

$this->view_list = "result";

Теперь приступим непосредственно к отправке письма и сохранения в архив записи!
Открываем нашу модель: components/com_form/models/form.php .

В модели у нас есть метод:

Public function save($data){ return parent::save($data); }

Который выполняет сохранение данных и в случае успешного сохранения возвращает true . В этом методе есть одно значение $data которое представляет из себя асоциированный массив, в котором будут значения из отправленных в форме полей!
То есть например в $data["name"] - будет значение из поля "Имя"

Теперь нам нужно сформировать тело письма, отправить письмо и сохранить его в базе данных! Эту часть у нас выполнит следующий код:

Public function save($data){ //Формируем тело сообщения $body = "

"; $body .= ""; $body .= ""; $body .= ""; $body .= "

Имя:	" . $data["name"] . "
E-mail:	" . $data["email"] . "
Текст сообщения:	" . $data["text"] . "

"; //Получаем данные из конфиг файла $params = JComponentHelper::getParams("com_form"); //Адрес получателя письма $recipient = $params->get("recipient"); //Тема письма $subject = $params->get("subject"); //Получаем экземпляр таблицы form_messages $table = $this->getTable("form_messages"); //Данные которые запишем в базу данных $archiveData = array("title" => "Сообщение от " . $data["name"], "text" => $body); //Заносим данные в таблицу $table->bind($archiveData); //если удалось сохранить запись в базу данных то отправляем E-mail if ($table->store()) { //Отправляем почту //Получаем данные о конфигурации сайта $config = JFactory::getConfig(); //Получаем экземпляр класса JMail $mailer = JFactory::getMailer(); //Указываем что письмо будет в формате HTML $mailer->IsHTML(true); //Указываем отправителя в качестве отправителя письма адрес и название которые у нас хранятся в конфиге сайта $mailer->setSender(array($config->get("mailfrom"), $config->get("fromname"))); //Указываем тему письма $mailer->setSubject($subject); //указываем получателя письма $mailer->addRecipient($recipient); //Добавляем текст письма $mailer->setBody($body); //Отправляем письмо $mailer->send(); //возвращаем true тем самым говоря что сообщение успешно отправлено return true; } //Не удалось по какой то причине отправить сообщение return false; }

Теперь наша форма сохраняет данные в базу данных, и отправляет данные на E-mail который вы указали в настройках нашего компонента в административной части!

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

Войдите в административную панель Joomla по адресу http://вашсайтру/administrator, введите логин и пароль. У вас откроется главная страница админ. панели.

Где: 1) Главное меню Joomla; 2) Панель быстрого доступа.

Главное меню админ. панели Joomla

Начинающих пользователей путают понятия модулей плагинов, компонентов и их расположение. Давайте попробуем разобраться в этом вопросе:

В Joomla есть 3 основных компонента "Менеджер пользователей", "Менеджер меню", "Менеджер материалов", они отделены от всех других, и для удобства и быстрого доступа, вынесены в отдельные пункты "Пользователи", "Меню" и "Материалы". Остальные можно найти открыв меню "Компоненты".

Пункт верхнего меню "Система" - здесь вы сможете произвести основные настройки сайта, выбрать редактор, очистить кэш, посмотреть информацию о движке и системе. А с выходом версии Joomla 3 теперь можно настроить и любой компонент.

Пункт меню "Пользователи" . Тут вы сможете добавлять, удалять, одобрять новых пользователей, делать рассылку, настроить права для пользователей, создать группы пользователей. Ваш профиль администратора с настройкой пароля, email, редактора, тоже находится в менеджере пользователей.

Пункт "Меню" . Если нужно добавить или изменить пункты меню на front-end сайте, то этот компонент поможет. Можно создавать отдельные группы меню сайта и выводить их при помощи модуля. В пунктах меню формируются ссылки на страницы сайта. Т.е. создавая пункт можно выбрать, на страницы какого компонента он будет вести. А компонент в свою очередь наполняется нужной информацией, которою можно вывести при помощи пункта меню. Кроме того можно сделать индивидуальные настройки отображения страницы на которую он ведет. Например указать "Показывать заголовок страницы или нет", "Какой шаблон отображать для этой страницы", "Настроить отображение мета информации страницы", "Порядок пунктов меню", "Какой из пунктов меню будет главной страницей", "Опубликовать пункт меню или скрыть" и др.

Пункт меню "Материалы" . С помощью этого компонента Joomla можно создавать страницы сайта с текстовым и медиа-, контентом. Страницы можно сортировать по группам при помощи категорий с неограниченной вложенностью. Материалы и категории можно выводить списком, в виде блога или по отдельности. Настройка отображения материалов производится через сам компонент, либо через общие настройки.

Пункт меню "Компоненты" . Тут вы найдете список всех установленных компонентов и сможете перейти в любой из них. Компоненты служат для создания и управления разного вида контента например каталог, магазин, форум и т.д.. Вывести содержимое компонента можно через меню выбрав его из списка.

Пункт меню "Расширения" - в подменю этого пункта вы найдете менеджеры модулей, плагинов, языков и шаблонов. А так же менеджер установки новых расширений, в том числе и компонентов.

Компоненты, модули, плагины и шаблоны Joomla

Для того, что бы двинуться дальше нужно разобраться в том, что лежит в основе этой CMS. Работа с Joomla строится на 4 основных видах расширений, которые создают практически неограниченные возможности по наращиванию функционала сайта, от визитки до полноценного интернет-магазина.

1. Компоненты - это скрипты, которые обладают наибольшей функциональностью и выводят основной контент сайта (статьи, галереи, ССК, форумы, ссылки, поиск, редакторы). Основные компоненты уже встроены в ядро joomla, остальные можно скачать бесплатно или купить и установить на свой сайт.
2. Модули - это расширения, которые дополняют компоненты и отображают нужную информацию на сайте. Например: пункты меню сайта создаются в компоненте, а выводятся при помощи модуля; Форма поиска выводится при помощи модуля, информация из формы обрабатывается компонентом, который в свою очередь выводит результаты поиска; Список последних новостей выводится при помощи модуля, но сами новости создаются с помощью компонента "Менеджер материалов".
3. Плагины - это еще один вид расширений функциональности. Плагины выполняют заложенную в них функцию в момент появления определенного события в системе. К примеру это удобно для отображения одного и того же визуального редактора, выбранного пользователем для всей системы, в разных компонентах и модулях.
4. Шаблоны - позволяют настраивать вид отображения компонентов, модулей и дизайна сайта. Для работы с шаблонами требуются навыки HTML и CSS. Некоторые шаблоны обладают богатым набором настроек, который позволяет менять его вид без навыков верстки и программирования.

Я так и не понял в чем разница компонентов, модулей и плагинов.

Тогда нужно посмотреть на front-end сайта и разобраться где модули, а где содержание компонентов. для наглядности выделил все модули красной рамкой, а компонент зеленой.

Где модули:

1) Модуль "Меню"; 2) Модуль "Календарь"; 3) Модуль "Произвольный HTML код" - где при помощи визуального редактора я разместил и настроил вид блока; 4) Модуль "Последние новости" - выводит последние материалы из выбранной категории. Тут выведено сразу три модуля с названиями "Конкурсы", "Новости", "События", по сути это одно и тоже только названия и категории материалов разные.

Компоненты:

5) С помощью компонента в данном случае выводится материал с заголовком "О проекте" и текстом.

Здесь я написал небольшое руководство для начинающих о том как пользоваться Joomla. Более подробную информацию о том как работать с Joomla вы сможете узнать из ссылок по теме в низу страницы.

В этом уроке мы создадим простой компонент, который строчку «Hello!» в браузере.
Перед тем, как начать создавать компонент, у Вас на сервере должна быть установлена CMS Joomla 1.5. Если Вы еще не установили, то это можно сделать с помощью уроков в разделе «Установка Joomla ».

В этом уроке сначала создадим папку компонента под названием com_hello, в которую нам нужно добавить пять файлов:
site/hello.php - точка входа в наш компонент;
site/controller.php - содержит наше основное управление компонентом (Контроллер);
site/views/hello/view.html.php - обрабатывает данные и передает их в шаблон для вывода;
site/views/hello/tmpl/default.php - шаблон для вывода данных;
hello.xml- XML служит для передачи инструкций для Joomla по установке компонента.

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

CMS Joomla всегда обрабатывает ссылку в корневом файле index.php для страниц Front End (сайт) или administrator/index.php для страниц Back End (админ-панель). Функция обработки URL загрузит требуемый компонент, основанный на значении "option" в URL (метод GET) или переданных данных методом POST.

Для нашего компонента, URL выглядит так:
index.php?option=com_hello&view=hello

Это означает, что если пользователь введет в браузере строчку http://имя сайта/index.php?option=com_hello&view=hello, то переменная «option» получит значение «com_hello&view=hello».

http://имя сайта/components/com_hello/hello.php.

Код для этого файла довольно типичен для всех компонент:

execute(JRequest::getVar("task")); // Переадресация $controller->redirect(); ?>

Примечание к коду:

JPATH_COMPONENT – это абсолютный путь к текущему компоненту; в наше случае - components/com_hello.
Для Front End - JPATH_COMPONENT_SITE
Для Back End - JPATH_COMPONENT_ADMINISTRATOR
DS означает автоматический выбор слеша (разделителя директорий) "\" или "/".
JRequest:getVar() находит переменную в URL (или в данных POST). Например, наш URL может выглядеть так index.php?option=com_hello&controller=controller_name, тогда мы можем получить имя нужного нам контроллера, используя:
echo JRequest::getVar(“controller”).

Сейчас мы используем наш базовый контроллер-класс HelloController в com_hello/controller.php. При необходимости, добавляем контроллер HelloControllerController1 из com_hello/controllers/controller1.php.

Такой стандарт упрощает схему многозадачного компонента (это будет использоваться в последующих уроках, в данном случае в нашем компоненте одна задача).

Теперь мы инструктируем контроллер исполнить задачу, которая определена в URL: index.php?option=com_hello&task=sometask. Если нет определения задачи, то по умолчанию будет задача "display". Когда используется задача "display" , переменная "display" укажет то, что выводить. Пример стандартных задач - save, edit, new...

На последней строке кода контроллер переадресовывает страницу. Обычно используется для таких задач как SAVE.

Главная точка входа (hello.php) пропускает управление на контроллер, который обрабатывает выполнение задачи, которая была определена в запросе.

Создание Контроллера

Так как наш компонент имеет только одну задачу (вывод «Hello»), то он будет очень прост. Никакой манипуляции данными не требуется. Все что нужно сделать, это загрузить необходимый view. Поэтому, мы будем иметь только один метод в нашем контроллере: view (). Большинство требуемых функциональных возможностей уже встроено в JController класс. Потому мы должны только вызывать метод JController:: view ().

Код основного контроллера site/controller.php такой:

Конструктор JController будет всегда по умолчанию регистрировать задачу display() используя метод registerDefaultTask(), если не определена другая задача. В самом деле, метод display() не нужен после того, но в нашем случае он есть хорошей демонстрацией того, что делает контроллер.

Метод JController:: display() метод определит имя view и шаблон из запроса, потом загрузит view и установит шаблон. Когда Вы создаете пункт меню для вашего компонента, менеджер меню позволит администратору выбирать задачу с которой начинать выполнение компонента.

В нашем компоненте, view имеет единственное значение - hello и шаблон имеет единственное значение - default (по умолчанию).

Создание вида (view)

Для создания вида нужно извлечь данные, которые будут отображаться, и передать их в шаблон. Данные передаются в шаблон с помощью метода JView::assignRef

К од Вида в файле site/views/hello/view.html.php следующий:

assignRef("greeting", $greeting); parent::display($tpl); } } ?>

Создание шаблона

Joomla шаблоны являются файлами PHP, которые создают вид данных. Переменные, переданные с помощью метода JView::assignRef можно получить из шаблона с помощью $this->propertyname.
В нашем простом шаблоне site/views/hello/tmpl/default.php мы только выводим на экран приветствие.

greeting; ?>

Создание hello.xml

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

Но лучше создать xml файл, и тогда Установщик Joomla все сделает за вас. XML файл может содержать разнообразную информацию и инструкции по установке:

• Общую информацию о компоненте и авторе.
• Список файлов, которые нужно скопировать из архива, с указанием куда копировать;
• По-необходимости можно добавить скрипты сопровождающие установку и удаление компонента;
• По-необходимости можно добавить файлы с sql-запросами, которые будут выполняться при установке и удалении компонента.

Наш XML файл выглядит так:

Hello 2007 02 22 Имя Автора author собачка mail.net http://www.autor.net Копирайт Лицензия Component Version String Description of the component ... index.html hello.php controller.php views/index.html views/hello/index.html views/hello/view.html.php views/hello/tmpl/index.html views/hello/tmpl/default.php Hello World! index.html admin.hello.php

Создайте также в каталоге admin файлы admin.hello.php и index.html. Оставьте их пока пустыми.
Как Вы заметили, каждая папка имеет файлы index.html (рис. 2.1). Файлы index.html помещают в каждый каталог, чтобы препятствовать пользователям получать листинг каталога.
Эти файлы содержат одну единственную строку:

С помощью этих файлов будет отображаться пустая страница.
У нас получился простейший компонент.

Архив исходных файлов для этого урока можно скачать по этой ссылке:

Outdated translations are marked like this.

There are also a number of videos which accompany steps in the tutorial, beginning with
Step 1, Developing a Basic Component and you can access the slides which are used in the series of video presentations at Slides .

Important! Around version 3.8 the Joomla developers started changing the naming of Joomla classes and where they were stored in the directory structure. Many of the tutorial steps and videos refer to the old naming convention. To find the equivalent new class and where it"s stored, look in your libraries/classmap.php file.

Как добавить компонент на Joomla! ==!Н!В данной статье мы рассмотрим, как создать и установить базовый компонент на Joomla! . В этом примере мы будем работать с компонентом Hello World!.

Чтобы начать, вы должны сначала использовать нужный файл менеджер для создания каталога для компонента Hello World! . Этот каталог может быть где угодно в файловой системе, пока это за пределами вашего Joomla! директорию. В этом примере мы назовем каталоге com_helloworld , но эта директория может называться как угодно.

1		это XML-файл (манифест) файл, который говорит Joomla! как установить наш компонент.
2		это сайт точка входа для компонента Hello World!
3
4		предотвращает листинг из веб-сервера содержимого директории
5		это точка входа администратора в компонент Hello World!
6		предотвращает листинг из веб-сервера содержимого директории
7		предотвращает листинг из веб-сервера содержимого директории
8		предотвращает листинг из веб-сервера содержимого директории
9		файл, позволяющий инициализировать версию схемы компонента com_helloworld.

Установка Компонента Hello World! ===!Н!Используя ваш любимый файловый менеджер, создайте.zip файл из этого каталога. В данном примере мы будем использовать Имя файла com_helloworld.zip снова, хотя этот файл можно было назвать как угодно.

Теперь нам нужно установить компонент Hello World!. Есть два способа сделать это, оба показаны в Установке расширения . Здесь мы рассмотрим способ с использованием диспетчера расширений для Joomla!.

• Используя ваш любимый веб-браузер, перейдите в панель администратора вашего Joomla! сайт. Адрес, например, /joomla/administrator/index.php . Для этого примера мы будем ориентироваться на localhost/joomla/administrator/index.php .!Н!
• Выберите дополнительные модули Extensions → Manage → Install → Upload Package File → Choose File!Н!
• Перейдите и выберите файл!Н!
• Нажмите Кнопку " Загрузить & Установить

Примечание - Вы должны увидеть сообщение, показывающее, что установка выполнена успешно.

Вы можете протестировать основные функции компонента, введя Hello World! страницы для сайта и административной части вашего Joomla! сайта.!Н!

• Используя ваш любимый веб-браузер, перейдите к Hello World! компонент страницы, расположенной на части вашего сайта. Адрес бы /joomla/index.php?option=com_helloworld . Для этого примера мы будем ориентироваться на localhost/joomla/index.php?option=com_helloworld .!Н!
• Используя ваш любимый веб-браузер, перейдите к странице компонента Hello World!, расположенной в административной части вашего сайта. Адрес бы /joomla/administrator/index.php?option=com_helloworld . Для этого примера мы будем ориентироваться на localhost/joomla/index.php?option=com_helloworld .

Вы можете также заметить, что компонент Hello World! виден в административной части сайта после установки Joomla в подменю "компоненты".

Файл Детали

admin/sql/updates/mysql/0.0.1.sql файл, позволяющий инициализировать версию схемы компонента com_helloworld.

helloworld.xml

Hello World! January 2018 John Doe [email protected] http://www.example.org Copyright Info License Info 0.0.1 Description of the Hello World component ... sql/updates/mysql index.html helloworld.php

"index.php?option=com_helloworld" > Hello World! index.html helloworld.php sql

site/helloworld.php