Фотогалерея для joomla


Здравствуйте, уважаемые читатели блога KtoNaNovenkogo.ru. Сегодня речь пойдет об одном из лучших бесплатных расширений, которое позволяет реализовать полноценную фотогалерею на Joomla. Для этих целей мы будет использовать продукцию компании Phoca — компонент Phoca Gallery и одноименный плагин.

Возможности лучшей из бесплатных галерей для Joomla

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


Перейдя по пункту «Gallery Categories» сможете увидеть, как будет выглядеть страница галереи, имеющая несколько категорий.

При желании можно отображать не просто их список, а еще и добавлять к ним описание. Как это будет выглядеть вы можете увидеть, выбрав на демо-сайте пункт меню «Gallery Categories Detail».

Можно так же осуществить привязку фотографий к положению на географической карте Google — «Gallery Categories Map».

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

Кроме различных вариантов организации фотогалерей в Joomla, вы сможете выбирать еще и способ просмотра полноразмерных фото при щелчке мыши по их превьюшкам. Посмотреть и попробовать в действии все эти варианты сможете, переходя по пунктам меню демо-сайта в области «Category View».

Лично мне больше всего нравится способ «Highslide (Image only)», но, как говорится, на вкус и цвет — товарищей нет.

С тех пор, как я последний раз ее ставил, оказывается прошло уже довольно много времени, или же это разработчики так быстро добавляют новые способы просмотра фотографий. Во всяком случае, «Coolirs 3D Wall» и «JAK Lightbox» раньше у них не замечал. Молодцы разработчики, что и говорить, так интенсивно развивают бесплатный проект. Респект им и уважуха, как говорится.


В общем, поиграйтесь сами на демо-сайте Phoca со всевозможными способами показа для того, чтобы потом в настройках компонента осознанно выбирать тот или иной вариант. О, нашел еще один интересный способ — «Youtube». Потрясно, фотогалерея позволяет добавлять и выводить с помощью Lightbox ролики с Youtube.

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

Пример водяного знака можно увидеть на странице «Watermark». Причем, он вовсе не обязательно должен располагаться посередине фотографии, как показано в примере. Положение водяного знака можно будет задать в настройках компонента Phoca Gallery.

Вам правда потребуется создать файлик с его графическим изображением в формате PNG (тут вы узнаете чем отличаются форматы растровой графики и какой именно лучше всего использовать) и загрузить его на хостинг. В общем то, можно водяной знак нанести и предварительно на своем компьютере — в пакетном режиме в программе для просмотра изображений FastStone Image Viewer.


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

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

Похоже, что Phoca Gallery умеет работать даже с фотографиями, которые находятся на сервере Google в вашем Picasa альбоме, во всяком случае об этом говорится «тут». Не могу это утверждать наверняка, ибо не пользовался этой возможностью.

На странице демо-сайта «Phoca Gallery Plugin» сможете познакомиться с возможностями плагина, о котором речь пойдет в отдельной статье.

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

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


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

Установка компонента на Joomla и его русификация

Скачать Phoca Gallery вы можете здесь, а скачать плагин — здесь.

Фотогалерея для joomla

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

Фотогалерея для joomla

Для установки Фока Галери на Joomla нужно в админке выбрать из верхнего меню пункты «Расширения»- «Установить/Удалить». В открывшемся окне в области «Загрузить файл пакета» нажмите на кнопку «Обзор», найдите на своем компьютере только что скачанный архив с компонентом, а затем нажмите на кнопку «Загрузить файл&Установить»:

Фотогалерея для joomla

Joomla отрапортует вам об успешной установке, но вам еще нужно будет выбрать, что именно вы в данный момент проделали — установили компонент впервые (нужно будет нажать на кнопку «Install») или же обновили уже установленный ранее на более новую версию (жмем на кнопку «Upgrade»).


Фотогалерея для joomla

После этого вас перекинет на главную админки Phoca Gallery. Многие надписи будут на английском, поэтому для его русификации нужно распаковать архив с русским языковым пакетом ru-RU.com_phocagallery.zip, который вы скачали ранее. Внутри архива будут находиться два файла, которые нужно будет загрузить на сервер хостинга в папку с локализациями различных расширений Joomla.

Для начала нужно будет подключиться к своему сайту по протоколу FTP, например, с помощью замечательной программы FileZilla, подробно описанной тут. Затем находите среди файлов и папок вашего сайта (в FileZilla каталоги удаленного сервера расположены в правом окне) директорию:

/administrator/language/ru-RU

Открываете эту папку и копируете в нее из левого окна FileZilla (там доступны объекты, расположенные на вашем компьютере) два файла русификации — ru-RU.com_phocagallery.ini и ru-RU.com_phocagallery.menu.ini. Теперь, зайдя на админку компонента («Компоненты» — «Phoca Gallery»), вы увидите, что все надписи отображаются на русском.


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

Потом его распаковать и скопировать все файлы, содержащиеся в нем, на сервер в папку:

/administrator/language/ru-RU

Если папки «ru-RU» в «/administrator/language/» не обнаружите, то вам нужно будет ее создать, щелкнув правой кнопкой в FileZilla и выбрав из контекстного меню пункт «Создать каталог». Проверьте права доступа для этого каталога и при необходимости измените их на 755 (что такое права доступа можете прочитать в этой статье).

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

Фотогалерея для joomla

Настройки Phoca Gallery (водяные знаки, размеры и эффекты)

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


Самая маленькая копия используется в админке Phoca Gallery, чтобы при просмотре списка фотографий вы могли бы понимать, что это за изображения. Чуть бОльшие копии используются на страницах галерей в качестве превьюшек (мини-изображений), щелкнув по которым можно будет увидеть самые большие копии, получаемых из основных картинок, загружаемых на сервер.

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

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

Итак, выберите из верхнего меню админки пункты «Компоненты» — «Phoca Gallery». В правом верхнем углу нужно будет нажать на кнопку «Параметры». В результате, во всплывающем окне откроется перечень настроек этого компонента.


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

В начале списка идут настройки, задающие отображение эскизов и других элементов в категориях галереи. Здесь я практически все оставил без изменения за исключением того, что убрал из под превьюшек (мини-изображений) кнопки детального просмотра, загрузки и иконки папки (выбрал из выпадающего списка вариант «Скрыть» для этих полей):

Фотогалерея для joomla

В следующей области «Установки вида категории» можете настроить внешний вид отображения эскизов в их списке. Будет ли вместо папки отображаться случайное изображение из этой категории, показывать ли внутри кнопку возврата в список, во сколько колонок они будут расположены в списке и многое другое:

Фотогалерея для joomla

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

Фотогалерея для joomla

Выбираем между эффектами Highslide и Lightbox в настройках

Следующей важной областью является «Настройки детального вида». Здесь в области «Окно деталей» вы сможете выбрать способ, который будет использоваться для показа большой копии изображения, после того, как посетитель вашего сайта щелкнет по его эскизу в галереи или slideshow:


Фотогалерея для joomla

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

Для этого вам нужно будет выбрать один из вариантов показа детального изображения (Highslide или Lightbox) в поле «Окно деталей» и нажать на кнопку «Сохранить», расположенную в самом верху.

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

Лично мне больше всего импонирует вариант «Highslide JS (только изображения)», хотя и Lightbox тоже вполне даже ничего. При этом все открытые фото на странице можно будет растащить мышью по экрану для их сравнительного просмотра. Закрываются открытые фотки щелчком по ним мышью. Прикольно.


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

Следующей важной областью, на мой взгляд, является «Слайд-шоу», где вы можете задать время задержки между показом фотографий и ряд других параметров для slideshow в Joomla:

Фотогалерея для joomla

Добавление водяных знаков (Watermark) к изображениям в галерее

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

Во-первых, нужно будет найти область «Настройки водяного знака» и в поле «Создать водяной знак» выбрать вариант «Да». А в полях «X-позиция водяного знака» и «Y-позиция водяного знака» — выбрать его положение на картинке:

Фотогалерея для joomla

Для применения этих установок прокручиваете окно до верха и нажимаете на кнопку «Сохранить». Но этим мы только активировали функцию автоматического добавления Watermark на все загружаемые на сервер изображения, а что у нас будет использоваться в качестве него, мы так и не настроили.

Но, собственно, настраивать ничего больше и не надо, достаточно лишь создать два графический файла водяных знаков в формате PNG, например, в Фотошопе или бесплатном Pixlr.

Их следует назвать WATERMARK-LARGE.PNG (для добавления на большую копию) и WATERMARK-MEDIUM.PNG (для добавления на эскизы). Если на эскизы добавлять водяные знаки вы не хотите, то просто не создавайте этот файл. Теперь их нужно будет скопировать на сервер в папку, где будут храниться загружаемые фотографии. Обычно это:

/images/phocagallery/

Но это будет справедливо только в том случае, если вы планируете загружать все изображения в одну папку. А если вы будете заливать фото для разных категорий галереи в разные папки (создавая их в каталоге /images/phocagallery/), то у вас появится возможность автоматически добавлять к изображениям из разных категорий разные водяные знаки.

В этом случае нужно создать нужное количество пар файлов WATERMARK-LARGE.PNG и WATERMARK-MEDIUM.PNG, и загрузить их по FTP в папки разных категорий:

/images/phocagallery/название

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

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

Настройка размера изображений в фотогалереи и слайдшоу

Следующей важной областью настроек является «Настройки размера изображения и окна». Здесь вы можете задать размер копий загружаемых на сервер фоток. Если помните, то в начале статьи я упоминал, что при заливке происходит автоматическое создание из каждого изображения трех копий (про предварительное сжатие фотографий на компьютере можно забыть):

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

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

Фотогалерея для joomla

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

Создание категорий и загрузка фотографий в Phoca Gallery

Теперь нам нужно будет точно так же, как и в самой Joomla, продумать структуру категорий для будущей галереи.

Но в отличии от Джумлы, где используется двухуровневая схема вложенности материалов (разделы и рубрики), в Phoca Gallery у нас будет возможность создавать категорий галереи со сколь угодно большим уровнем вложенности. Но обо всем по порядку.

Для начала нам нужно выбрать из верхнего меню админки пункты «Компоненты» — «Phoca Gallery» — «Категории». В открывшемся окне вы увидите список всех уже созданных вами категорий:

Фотогалерея для joomla

Для создания новой вам нужно нажать на кнопку «Создать», расположенную вверху страницы. В результате откроется окно, где сможете задать настройки для новой категории нашей будущей галереи:

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

Для чего нужно заполнять поле «Псевдоним»? — спросите вы. Нужно это только в том случае, если вы используете предусмотренные в Joomla возможности по созданию человеко-понятных URL (ЧПУ или SEF оптимизированных адресов вебстраниц вашего Джумла-сайта). Если вы не совсем понимаете, что такое ЧПУ и как его активировать, то советую почитать тут о настройках SEF (ЧПУ) в Джумле c использованием стандартных средств.

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

По умолчанию выбран вариант «Всем», но при желании вы можете сделать так, чтобы ее могли видеть либо только зарегистрированные пользователи (вариант «Registered»), либо вообще только администраторы (вариант «Специальный»).

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

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

Поля «Права доступа пользователей», «Права пользователя на загрузку и добавление» и «Права пользователя на удаление и публикацию» позволяют вам выбрать кому:

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

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

Дальше на странице настройки следуют поля, позволяющие осуществить привязку загружаемых изображений к определенному месту на карте Гугла. Но для этого вам нужно будет предварительно получить ключ Google Maps API для того, чтобы смогли использовать его карту на своем сайте.

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

Зарегистрироваться для получения ключа вы можете здесь, а полученный API Карт Google вам нужно будет ввести в настройках компонента фотогалереи в области «Geotagging настройки» в поле «Google Maps API ключ».

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

Для вывода описания нужно будет найти область настроек «Настройки вида» и в пункте «Стиль отображения» выбрать вариант «Категории, изображения и детальная информация»:

Фотогалерея для joomla

Аналогичным образом вам нужно будет создать требуемое количество категорий в Phoca Gallery и затем уже приступать к добавлению изображений в них.

Загрузка изображений в фотогалерею на Joomlay осуществляется как бы в два этапа. На первом этапе нужно залить графические файлы со своего компьютера на сервер хостинга в папку /images/phocagallery. Для уменьшения размера и веса фотографий их лучше будет предварительно прогнать через пакетное изменение размера, например, в FastStone Image Viewer (подробности читайте по ссылке) или сжать фото онлайн.

На втором этапе мы должны выбрать категорию, куда будем осуществлять заливку, после чего начнется их автоматическая переделка средствами компонента Phoca Gallery. Для каждой загруженной фотографии будет создано три ее копии разного размера, которые будут помещены в папку /images/phocagallery/thumbs.

Размеры создаваемых копий настраиваются в параметрах компонента и об этом я уже писал чуть выше. Копия самого маленького размера будет использоваться для просмотра превьюшек в админке Phoca Gallery.

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

Загрузка одного изображения в галерею для Joomla

Итак, нам для начала нужно осуществить загрузку графических файлов на сервер. Сделать это можно несколькими способами. Во-первых, если вам потребуется добавить только одно изображение, то вы можете воспользоваться встроенным мастером — «Компоненты» — «Phoca Gallery» — «Изображения».

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

Фотогалерея для joomla

Заполняете поле «Название», содержимое которого в последствии будет помещено в атрибут тега ALT тега картинки IMG. Название должно включать ключевые слова, если хотите, чтобы это изображение участвовало в поиске по картинкам Яндекса и Google .

В поле «Опубликовано» вы определяете, будет ли показано загружаемое фото в категории, которую вы выберете чуть ниже из выпадающего списка. Остальные поля заполняете по желанию, а для загрузки вам нужно будет нажать на кнопку «Изображение», расположенную напротив поля «Название файла». После чего увидите содержащиеся в папке /images/phocagallery файлы.

В принципе, вы могли бы заранее подключиться в вашему сайту по FTP и загрузить графический файл с нужным вам фото в папку /images/phocagallery. В этом случае вам нужно будет лишь найти это изображение в открывшемся окне и щелкнуть по нему мышь. В результате наименование файла будет автоматически скопировано в поле «Название».

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

Ну, и после заполнения всех остальных полей, которые вы посчитаете нужными, для окончания процесса нужно будет нажать на кнопку «Сохранить», расположенную вверху.

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

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

Добавление сразу нескольких фотографий

Мы только что научились добавлять одно изображение в галерею, а теперь давайте рассмотрим пакетную заливку фотографий. В принципе, все очень похоже. Нам нужно будет опять выбрать из верхнего меню «Компоненты» — «Phoca Gallery» — «Изображения».

Далее нужно будет нажать на кнопку «Добавить несколько», расположенную в верхней части окна:

Фотогалерея для joomla

На открывшейся странице увидите список файлов с изображениями, которые в данный момент находятся в папке /images/phocagallery. Если здесь нет тех фотографий, которые вы хотели бы добавить в одну из категорий, то вам придется их загрузить в эту папку.

Лично я использую самый простой, с моей точки зрения способ — заливка по FTP. Я подключаюсь к сайту через программы Filezilla и в ее правом окне открываю папку /images/phocagallery, а в левом — папку на жестком диске своего компьютера с нужными мне графическими файлами. Выделяю нужные и выбираю из контекстного меню правой кнопки мыши «Закачать на сервер».

Фотогалерея для joomla

Но так же вы можете воспользоваться и встроенным в компонент JAVA или FLASH загрузчиками. Их найдете, прокрутив окно до конца вниз.

Для их работы понадобится установить в операционную систему либо JAVA машину, либо Flash плеер, если их у вас до этого не было. В случае использования JAVA загрузчика нужно будет выбрать необходимые файлы изображений на жестком диске своего компьютера, а затем нажать на кнопку «Загрузить»:

Фотогалерея для joomla

Я обычно все закачиваю в папку /images/phocagallery по FTP, а затем помечаю галочками нужные мне фотографии, после чего выбираю из выпадающего списка поля «Категория» ту, в которую они должны попасть, ставлю галочку в положение «Да» в поле «Опубликовано» и жму на кнопку «Сохранить», расположенную вверху:

Фотогалерея для joomla

Собственно, вот и все.

Для того, чтобы вновь добавленные в Phoca Gallery изображения оказались вверху списка, щелкните по заголовку последнего столбца «ID» так, чтобы фото с наибольшим ID (добавленные последними) оказались вверху списка:

Фотогалерея для joomla

Вывод содержимого фотогалереи с помощью пунктов меню

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

Во-вторых, можно использовать модули галереи Menu Module и Tree Module, которые вам позволят вставить в нужные позиции вашего шаблона меню галереи в древовидном и обычном виде.

Пример такого модуля сможете увидеть на сайте разработчиков в правой колонке — Tree Menu. Кроме этого можно выводить любые изображения из нее с помощью модуля PImage Module.

В-третьих, содержимое галереи так же можно будет выводить и внутри статей с помощью плагина. Для этого не потребуется создавать дополнительных пунктов меню — нужно всего лишь вставить в текст статьи код вызова Phoca Gallery Plugin, указав при этом ряд параметров, определяющих внешний вид отображаемой фотогалереи или слайдшоу.

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

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

В результате откроется окно со списком всех пунктов в этом меню. Для создания нового нужно нажать на кнопку «Создать», расположенную в верхнем правом углу окна. В открывшемся дереве раскрываем ветвь «Галерея Phoca Gallery», щелкнув по ней мышью.

Пункт «Расположение панели управления пользователя Phoca Gallery» может понадобиться в том случае, если разрешить посетителям добавлять изображения в галерею. Этот пункт меню позволит им получить доступ к форме для загрузки фоток и создания категорий.

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

Вариант «Cooliris 3D план стены» позволяет выводить фото из какой-либо отдельной категории в виде очень красочной Flash стены, которую можно поворачивать простым перемещением мыши. Посмотреть, как это будет выглядеть в реале, можете здесь.

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

«Список всех категорий» служит для создания ссылки (пункта) в меню, перейдя по которому посетитель сможет увидеть список всех категорий. В каком виде они там будут представлены, задается в настройках этого компонента, о которых мы уже говорили чуть выше.

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

Фотогалерея для joomla

В настройках первого варианта для этого я указал в поле «Родительский элемент» вариант «сверху»:

А вот уже для второго варианта — выбираем в качестве родительского пункт меню, вложенный в первый пункт:

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

Разве что только при создании пункта «Вид категории» вам понадобится указать ту из них, фото из которой будут выводиться:

Теперь пора переходить к рассмотрению возможностей плагина Phoca Gallery Plugin, который позволит нам создавать фотогалереи прямо в статьях. Давайте его установим. Если вы его еще не скачали, то можете сделать это здесь , а русификацию взять отсюда.

Из верхнего меню админки Joomla пункты «Расширения» — «Установить/Удалить» находите на своем компьютере архив с плагином и завершаете установку, нажав на кнопку «Загрузить файл&Установить».

Для того, чтобы попасть в его настройки (или просто активировать его) вам нужно будет выбрать из верхнего меню админки Joomla пункты «Расширения» — «Менеджер плагинов». В открывшемся окне найдите строчку с нашим и щелкните по его названию:

Фотогалерея для joomla

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

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

language/ru-RU

Вам нужно будет еще скачать и установить модули галереи:

  1. Menu Module — модуль для вывода в Joomla меню вашей галереи
  2. PTree Module — модуль для вывода древовидного меню галереи в Joomla
  3. Image Module— модуль вывода произвольных изображений из галереи в Joomla

После установки модулей нужно выбрать из верхнего меню «Расширения» — «Модули», найти в списке наши и зайти в их настройки. Там нужно будет активировать модуль, выбрать необходимую для него позицию в шаблоне, посмотреть и при необходимости подкорректировать настройки в правой области. Какие именно — проще всего будет понять, попробовав их на практике.

ktonanovenkogo.ru

1.TZ Plus Gallery

ДЕМО / СКАЧАТЬ

TZ Plus Gallery – расширение для Joomla!, которое позволяет отображать на сайте все фотоальбомы из социальных сетей пользователя, в том числе: Facebook, Flickr и Instagram и Google+.Пользователи могут размещать свои фотографии везде, в любое время, будь то Facebook, Flickr, Instagram или Google+. Фотографии будут автоматически добавлены на сайт. TZ Plus Gallery имеет две версии: бесплатная версия и Pro версия, так что пользователи могут выбрать, ту, которую захотят. Обе версии действительно потрясающие, но с TZ Plus Gallery Pro пользователи могут использовать намного больше специальных функций.

1tzplusgaller 

2. Phoca Gallery

ДЕМО / СКАЧАТЬ

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

2phoca

3. Ozio Gallery

ДЕМО / СКАЧАТЬ

Ozio Gallery позволяет пользователям публиковать свои фотоальбомы из Google+. Могут быть отображены даже альбомы с ограниченным доступом. Это расширение обладает отличным фунционалом: неограниченная загрузка фото, автоматическое изменения размера фото, статистика фото, автоматическое создание миниатюр, карта галереи всех фотографий, отображение красивых карт с вашими фотографиями, используя EXIF фотографий или геотеги, и др.

3ozio

4. Event Gallery

ДЕМО / СКАЧАТЬ

Event Gallery – замечательный компонент галереи, включающий корзину фото, а также использующий адаптивную систему отображения фотографий. Смотрится, действительно, очень красиво! Event Gallery также поддерживает мультиязычность Joomla, ICC профили, папки с паролями или ограниченным доступом для пользователей, Корзину и покупку фотографий, нанесение водяного знака и много других классных фишек.

4event

5. Ignite Gallery

ДЕМО / СКАЧАТЬ

Ignite Gallery совместима с Joomla 2.5 и Joomla 3. Что же в ней особенного? В данной галерее вы найдете:  слайдшоу, фронтенд загрузка фото, загрузка нескольких фото через бэкенд и фронтенд, поддержку Jcomments, мультиязычности, Joomfish, Lanternfish и т.д.

5ignite

6. Sigplus

ДЕМО / СКАЧАТЬ

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

6sigplus

7. CSS Gallery

ДЕМО / СКАЧАТЬ

CSS Gallery – простой в настройке и установке плагин галереи Joomla, который позволит вам выводить галереи с миниатюрами в вашем контенте. В отличии от других плагинов-галерей, CSS Gallery работает на чистом X-HTML и CSS, не используя в работе JavaScript, Flash и любые другие скрипты/плееры.

7cssgaller

8. JoomGallery

ДЕМО / СКАЧАТЬ

JoomGallery-это компонент галереи, полностью интегрированный в Joomla!.  Он полностью поддерживает Joomla! 3.х. JoomGallery может похвастаться рядом очень полезных функций: настраиваемые водяные знаки (watermark), поддержка Google карт, 3 размера изображений (оригинальный, детальный и эскиз), автоматическое создание эскиза и детального размеров изображения, создание слайд-шоу с различными эффектами перехода, функцию поиска по галерее, создание и добавление пользовательских категорий. Однако и это не полный список его возможностей!

8joomgallery

9. Accordion Gallery

ДЕМО / СКАЧАТЬ

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

9accordion

10. Art Gallery

ДЕМО / СКАЧАТЬ

Art Gallery – адаптивный компонент галереи с классной функцией зума фотографий. С ArtGallery все, что вам нужно сделать, чтобы создать галерею – это выбрать папку с фотографиями. И все! Расширение поддерживает 2 варианта вывода картинок: случайные позиции фото (адаптивное расположение) и отображение по строкам / колонкам.

10artgallery

 

 

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

joomla.ru

Вступление

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

  • Simple Image gallery (плагин);
  • Sigplus (плагин);
  • JoomGallery (компонент с плагинами и модулями);
  • Phoca Gallery (компонент с плагинами и модулями);
  • FW Fallery — Компонент с палгинами и модулями);
  • Ozio Gallery.

Фотогалереи Joomla — Simple Image Gallery

Simple Image Gallery это плагин. Очень простой, не конфликтный и надежный. Этот плагин позволяет вставлять в статьи сайта фото галереи любых фотографий. Плагин сам уменьшает ваше фото и показывает его в галерее размером 200×200 (размер можно изменить в настройках). Все фото будут показаны в виде мозаики.

simple images gallery

Чтобы вставить галерею в статью, создайте альбом с фотографиями. Загрузите альбом в каталог сайта в папку image, Разместите код плагина в любую (любые) статьи сайта. Код

, где foto-album это название папки с фотографиями, а квадратную скобку меняете на фигурную. 

Галерея Sigplus

Sigplus это тоже плагин, но с более разнообразными кодами для вставки галерей в статьи. Каждое фото открывается в лайтбоксе, как и в Simple Image gallery.

sigplus Examples

JoomGallery

JoomGallery полнофункциональный инструмент для создания галерей фотографий на сайте. У компонента много плагинов и модулей. Практически все расширения, как и сам компонент, бесплатны. Видимо бесплатность компонента, позволила на сегодня, выпустить только бета-версию JoomGallery для версии Joomla 3.

JoomGallery

Что позволяет сделать JoomGallery

  • Расширения JoomGallery позволяют создавать категории фотоальбомов, с древовидной подчиненностью;
  • Фотографии можно загружать, через административную панель сайта, на вкладке Компоненты→JoomGallery→Загрузка фото. Фотографии можно загружать по одной и пакетами в сжатом ZIP формате.

JoomGallery много чего умеет делать в Joomla 2.5, но совсем ничего не умеет в Joomla 3. Мало того, что разработчики выпустили только бету версию для Joomla 3, они сделали только один плагин Editorbutton JoomBu для последних версий Joomla, правда, сподобились, сделать пять типов модулей для компонента:

  • Показ одной фото (JoomImages);
  • Показ категорий галерей в подчиненном виде (JoomTreeview);
  • Поиск по галереям (JoomSearch);
  • Показ категорий фотографий в модуле, возможно с привью (JoomCategories);
  • И модуль показывающий статистику скачивания фотографий (JoomStats).

Все модули в бета-версиях.

Итог

Я работал с JoomGallery на версии Joomla 2.5. По итогам работы с ним, отмечу свои впечатления:

  • У компонента слишком много настроек, причем настройки показа фотографий и альбомов, альбомов с привью, оригиналов фото и т.п. взаимно пересекаются. Чтобы получить показ альбома в нужном виде, приходится «перелопачивать» все настройки компонента.
  • Еще одно неудобство. Чтобы пользователю добраться до скачивания файла, нужно пройти три промежуточных окна, причем с рекламой от Googleот авторов компонента. Реклама не убирается.
  • Несомненным плюсом этого расширения, его всеядность ко всем форматам файлов, которая блекнет с отсутствием нормальной версии для Joomla 3.

FW Gallery

Этот компонент я для себя открыл совсем недавно. Мне он понравился.

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

FW gallery

Настройки компонента просты и понятны. Нет безумных 20 вкладок настроек, которые есть в JoomGallery. Работать с компонентом просто:

  • Создаете галерею для фото (как категория для статей);
  • Загружаете в галерею фотографии (пакетом, не ZIP) или по одной;
  • Создаете меню для фотографий и в нем создаете путы меню FWGallery;
  • Созданное меню выводите на сайт.

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

Ozio Gallery

Компонент Ozio Gallery по-своему уникален. Он соединяет ваши фотоальбомы на G+ с сайтом. Вернее он позволяет показывать фотоальбомы G+ в статьях сайта и выводить альбомы G+ на страницах сайта, даже в своем специальном шаблоне. Компонент неплохой, но по практике скажу, на двух сайтах он работать отказался. Ошибку не нашел, да и собственно, не искал.

Pocha Gallery

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

pocha gallery

Должен сказать, что на Joomla 3, галереи Pocha получаются красивыми. Но, как минимум, о двух неудобствах нужно сказать.

  • Во-первых, готовьтесь к обучению. Просто поставить и работать не получится. Придется покопаться в документации компонента.
  • Во-вторых, компонент так сильно прописывается в систему, что часто конфликтует со многими расширениями, а удаление его с сайта становится настоящей мукой, с падением сайта и другими «черными днями».

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

Нужные ссылки

Все компоненты, упомянутые в этой статье, вы найдете на сайте: https://extensions.joomla.org, в разделе «Photos & Images».

extensions.joomla

Это все фото галереи Joomla, о которых хотелось поговорить в этой статье.

©Joomla-abc.ru

joomla-abc.ru

Вступление

Здравствуйте. Сегодня я расскажу, об одной, незаслуженно не популярной, галереи Joomla, под названием FW Gallery. В отличие от простых галерей Simple Image Gallery и Sigplus, это расширение полнофункциональный, инструмент для создания фото галерей на сайте Joomla в статьях, модулях, каруселях, со своими плагинами (платными и бесплатными), системой каталогизации изображений их поиска и контроля скачивания.

О компоненте FW Gallery

Компонент FW Gallery создан 08 июля 2010 года. Последняя версия 3.3. Лицензия некоммерческая, GPLv2 (универсальная общественная лицензия GNU, второй версии).

Где взять FW Gallery

Установочный ZIP пакет FW Gallery, называется free_gallery_subscription_v3.3. Он включает две папки, для Joomla 2.5 и для Joomla 3. Папки одинаково наполнены, но разными версиями компонентов, плагина и модулей галереи FW.

Для Joomla 3 это следующие установочные архивы:

  • com_fwgallery_v3.3;
  • com_fwgallerytmpllight_v3.2;
  • com_fwgallerytmplphotographer_v3.2;
  • mod_fwgallery_carousel_v3.0;
  • mod_fwgallery_fancy_slideshow_v3.0;
  • mod_fwgallery_latest_v3.0;
  • plg_search_fwgallery_v3.0.

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

Авторы FW галереи предлагают, платно, еще 10 шаблонов, 3 модуля и 4 плагина для развития галереи. Стоят они 9,99$ , пакетная подписка 69,99$.

Взять компонент лучше у авторов, на их сайте: https://fastw3b.net. Для скачивания компонента вам придется зарегистрироваться.

FW gallery joomla foto 1

После скачивания, архив нужно распаковать и все содержимое папки Joomla 3, установить расширение на свой сайт. Для чего, вам нужно авторизоваться в административной панели сайта, войти на вкладку Расширения→Менеджер расширений→Загрузить файл из пакета и последовательно выбирая архивы компонентов, модулей и плагина FW галереи установить их на сайт.

После загрузки проверьте их включение на вкладке Расширения→Менеджер расширений→Управление, воспользовавшись фильтром «FW». Также посмотрите, отражается ли компонент FW в меню Компоненты.

FW gallery joomla foto 2

FW gallery joomla foto 4

Знакомство с FW Gallery

В панели управления галереей FW пять вкладок:

  • Галереи;
  • Изображения;
  • Плагины (список установленных плагинов этого расширения);
  • Шаблоны (три шаблона для показа. Работает только один);
  • Язык (русский перевод есть, включается автоматом по локализации Joomla);
  • Конфигурация (здесь, все, что можно делать в расширении, помечено «Да», и что можно будет делать, если поставить дополнительные плагины, помечено «Нет»);
  • ipPhone (ссылка для скачивания приложения для мобильного устройства и документации).

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

Создаем фотоальбом

Перед загрузкой изображений, нужно создать фотоальбом. Идем на вкладку FWGallery→Галереи→кнопка Создать.

FW gallery joomla foto 5

  • Даем ей имя (1), любое.
  • Показываем пользователя (2), автора;
  • Задаем цвет отражения (3);
  • Выбираем, кто может видеть альбом (4);
  • Указываем, открыта она или закрыта для общего просмотра (5);
  • Даем ей описание(7);
  • И публикуем ее кнопкой (6).

Сохраняем и закрываем. Все, первая галерея создана. Наполним ее фотографиями.

Загрузка фотографий

Идем на вкладку «Изображения». Фотографии можно загружать по одной (кнопка «Создать») или пакетом (кнопка «Пакетная загрузка»).

FW gallery joomla foto 6

Загрузка одной фотографии

FW gallery joomla foto 7

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

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

FW gallery joomla foto 9

Загрузка видео

На вкладке «Создать» есть поле: Тип файла. Там два типа, файлов, которые можно загружать. Это image и video. Для загрузки video выбираем тип файла: video.

FW gallery joomla foto 8

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

Важно! Загрузить видео вы сможете, а вот для его показа нужен платный плагин, FW Gallery Video плагин (ссылка в конфигурации).

Пакетная загрузка фотографий

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

FW gallery joomla foto 10

Итак, мы создали галерею, загрузили, одиночное фото, видео файл и пакет из 10 фотографий. Остается показать их на сайте. Чем и займемся.

Показать фотографии на сайте

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

FW gallery joomla foto 16

FW gallery joomla foto 14

  • Frontend manager Layout;
  • Galleries Layout;
  • Single Gallery Layout;
  • Single Image Layout;
  •  Single Tag Layout.

Далее, создаем пункт меню нужного типа. Можно создать несколько разных пунктов меню. Создаем модуль типа «Меню» и размещаем это меню на сайте. Чистим кэш сайта (Система→Очисть кэш сайта) и чистим кэш Браузера (Ctrl+F5). Ждем несколько минут. И видим результат работ.

Одиночное фото (Single Image Layout)

FW gallery joomla foto 20

Галерея (Single Gallery Layout)

FW gallery joomla foto 19

Альбом с привью (Galleries Layout)

FW gallery joomla foto 17

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

FW gallery joomla foto 18

В бесплатной версии можно показывать фотографии, только в модулях сайта или отдельных галереях. Для показа фотографий в статьях, нужно купить плагин FW Content (9,99$).

Создаем модуль FW Gallery

Входим на вкладку Расширения→Модуль расширений. Видим три типа модулей компонента FW Gallery. Создадим, например, модуль с последними загруженными фотографиями.

FW gallery joomla foto 15

FW gallery joomla foto 12

FW gallery joomla foto 13

  • Даем модулю название (0);
  • В дополнительных настройках указываем галерею (1), количество фотографий для показа (2), сортировку(3), размер фото (4) и форму показа, вертикаль или горизонталь (5);
  • Публикуем модуль не забыв, указать место его размещения.

Управление галереями и фотографиями

Под финал покажу, как можно управлять галереями и редактировать фотографии в галереях.

FW gallery joomla foto 11

На вкладке изображения есть поле поиска фотографий по названию (1 на фото), выбор галереи (2) и кнопки для редактирования фотографий (3) под каждым фото.

©Joomla3-x.ru

joomla3-x.ru


You May Also Like

About the Author: admind

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

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.