Phoca Gallery — бесплатная фотогалерея для Joomla — Часть 2 – Выбор способа отображения детального изображения, размер изображений в Phoca Gallery, автоматическое добавление водяных знаков

Сегодня в рамках рубрики «Расширения для Joomla» мы продолжим разговор об очень симпатичной и функциональной фотогалереи для Joomla 1.5 под названием Phoca Gallery. При всей своей простоте Phoca Gallery позволяет реализовать массу возможностей. Для создания большой, содержащей много категорий фотогалереи на страницах своего сайта, можно будет воспользоваться компонентом Phoca Gallery. В этом случае, фотогалерея будет выводиться в области контента Joomla, там где обычно выводятся статьи. Это специфика расширений под названием компонент — они выводят свое содержимое в области контента вместо статей (Расширения для Joomla — понятие компонента).

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

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

Настройка компонента фотогалереи для Joomla — Phoca Gallery


60c1cbd5

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Настройка автоматического добавления водяных знаков (Watermark) к изображениям в Phoca Gallery

В первой статье по Phoca Gallery я уже упоминал о возможности автоматического добавления в этой фотогалереи водяных знаков на все загружаемые изображения. Теперь давайте в деталях рассмотрим, как можно настроить добавление водяных знаков (Watermark) в Phoca Gallery. Во-первых, нужно будет найти в настройках Phoca Gallery область «Настройки водяного знака» и в поле «Создать водяной знак» выбрать вариант «Да». А в полях «X-позиция водяного знака» и «Y-позиция водяного знака» — выбрать положение водяного знака на изображении:

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

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

[html]/images/phocagallery/[/html]

Но это будет справедливо только в том случае, если вы планируете загружать все изображения в одну папку. А если вы будете загружать изображения для разных категорий фотогалереи Phoca Gallery в разные папки (создавая их в папке /images/phocagallery/), то у вас появится возможность автоматически добавлять к изображениям из разных категорий Phoca Gallery разные изображения водяных знаков. В этом случае нужно будет создать нужное количество пар файлов WATERMARK-LARGE.PNG и WATERMARK-MEDIUM.PNG и загрузить их по FTP в папки разных категорий изображений:

[html]/images/phocagallery/название папки, где будут храниться изображения из какой-либо категории Phoca Gallery[/html]

Настройка размера изображений в фотогалереи Phoca Gallery

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

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

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

На этом, наверное, вторую часть статьи «Фотогалерея Phoca Gallery» можно считать законченной. Можно было бы попробовать уложиться в рамки статьи, рассказав еще и о создании категорий и добавлении изображений в Phoca-Gallery, но про плагин Phoca Gallery Plugin рассказать в рамках этой же статьи уже не получилось бы.

Источник

ВСЕ ДЛЯ НОВИЧКА

Popularity: 72% [?]





  • Eekvasov

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

    А так приятно, что подробно расписано.

  • Jane

    Подскажите, пожалуйста, как русифицировать всплывающие подсказки к изображениям — Click to close image, click and drag to move. Use arrow keys for next and previous, и когда грузится — Loading? Заранее спасибо!

  • wrximpreza

    /components/com_phocagallery/assets/js/highslide/highslide-full.js

  • Jane

    Большое спасибо!!!

  • Tyrus

    Phoca не воспринимает русские названия файлов, а также знак $. Как решить этот момент?
    А также присоединяюсь к вопросу: как русифицировать всплывающие подсказки к изображениям — Click to close image, click and drag to move. Use arrow keys for next and previous, и когда грузится — Loading?
    Заранее спасибо!

  • Sergei Ve

    Отличная статья! Но нужная мне галерея — Highslide (Image only) — не ставится. Чтобы я не выберал из списка? ничего не меняется. Подскажите пожалуйста — как с этим бороться?

  • http://twitter.com/KtoNaNovenkogo Дмитрий

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