Меню

Phoca gallery настройка эскизов



Joomla — Урок 13. Создаем первую галерею Phoca Gallery

Как вы помните у нас в каталоге товаров 13 разделов и в каждом в среднем по 3 категории. Таким образом, нам предстоит создать около 40 фотогалерей. Чтобы не запутаться, какие образцы, к каким категориям относятся, неплохо было бы иметь возможность как-то их рассортировать. В компоненте Phoca Gallery предусмотрена такая возможность, а именно — возможность создавать различные категории для изображений.

Кратко алгоритм работы с Phoca Gallery выглядит так:

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

Теперь давайте создадим нашу первую фотогалерею. Если вы не забыли, наш первый раздел — Брянск, первая категория — гофрированные обои, с нее и начнем.

Идем в Компоненты — Галерея Phoca Gallery — Категории и в открывшемся окне щелкаем по кнопке Новый. Откроется окно создания категории, где надо задать:

  • Заголовок. В нашем случае, например, Брянск — гофра.
  • Псевдоним. В нашем случае — brynsk-gofra
  • Родительскую категорию. Мы создаем первую категорию, так что и выбирать не из чего. Но вообще Phoca Gallery поддерживает вложенность категорий. Например, мы могли бы сделать категорию Брянск, а в ней подкатегории: гофрированные, дуплекс, мойка, пена. Мы усложнять (т.е. делать вложенные категории) пока не будем.

Остальные настройки оставляем по умолчанию.

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

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

Теперь о загрузке изображений в галерею. Сделать это можно несколькими способами:

  • Идем в папку oboi/images/phocagallery. Создаем здесь папку под нашу категорию — brynsk-gofra и в нее копируем наши изображения. Теперь наши изображения находятся на нашем сервере.
  • Теперь идем в административный раздел Компоненты — Галерея Phoca Gallery — Изображения

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

Щелкаем по нашей папке brynsk-gofra:

Ждем какое-то время, пока Phoca Gallery создает пиктограммы наших изображений:

После чего щелкаем по первому изображению (выбирая его таким образом):

и видим, что его название появилось в названии файла в окне описания изображения. Нам осталось задать изображению Название (Адель), Псевдоним (adel) и выбрать категорию (Брянск-гофра). Остальные настройки оставляем без изменения и щелкаем по кнопке Сохранить:

  • Аналогично создаем все изображения нашей категории.
  • Способ второй

      Идем в административный раздел Компоненты — Галерея Phoca Gallery — Изображения и нажимаем на кнопку Новый. Откроется окно добавления изображения в галерею. Щелкаем по кнопке Изображения. В открывшемся окне можно создать папку для изображений категории, набрав название в поле Папка и щелкнув по кнопке Создать папку. А затем загружать изображения по одному, щелкнув по кнопке Обзор, выбрав изображение у себя на компьютере и нажав на кнопку Начать загрузку:

    Далее щелкаем по изображению (выбирая его таким образом), даем ему Название (Адель), Псевдоним (adel), выбираем категорию (Брянск-гофра) и сохраняем.

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

    Таким образом, наша первая галерея создана, осталось лишь вывести ее с помощью плагина Phoca Gallery Plugin в нужном месте сайта. Но сначала самостоятельно создайте еще три галереи: Брянск-дуплекс (brynsk-duplex), Брянск-моющиеся (brynsk-moyka) и Брянск-пена (brynsk-pena). Изображения для этих галерей можете скачать здесь (для наших целей хватит по 5-10 изображений на категорию). В результате, в Менеджере категорий Phoca Gallery у вас должно быть четыре категории:

    И в каждой категории должно быть по несколько изображений.

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

    Источник

    Phoca Gallery: создание фотогалереи на Joomla 3

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

    По умолчанию функцией создания фотогалереи Joomla не обладает, зато в каталоге расширений есть целый раздел, посвящённый только выполняющим её дополнениям — Photos & Images -> Galleries.

    Самое популярное дополнение этой категории — Phoca Gallery. О нём и расскажу.

    Phoca Gallery

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

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

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

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

    После инсталляции меню Компоненты пополнится ещё одним пунктом, перейдя в который, вы сможете управлять галереей.

    По умолчанию устанавливается английская версия галереи, но для неё доступен русификатор, скачайте его, Внимание: скачивать надо именно второй архив с одним файлом внутри: первый — устаревший, и русифицировать им не получится.

    Распакуйте загруженный архив и скопируйте единственный извлечённый файл ru-RU.com_phocagallery.ini в две директории:

    • В папку вида http://адрес_сайта/language (у меня на локальном сервере это путь Z:\home\test1.ru\www\language).
    • В каталог вида http://адрес_сайта/administrator/language (по умолчанию на localhost — Z:\home\test1.ru\www\administrator\language).

    Интерфейс Phoca Gallery сразу станет русскоязычным.

    Перед тем, как компонентом пользоваться, крайне желательно его правильно настроить. Чтобы перейти к параметрам, откройте Компоненты -> Phoca Gallery и в правом верхнем углу появившейся страницы нажмите кнопку Настройки. Параметров очень много, для удобства они сгруппированы по вкладкам.

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

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

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

    Главные настройки. Несмотря на символизирующее название вкладки, далеко не все администраторы меняют её параметры. А зря, ведь здесь можно задать мета-данные, настроить RSS и геолокацию.

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

    Эскизы. Содержит параметры создания миниатюр и добавления водяного знака, настройка размеров картинок и даже пара параметров безопасности.

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

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

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

    Когда фотогалерея настроена, можно перейти к созданию категорий.

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

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

    Находясь в панели управления Phoca Gallery, нажмите Изображения, на следующей странице щёлкните Добавить несколько, внизу очередной страницы нажмите кнопку Мульти загрузка, если хотите закачать сразу несколько изображений, затем щёлкните Add files, выберите картинки и нажмите Start Upload.

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

    Источник

    LiveInternetLiveInternet

    Поиск по дневнику

    Подписка по e-mail

    Постоянные читатели

    Сообщества

    Трансляции

    Статистика

    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

    Прежде, чем приступать к формированию категорий для будущих фотогалерей и начинать загрузку в эти категории фотографий, давайте сначала пробежимся по настройкам фотогалереи для 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. Обычно это папка:

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

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

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

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

    среднего эскиза, который будет отображаться на страницах фотогалереи

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

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

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

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

    Источник

    Читайте также:  Настройки при экспорте adobe premiere
    Adblock
    detector