Расширения

Обзор RSMediaGallery. Галерея изображений Joomla

 

 

RSMediaGallery – это удобный и простой в использовании компонент для создания отзывчивой галереи и слайд-шоу Joomla 2.5 – 3.х, обладающий возможностью редактирования изображений из административной части компонента.

В добавок компонент оснащён несколькими модулями, при помощи которых можно отображать галерею или слайд-шоу в любой позиции шаблона (включая шапку сайта), а также есть плагины, которые дадут возможность отобразить изображения внутри материалов Joomla (компонент com_content) или в любом другом расширении, которое поддерживает обработку системных плагинов.

В обзоре будет участвовать последняя на момент написания статьи (26.12.2014) русскоязычная версия RSMediaGallery 1.8.13 (в Joomla 3.3.6). Стоит отметить, что лицензию на данное расширение можно приобрести не только отдельно, но и в составе с готовым адаптивным шаблоном на русском языке RSEvento. В этом шаблоне (и других шаблонах от RSJoomla) есть позиции и стили как раз для модулей RSMediaGallery.

В статье «Пошаговая инструкция Joomla (часть 4). Самостоятельное создание сайта» есть видео-урок, в котором показан пример по созданию галереи в RSMediaGallery.

Про другие аналогичные расширения Вы можете прочесть тут: OrdaSoft Image Gallery, Simple Image Gallery, Phoca Gallery, sigplus, DJ-MediaTools, Layer Slideshow и Droppics.

Галерея Joomla

Перечислим основные возможности галереи изображений Joomla.

  • Поддержка отзывчивого дизайна.
  • Поддержка распространённых графических форматов (JPG, PNG, GIF).
  • Возможность задавать заголовок и описание для каждого изображения.
  • Возможность группировки, фильтрации и управления множеством изображений при помощи тегов.
  • Возможность отображения галерей Joomla при помощи модулей, плагинов и пунктов меню. Для всех этих элементов есть множество настроек.
  • Удобный и простой в использовании интерфейс на базе AJAX с возможностью работы с изображениями при помощи мыши.
  • Автоматическая генерация миниатюр изображений.
  • Удобная система фильтров и поиска по изображениям поможет найти нужные файлы среди десятков и сотен картинок.
  • Возможность импорта в галерею изображений Joomla уже находящихся на Вашем сервере файлов.
  • Более 20 эффектов смены изображений для слайд-шоу (на базе jQuery).
  • Наличие четырёх модулей.
  • Адаптация внешнего вида галереи под светлый и тёмный дизайн сайта.
  • Возможность отключения загрузки jQuery в случаях, когда библиотека уже загружена.
  • Возможность редактировать изображения в административной части сайта: более 25 эффектов («Сепия», «Яркость», «Контрастность» и так далее).
  • Пакетная загрузка файлов на сервер.

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

Заявленные системные требования весьма скромные:

  • Joomla 2.5 или 3.x. Рекомендуется использовать последнюю стабильную версию CMS в рамках Вашей ветки. Например, если у Вас установлена Joomla 3.3, то проверьте наличие самой последней версии данной ветки. На 26.12.2014 это 3.3.6.
  • PHP 5.3.
  • MySQL 5.x.
  • Убедитесь в том, что на Вашем сервере включены такие функции PHP как: MySQL, XML и zlib. Также необходима графическая библиотека GD.
  • Последняя стабильная версия браузеров Internet Explorer, Firefox, Chrome или Safari для администрирования RSMediaGallery.

Для проверки Вашего сервера на соответствие требованиям Вы можете воспользоваться RSTester. Скачать его можно со страницы расширения RSMediaGallery, вкладка «Technical Specifications».

Работа с изображениями

Загрузка и импорт

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

При первом входе в RSMediaGallery (рисунок ниже) Вам будет показана краткая инструкция.

RSMediaGallery

Нажав на кнопку Загрузить в левой верхней части экрана, Вы перейдёте к загрузке файлов с Вашего компьютера на сайт (рисунок ниже).

Загрузка файлов

В поле Автоматически добавить следующие теги необходимо указать одно или несколько слов – тегов. Эти теги (метки) будут нужны для того, чтобы потом указывать в модулях, плагинах и пунктах меню галереи Joomla, какие именно картинки нужно выводить. Рекомендации касательно составления тегов приведены в конце данной статьи. Например, если сайт посвящён цветам и Вы хотите создать отдельные слайд-шоу или галереи для роз, тюльпанов, ромашек и так далее, то в качестве тегов можно задать названия цветов. Для роз – «rozy», для тюльпанов – «tyulpany» и так далее (без кавычек). То есть, сперва указать тег «rozy», а затем, при помощи кнопки Обзор указать все фотографии роз, которые нужно загрузить. Можно указывать несколько тегов. Например, для первой группы фотографий роз – «rozy, vystavka-2013», а для второй – «rozy, vystavka-2014» (без кавычек). Тогда можно будет создать три галереи: «Розы» (все розы), «Розы с выставки 2013» (только розы с выставки, прошедшей в 2013 году), «Розы с выставки 2014» (только розы с выставки, прошедшей в 2014 году). Несколько тегов нужно задавать через запятую с пробелом.

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

Активация опции Свободное соотношение сторон указывает, что RSMediaGallery будет создавать миниатюры изображений с установленным по умолчанию соотношением сторон (5:4). Если опция не активна, миниатюра будет создана с тем соотношением сторон, которым обладает исходное изображение.

Если Вы уже загрузили файлы на сервер, нажмите кнопку Импорт в верхней левой части RSMediaGallery и укажите, какие именно файлы необходимо импортировать (рисунок ниже).

Импорт локальных изображений

Тут доступны аналогичные рассмотренным ранее опции.

После загрузки или импорта изображений Вы увидите примерно такую картину (рисунок ниже).

Галерея Joomla

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

Фильтрация и поиск

Рассмотрим инструменты (слева на право), которые расположены над миниатюрами изображений галереи. Они помогут Вам в работе с большим количеством файлов.

Поиск нужных изображений можно производить по названию, описанию, тегам или можно найти все опубликованные\не опубликованные изображения. Для поиска по названию, описанию и тегам есть возможность уточнения поиска. А именно, указать точное соответствие\несоответствие (опции Является, Не является) и содержит или не содержит (одноимённые опции) искомая Вами фраза в той «части изображения» (название, описание, тег), по которой производится поиск.

Можно задать сортировку изображений по таким параметрам: Свободный порядок (перетаскивание мышью), Название, Описание, Теги, Хиты (количество просмотров изображения посетителями сайта), Дата создания, Дата изменения. Причём, по каждому параметру можно задавать сортировку по возрастанию или убыванию.

Также Вы можете отобразить 5, 10, 15, 20, 25, 30, 50, 100 элементов (изображений) на странице компонента галереи Joomla (административной части сайта, для фронтальной – отдельные настройки). Обратите внимание, чем больше Вы укажете, тем дольше будет загружаться страница.

Редактирование

Рассмотрим инструменты, которые доступны для работы с каждой отдельной фотографией галереи (рисунок ниже).

Миниатюра изображения

  1. Можно снять с публикации картинку или опубликовать её.
  2. Отображает теги, которые прикреплены к изображению.
  3. Отображает изображение в масштабе 1:1 (если оно меньше размера области окна просмотра сайта) (рисунок ниже).
  4. Переход к редактированию изображения.
  5. Удаление изображения без возможности восстановления.

Галерея изображений Joomla

Редактор изображений компонента галереи Joomla (рисунок ниже) разделён на три вкладки:

  1. Данные.
  2. Стандарт. эффекты.
  3. Эффекты.

Компонент галереи Joomla

На вкладке Данные, помимо уже знакомых Вам тегов можно внести такую информацию:

  • Название. Может отображаться на странице галереи и\или под рисунком при просмотре его увеличенной версии (рисунок ниже).
  • URL. Можно указать URL-адрес, на который пользователи будут переходить по нажатию на изображение (нужно активировать соответствующую опцию в настройках пункта меню или модуля).
  • Описание. Может отображаться на странице галереи или под рисунком при просмотре его увеличенной версии.
  • Хиты. Количество просмотров изображения пользователями. Формируется автоматически или можно задать вручную. При выставлении сортировки по хитам можно отображать наиболее популярные изображения в самом верху галереи.

Галерея на сайте

  • Опубликов. Опция, которая позволяет опубликовать\снять с публикации изображение.
  • Свободное соотношение сторон. Позволяет Вам обрезать изображение с нужным Вам соотношением сторон, если отключить эту опцию, обрезка будет происходить с пропорциями 5:4.
  • Выбор разрешения. Отображается разрешение по ширине и высоте в пикселях конечного изображения после обрезки.

Вкладка Стандарт. эффекты (рисунок ниже) позволит применить один из 21-го доступного по умолчанию эффектов. Эти эффекты меняют цвета на изображении.

Под списком миниатюр с примерами эффектов отображается информация о разрешении и размере изображения (в мегабайтах). А при помощи кнопки Сбросить стандартные эффекты можно вернуть исходное состояние изображения. Применять несколько эффектов одновременно нельзя.

Стандартные эффекты

Эффекты. Данная вкладка (рисунок ниже) позволяет применить несколько эффектов к изображению:

  • Оттенки серого.
  • Негатив.
  • Схематичность.
  • Яркость. Доступно управление степенью «интенсивности» применения эффекта.
  • Контрастность. Доступно управление степенью «интенсивности» применения эффекта.
  • Пикселизация. Доступно управление степенью «интенсивности» применения эффекта.

Эффекты

Настройки

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

  1. Оптимизация макета.
  2. Фильтрация.
  3. Расширенные.
  4. Обновление. Содержит поле для ввода лицензионного ключа RSMediaGallery для получения обновлений компонента. Его можно получить в своём личном кабинете на сайте разработчика.
  5. Права. «Стандартная» вкладка Joomla, позволяющая разграничить права доступа к компоненту для различных групп пользователей.

Настройка RSMediaGallery

Оптимизация макета. На данной вкладке (рисунок выше) собраны такие опции:

  • Контраст. Можно указать светлый или тёмный «стиль» для галереи, в зависимости от дизайна Вашего сайта.
  • jQuery. JQuery является широко используемой библиотекой Javascript, которая обеспечивает повышенную функциональность, эффекты и является основой RSMediaGallery. Доступны такие параметры: Автоматически – означает, что RSMediaGallery будет пытаться найти лучшее решение. Вы можете изменить эту настройку, выбрав одну из следующих опций: Загрузить собственную jQuery (будет произведена принудительная загрузка jQuery), Умная загрузка (попытается удалить все другие экземпляры JQuery и оставить только один), Не загружать (собственная библиотека jQuery загружена не будет – если другие расширения или Ваш шаблон уже загружают библиотеку jQuery, будет использована эта).
  • Отзывчивый CSS. Отзывчивый CSS использует структуру Bootstrap – активация данной опции не повлияет на Ваш сайт. Если возник конфликт,  Вы можете попробовать отключить эту опцию.

Фильтрация. Данная вкладка содержит опции, позволяющие настроить фильтрацию и эффекты анимации при фильтрации изображений (рисунок ниже).

Фильтрация

Например, если Вы активируете опцию Фильтровать галереи по тегам, во фронтальной части сайта, на странице галереи Joomla, у пользователей появится возможность фильтрации изображений по тегам (рисунок ниже).

Фильтр тегов

Включив одну или несколько опций анимации (Затухание, Масштабирование и так далее) Вы задаёте анимацию изображений для случаев, когда пользователь нажимает на кнопку с одним из тегов и вся галерея перестраивается (рисунок ниже). То есть, исчезают изображения, не содержащие выбранный тег, а те, которые содержат, перемещаются так, чтобы занять пустое место, которое образовалось в следствие исчезновения изображений без выбранного тега.

Эффекты анимации изображений

Эффекты X-вращение, Y-вращение и Размытие не будут отображаться в тех браузерах, которые не поддерживают CSS3.

На вкладке Расширенные (рисунок ниже) Вы сможете задать, какие именно права надо применять к новым файлам и папкам галереи.

Изображения сгруппированы в папки в соответствии с разрешениями главной папки «/gallery/». Когда эти папки только что созданы, они наследуют настройки разрешений, указанных в поле Разрешения на папки. Обычно по умолчанию «755» работать, но на некоторых небезопасных серверах понадобится «777».

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

Расширенные

Рекомендации по тегам

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

  1. Используйте описательное название тегов. Например, «Цветы с выставки 2013», «Цветы с выставки 2014», а не «Тег 1», «Тег 2».
  2. Лучше подобрать слова, которые максимально отражают суть изображений, в той формулировке, которую чаще всего вводят пользователи в поиск. Это даст возможность отображения ключевого адреса в URL-страницы альбома. Например, «http://test.aleksius.com/view-album/tag-firefox», где «Firefox» – тег изображений (если Вы размещаете на сайте картинки по тематике Mozilla Firefox и название браузера для Вас является ключевым словом).
  3. Указывайте теги с учётом регистра, так как они будут отображаться в заголовке страницы (в теге «<title>») и в хлебных крошках.
  4. Не используйте длинные теги. До 50 символов с пробелами включительно. Лучше до 3-5 слов.
  5. Помните, что длина URL-страницы альбома, включая протокол (например, http) и доменное имя, не должна превышать 115 символов; длина URL, не включающая протокол и доменное имя, должна составлять 34-51 символ. Например, «http://test.aleksius.com/view-album/tag-firefox» – эти 14 символов (выделенные жирным), RSMediaGallery добавляет в URL-страницы альбома (она рассмотрена в статье «Обзор RSMediaGallery. Создание слайд-шоу в Joomla»). До этих символов – домен Вашего сайта, после – тег изображений.
  6. Не спамьте в тегах. Например, не надо делать такие теги: «kupit-utyug-nedorogo-kharkov», лучше – «utyugi»
  7. Лучше, чтобы тег содержал или русские слова, или английские. Исключение – имена собственные и названия. Например, «Красивые цветы», а не «Красивые flowers» или и того хуже, «Красивые flowersы»
  8. Не используйте слэши («/») в тегах. Это может привести к возникновению ошибки: «Ресурс к которому вы пытаетесь обратиться не найден на этом сервере» при переключении между изображениями.

Обратите внимание на то, что при использовании ЧПУ (SEF) RSMediaGallery будет самостоятельно преобразовывать теги из русских букв в английские для формирования URL-адреса(транслитерация). Например, тег «Мой город» будет преобразован в «moj-gorod».

Касательно непосредственно имён файлов изображений – они не отображаются в коде сайта (их не видит поисковая система и не учитывает ключевые слова в них), но при загрузке изображения на компьютер пользователя, при помощи ссылки «Скачать», они загружаются с тем именем, с которым Вы их импортировали или загрузили в RSMediaGallery. Так что есть смысл давать файлам понятные описательные имена на родном для большинства целевых пользователей языке. Например, «Цветы с выставки 2014 1», «Цветы с выставки 2014 2», «Цветы с выставки 2014 3» и так далее, а не «DSC01113», «DSC01114», «DSC01115» и подобное.

Русификатор RSMediaGallery

Скачать русификатор RSMediaGallery.

В следующей статье «Обзор RSMediaGallery. Создание слайд-шоу в Joomla» мы рассмотрим модули галереи.

Похожие материалы
Автор статьи – Хорошевский Алексей

Хорошевский Алексей Примерно с 2008 года и по сегодняшний день создаю сайты «под ключ» на Joomla и WebSite X5. Также занимаюсь их доработкой, SEO-продвижением, контекстной рекламой, защитой от взлома и оптимизацией скорости загрузки сайта.

Кандидат технических наук по специальности «Информационные технологии».

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

 

Полезные ссылки: