Как пользоваться плагин в joomla

Как пользоваться Joomla 3. Руководство для начинающих.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    Правильное подключение стилей и JS плагинов в Joomla

    Пост был обновлен: Фев 22, 2018

    Всем привет! В прошлой статье я рассказывал о jQuery плагине модальных окон для сайта Magnific Popup. В статье я затронул подключение плагина к сайту, но в данной статье хочу показать, как правильно подключать стили, jQuery плагины и скрипты на Joomla (в том числе и инициализация плагинов). В комментариях к статье как-то интересовались этим вопросом и конкретно интересовала Joomla. Ну что ж, думаю этот вопрос многих заинтересует. В качестве примера подключения плагина возьму опять таки Magnific Popup. Все остальные плагины подключаются примерно также.

    Подключение стилей

    Давайте сначала подключим файл стилей, т. к. сначала всегда подключаются стили, а потом уже скрипты на JS. Обычно файл стилей обзывают — style. css. Он может быть общим, также могут быть и дополнительные — меню (menu. css), адаптивная сетка (gride. css), типографика (typography. css) и т. д.

    Итак, для подключения стилей открываем главный файл вашего шаблона — Index. php. Расположен он по адресу — «/templates/папка вашего шаблона/index. php«. Открываем данный файл любым текстовым редактором, а еще лучше редактором кода — Sublime, Notepad++ и др. и в начале документа выше кода «defined(‘_JEXEC’) or die;» вставляем следующий код:

    У меня файл стилей style. css лежит в папке «CSS». Проследите за тем, чтобы был указан именно правильный адрес до файла стилей. Обратите внимание в адресе вместо названия папки шаблона подставлен код «$this->template«. Данный код автоматически выводит название папки шаблона, т. е. если вы вдруг переименуете папку, то новое название папки выведется автоматически.

    Также желательно все пути до стилей и скриптов указывать в абсолютном виде, т. е. с доменом сайта. Для этого мы создаем переменную «$baseUrl» и заносим в нее значение «JUri::base()«. Можно конечно сразу в путь дописать «JUri::base()«, не создавая переменную. Но так лучше делать, если вы используете «JUri::base()» только один раз, а если хотя бы 2 раза и более, то лучше уже через переменную. Таким образом, код будет быстрее интерпретироваться сервером и потреблять меньше памяти. На глаз вы можете это и не заметить, но тем не менее нужно делать именно так.

    В результате в исходном коде страницы в секции «<head></head>» у нас появится строка подключения файла стилей.

    Если вы хотите подключить несколько файлов стилей, то просто копируете подключение выше и меняете имя файла.

    Можно также подключить еще один файл стилей в самом файле style. css, используя импорт — @import url(‘путь до файла’). Открываете подключенный файл стилей, в моем случае это файл style. css, и в самом начале вставляете следующий код — @import url(‘gride. css’); У меня файл gride. css лежит в той же папке, что и файл style. css. Если у вас они лежат в разных папках, то указывайте правильный путь.

    Все, с подключением стилей разобрались. Теперь давайте перейдем к скриптам.

    Подключение скриптов

    Скрипты подключаются примерно также, как и стили. Ниже строки подключения стилей выводим следующий код:

    В результате в исходном коде страницы в секции «<head></head>» получим строку подключения скрипта Magnific Popup:

    Вообще, я в последнее время не подключаю скрипты в head, т. к. скрипты тормозят загрузку страницы. Я подключаю их в конце документа до закрывающего тега «</body>«. Подключение делаю следующим образом:

    Как видим здесь скрипт подключается также, как и в любом другом html-документе.

    Подключение скриптов в зависимости от jQuery (jQuery плагины)

    Теперь давайте поговорим о том, как подключать jQuery плагины. jQuery плагин это скрипт, написанный на языке программирования javaScript, используя методы jQuery, но тут есть некоторые моменты в подключении вместе с библиотекой jQuery.

    Сразу скажу о порядке подключения. Если ваш скрипт работает в зависимости от jQuery, (любой jQuery плагин), то его подключение всегда должно идти ниже подключения библиотеки jQuery. JQuery всегда идет выше. Далее, инициализация плагина — инициализация всегда идет ниже подключения самого плагина. Получается следующая иерархия:

  • Подключение jQuery;
  • Подключение плагина jQuery;
  • Инициализация плагина
  • Подключать нужно именно в таком порядке, иначе ничего работать не будет, а в консоль логе вы получите ошибку, впрочем об ошибках мы еще поговорим ниже.

    Как я говорил выше в Joomla скрипты я подключаю в нижней части страницы, а библиотека jQuery подключена в секции «<head></head>«, правда подключение из ядра Joomla я отключаю и подключаю из CDN с помощью небольшого плагина. Как это делать я расскажу в следующей статье, поэтому подписывайтесь на обновления. Также, я отключаю библиотеку Mootools, которая также подключается из ядра. Иногда она вызывает конфликты скриптов, да и не нужна она вовсе. Сегодня практически все плагины работают на jQuery.

    Покажу подключение и инициализацию плагина Magnific Popup на примере:

    Инициализацию (вызов плагина) надо всегда обрамлять кодом

    Которая говорит браузеру, что инициализировать плагин нужно, когда объектная модель страницы уже загружена и готова к работе. Иначе, у вас работать ничего не будет. Также вы можете встретить и такое обрамление:

    Это одно и тоже, просто в первом случае мы локализуем псевдоним «$«, чтобы он у нас не конфликтовал с другими библиотеками, которые могут быть подключены на сайте. Например, библиотека Mootools в Joomla. Есть также и такая запись:

    Я всегда пользуюсь первым вариантом.

    Также хотелось бы отметить, что подключать стили скрипты можно не только в файле index. php, но и во внутренних страницах. Например, у вас модальное окно работает только на определенной странице определенного компонента. В этом случае логичнее будет сделать подключение стилей и скриптов именно в шаблоне данного компонента, отвечающий за вывод содержимого. К примеру, это может быть страница товара магазина Joomshopping. Для того, чтобы подключить стили вставим на страницу шаблона знакомые строчки:

    Как видим подключение файла стилей ничем не отличается от подключения в файле index. php шаблона сайта. Только единственное здесь вместо кода «$this->template» не будет выводиться название вашего шаблона. Вписываем его руками. Также в секцию «<head></head>» можно сразу вставить стили. Для этого вставим следующий код:

    Таким же образом подключаем и скрипты:

    Добавим код javaScript в Head документа:

    Подробнее про подключение стилей и скриптов вы можете прочитать в официальной документации Joomla. Если загляните в документацию, то заметите, что подключать стили и скрипты можно также и через класс JHtml. Примерно так:

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

    Возможные ошибки. Консоль браузера

    Бывает такое, что вроде бы все сделали правильно, а не работает. Что не так и где искать ошибку? В первую очередь необходимо заглянуть в консоль браузера на наличии в нем ошибок. Чтобы открыть консоль на открытой в браузере странице нажимаем клавишу «F12» и в открывшемся инспекторе кода переключаемся на вкладку «Console». Вот как выглядит консоль в браузере Google Chrome.

    Вот как выглядит консоль в Mozilla Firefox:

    Консоль в Firebug браузера Mozilla Firefox. Для тех, кто не знает что такое Firebug — это расширение для Firefox инспектора кода, написанный сторонним разработчиком.

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

    С консолью разобрались, теперь перейдем к ошибкам…

    Uncaught referenceError: JQuery is not defined

    Данная ошибка говорит о том, что не найдена библиотека jQuery. Тут есть два варианта — либо вы неправильно указали путь до jQuery, либо у вас jQuery подключена ниже других скриптов. Решение я думаю вы поняли какое должно быть.

    TypeError: $(…).*** is not a function

    Вместо *** будет подставлен метод, который создает плагин jQuery. Например, в Magnific Popup это метод — «magnificPopup();«. Так вот, если вы не подключите сам плагин Magnific Popup (я беру его для примера) и создадите вызов данного плагина, то в консоле у вас может появиться следующая ошибка — «TypeError: $(…).magnificPopup is not a function». Такая ошибка может возникнуть также, если вы подключите сам плагин ниже кода инициализации скрипта.

    TypeError: $(…).ready is not a function

    Данная ошибка может возникнуть, если вы не локализовали алиас «$«. Например, если на вашем joomla сайте подключена библиотека Mootools, то вам следует знать, что Mootools также, как и jQuery использует алиас «$«, поэтому нужно ее локализовать. Как это сделать я писал выше и показывал три варианта.

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

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

    Пока и до новых встреч!

    Пост был обновлен: Фев 22, 2018

    Заур Магомедов

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

    Giftd для Joomla

    Плагин интеграции и сервиса по увеличению продаж

    Giftd для Joomla — этот плагин позволяет упросить интеграции Joomla и сервиса Giftd, который за счет своих маркетинговых инструментов позволяет повысить продажи вашего бизнеса. Поддерживаются магазины: VirtueMart, JoomShopping и HikaShop.

    Плагин разработан по заказу сервиса Giftd.

    В комплект входит:

    Внимание! Для работы плагина требуется регистрация в сервисе Giftd.

    Что такое Giftd?

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

    • Перейдите в раздел «Расширения» → «Менеджер плагинов». Найдите плагин Giftd с помощью строки поиска и кликните по его названию.
    • Выберите необходимый вам компонент магазина.
    • Выберите пользователя администратора магазина.
    • Укажите в соответствующее поле ID пользователя Giftd (user_id).
    • Впишите в соответствующее поле ключ API Giftd (api_key).
    • Впишите в соответствующее поле Код партнера Giftd.
    • Укажите префикс кодов подарочных карт.

    Специфические настройки плагина для компонентов интернет магазинов.

    • Обязательно заполните настройку «Продавец Virtuemart». Как получить ее? Меню «Компоненты» → «VirtueMart» → «Производители». Укажите ID базового вендора.
    • Меню «Компоненты» → «VirtueMart» → «Конфигурация». В разделе «Настройки магазина» должна быть включена опция «Включить плагины Joomla».
    • Меню «Компоненты» → JoomShopping → «Настройки» → «Товар». Опция «Использовать плагины в описании?» должна быть включена.
    • Меню «Компоненты» → «HikaShop» → «Конфигурация». Раздел «Система» → «Валюта». Смотрите код валюты в поле «Основная денежная единица».

    По материалам:

    Http://www. opengs. ru/webzametki/kak-polzovatsya-joomla-3-rukovodstvo-dlya-nachinayushhih. html

    Http://zaurmag. ru/joomla/podklyuchenie-stilej-i-js-plaginov-v-joomla. html

    Http://joomline. ru/rasshirenija/plugin/giftd. html