JoomGallery — простая и функциональная галерея для Joomla

JoomGallery - галерея для Joomla

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

автор

Автор: Виктор Гавриленко

Меня зовут Виктор Гавриленко, по образованию я инженер электромеханик. Еще учась в институте, начал увлекаться компьютерными технологиями и программированием, на протяжении двух лет усиленно занимаюсь разработкой интернет сайтов и веб-программированием. Увлекаюсь написанием небольших скриптов на языке PHP, в связке базами данных MySQL, SQLite, неплохо знаю такие движки как WordPress, Drupal, Joomla.

скачать исходникискачать урок

Установка компонента

Расширение которое мы рассмотрим в данном уроке называется JoomGalery – это очень мощное расширение, с огромным количеством различных настроек и множеством различных дополнений.

Первым делом давайте установим данное расширение, для этого переходим на официальный сайт Joomla в раздел расширений: http://extensions.joomla.org/. Далее переходим в категорию Photos & Images, и в разделе Popular находим расширение JoomGalery. Кликнув по кнопке Download, нас перенаправляют на сайт разработчика данного расширения.

В разделе Component скачиваем компонент JoomGalery, в разделе Languages скачиваем требуемую локализацию данного расширения. В разделе Modules скачаем модуль вывода изображений галереи JoomImages 3.0, и в разделе Plugins скачиваем плагин отображения изображений в контенте Content-Plugin JoomPlu а также Editorbutton JoomBu (кнопка вставки изображений). Затем устанавливаем скачанные расширения.

Добавление категорий

Расширение JoomGalery поддерживает разбиение изображений на отдельные категории. Поэтому давайте перейдем в ассистент категорий и создадим две категории галерея 1 и галерея 2.

При создании категории вводим как обычно название, краткое описание и псевдоним по необходимости (если оставить пустым – будет создан автоматически). Группа полей подробно:

Родительская категория – выбор родительской категории;

Опубликовано – опубликована или нет категория

Доступ – доступ групп пользователей к данной категории;

Exclude from toplists – исключить категорию их верхних списков?;

Exclude from search – исключить категорию из поиска?

Владелец – выбор владельца;

Миниатюра – иконка категории;

Размещение мини-эскизов – порядок размещения миниатюр.

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

Основные настройки

Переходим в ассистент настроек и как Вы видите настроек очень много и они все сгруппированы по отдельным вкладкам.

Вкладка Основные настройки.Пути и каталоги.

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

Оригинальное изображение – изображение которое загрузил пользователь с неизменными размерами.

Изображение детальный вид – уменьшенная копия изображения, которая просматривается на странице детального вида изображения. Обычно ограничивается шириной 400px;

Миниатюра загруженного изображений – очень маленькая копия загруженного изображения.

Замещения. Здесь указываются параметры замены нестандартных символов в именах загружаемых файлов.

Обработка фото — Настройки связанные с обработкой фотографий при их загрузке в галерею. Параметры которые представляют интерес:

Изменение размера – нужно ли изменять размеры изображений при загрузке;

Максимальный размер фотографий – ограничения размера изображения для детального просмотра;

Качество – качество, с которым будут обрабатываться изображений (100 – без потери качества);

Ширина мини-эскизов, Высота мини-эскизов – размеры для миниатюр.

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

Загрузка в Backend — Параметры галереи при загрузке изображений через панель администратора.

Сообщения — Настройки различных системных сообщений и сообщений о ошибках.

Дополнительные функции — Различные дополнительные функции.

Добавление изображений

Изображения в галерею можно загрузить пятью различными способами:

Загрузка одного фото – поддерживает загрузку одновременно 10 изображений;

Drag’n'Drop Upload – загрузка большого количества изображений одновременно (более правильно добавление в очередь, так как загрузка в любом случае выполняется поочередно);

Загрузка нескольких файлов – добавление архива изображений для загрузки;

Загрузка по FTP – загрузка изображений через протокол FTP.

Загрузка с помощью Java – загрузка изображений с помощью JAVA, но для этого нужен специальный плагин для браузера.

Мне больше всего нравится метод Drag’n'Drop Upload, поэтому его и использую. Добавим несколько изображений в категорию Галерея 1.

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

Вывод галереи на экран

Для вывода галереи на экран – создадим новый пункт главного меню. При выборе типа пункта меню выбираем JoomGalery:

Я использую пункт меню Категории: стандартный вид, то есть страница отображения данных одной конкретной категории. В параметрах нужно выбрать, данные какой категории будут отображаться. Теперь давайте посмотрим, как выглядит галерея:

Настройки галереи (часть 2)

Теперь давайте посмотрим, какие еще настройки доступны нам.

Вкладка Права пользователей.

Загрузка пользователем через «Моя галерея» – JoomGalery поддерживает загрузку изображений через пользовательскую часть Вашего сайта и на данной под-вкладке настраиваются параметры работы данного механизма.

Скачать – настройки параметров скачивания изображений галереи.

Оценки – настройки возможности оставлять оценки элементам галереи.

Комментарии – параметры системы комментариев галереи JoomGalery.

Reports- настройки отправки жалоб от пользователей.

Вкладка Настройки пользовательского интерфейса.

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

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

Вкладка Обзор Галереи – содержит всего одну под-вкладку, и позволяет настроить вид главной страницы галереи. Это страница, которая соответствует типу меню Главная страница: стандартный вид. На данной странице выводятся все категории, добавленные в галерею изображений.

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

Show feed icon – отключаем показ иконки RSS новостей;

Сортировка категорий пользователем – запрещаем пользователям сортировать изображения;

Расположение мини-эскизов / Деталей – по центру;

Показать число просмотров – нет;

Show number of Downloads – показывать ли количество скачиваний – нет;

Показ числа комментариев – нет;

Показать владельца – нет;

Показ числа оценок – нет.

Теперь сохраняем изменения и посмотрим, что у нас получилось.

Теперь идем дальше.

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

Вкладка Настройки ТОП-списков – настройки топ списков. Топ-списки – это строка ссылок в верхней и нижней части галереи:

TOP 12: Лучшие оценки — Самые новые — Последние комментарии — Самые популярные

Я их предлагаю так же отключить, для этого используем настройку Показ ТОП-списков и ее значение Не показывать.

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

Сохраняем изменения и посмотрим, что получилось:

Модули и плагины JoomGalery

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

Установленные плагины нужно активировать, причем плагины работают в паре, так как JoomPlu отображает изображения в контенте страницы, а JoomBU — отображает кнопку добавления изображения к материалу.

Вот собственно я создал тестовый материал “Тест галереи” в котором отображаются изображения из галереи JoomGalery.

На этом данный урок можно завершать. Всего Вам доброго и удачного кодирования!!!

Хотите узнать, как создать собственный шаблон на CMS Joomla с нуля

Все очень просто!

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

Получить

Метки: , , ,

Комментарии Вконтакте:

Комментарии Facebook:

Комментарии (3)

  1. Vadim

    При открытии детального вида, когда нажимаю на фотографию она открывается не в модальном окне, в новом и не отображаются элементы по управлению (перелистнуть, закрыть окно и т. д.)
    в консоли висит следующая ошибка:
    TypeError: $(…).adopt is not a function,
    поменял в файле slimbox.js $ на jQuery, ничего не изменилось, а в консоли появилась ошибка: ReferenceError: $jQuery is not defined

  2. Хабибула

    Здравствуйте Виктор! я просмотриваю ваши видео курсы , но вот у меня тут такое недопонимание — в видео курсе «JoomGalery», а точнее при настройке «Вкладка Детальный Вид» — у меня не работает слайд-шоу , а остальное работает , в чем причина не подскажите ? как включить слайд-шоу ?

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree