Создание галереи при помощи NextGEN Gallery.

Nextgen-Gallery. WordPress

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

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

www.imagely.com/docs/demos-of-all-nextgen-gallery-types/ — здесь вы сможете посмотреть все предлагаемые им возможности по выводу слайдшоу, галерей, изображений и видео.

Ну как вам! Правда здорово!

Если данный плагин заинтересовал Вас, тогда переходим к его установки.

Установка и русификация плагина NextGEN Gallery

Для начала давайте скачаем его:

Скачать плагин NextGEN Gallery с оф. сайта wordpress.org или с www.imagely.com

Скачали? Теперь можно переходить к непосредственной установке его:

Устанавливается NextGEN Gallery как обычно: распаковываете скачанный zip архив «nextgen-gallery.zip» и копируете папку «nextgen-gallery» в папку с плагинами вашего блога: /wp-content/plugins/

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

После того как вы закачали плагин на свой блог, его нужно активировать, для этого в админку WordPress, перейдите на вкладку «Плагины» — «Неактивные», найдите NextGEN Gallery и нажмите на ссылку «Активировать». С этим я думаю у вас проблем не возникнет!

После активации плагина в нижнем левом углу админки WordPress у вас появится новая область — «Галерея» или «Gallery», если вы скачали плагин не смоего блога.

Русификацию для плагина можно скачать на странице:

http://code.google.com/p/nextgen-gallery/downloads/list?q=label:Translation (скачайте файл nggallery-ru_RU.mo»). После этого снова по FTP подключитесь к вашему блогу и загрузите данный файлик в папку: /wp-content/plugins/nextgen-gallery/lang, после этого все настройки плагина будут на русском языке.

Теперь переходим к следующему пункту:

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

Из меню админки WordPress выберем пункты «Галерея» — «Загрузить галерею / изображения»:
NextGEN Gallery - Загрузить галерею.В открывшейся странице «Добавить новую галерею», в поле «Новая галерея» вам нужно вписать название Вашей будущей галереи (писать нужно на латинице (лучше транслитом)), которую вы затем сможете выводить на страницах своего блога и затем нажать «Добавить галерею»:

NextGEN Gallery - Создаём новую галерею.После этого плагин NextGEN Gallery должен сообщить Вам об успешном создании галереи с ID=1 и там же присвоит её короткий shortcode — [ nggallery id=1 ] (без пробелов до и после квадратных скобок) при помощи которого данную галерею можно будет вывести на любые страницы блога (см. рисунок ниже).
А в случае, если у вас не создалась папка «wp-content/gallery/», тогда вам нужно будет создать ее самим и становить на неё права доступа — 777 (как установить права доступа на папку при помощи FileZilla — статья в разработке). А затем снова повторите создание галереи.

После того, как новая галерея создастся вас перебросит на страниу: «Загрузить изображения», здесь из выпадающего списка Вам нужно выбрать название созданной Вами галереи, в которую вы хотите добавить изображения, а затем нажать на кнопку «Выберите файлы»:
NextGEN Gallery - Загрузка изображений в галерею.Перед вами откроется окно проводника windows? В котором нужно найти и выбрать нужные изображения (для выделения нескольких изображений удерживайте на клавиатуре клавишу Ctrl или Shift) и затем нажать на кнопку «Открыть»:

Проводник виндовса.

Далее, нажимаем на : «Загрузить изображения».

В результате появиться окно процесса загрузки выбранных вами, после чего плагин вам сообщит что изображения добавлены, и что вы можете отредактировать их:
Создание галереи при помощи NextGEN Gallery.Кстати, чуть не забыл — одновременно с загрузкой изображений плагин NextGEN Gallery создаёт и их превьюшки (которые располагаются по следующему адресу «/wp-content/gallery/название-галереи/thumbs»), при необходимости в настройках плагина Вы всегда можете отредактировать их.
Теперь нажмите на ссылку: «Редактировать галерею» и вы попадёте на страницу редактирования галереи, здесь вы сможете ввести Alt, Title (рекомендую сделать это, для того чтобы загруженные вами изображения участвовали в поиске), метки для изображений, установить на них водный знак, ввести описание для всего альбома, указать его обложку и т.п.:
NextGEN Gallery - Редактируем галерею

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

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

Ну а теперь перейдём к общим настройкам:

Для этого перейдите по вкладкам «Галерея» — «Настройки» и попадаете на страницу «Главные настройки»:
Главные настройки NextGEN GalleryВ этой вкладке я оставил без изменений, единственно в поле Макс. количество изображений я установил значение о, для того чтобы в галерею можно было добавлять любое количество изображений.

Теперь пробежимся по остальным настройкам:

— «Миниатюры». Здесь вы можете задать размер и качество первюшек больших изображений, лично я оставил всё по умолчанию.

— «Изображения». Здесь Вы можете изменить размеры выводимых в галереи изображений и поставить галочку в чек бокс «Automatically resize» — чтобы плагин при загрузке в галерею атоматически изменял размеры изображений.

— «Галерея» — Здесь я изменил значение поля «Количество изображений на странице» на значение ноль, для того чтобы на странице вывода галерее были показаны все изображения из неё, а также в поле «Добавить слайдшоу» изменил поля [Show as slideshow] и [Show picture list] на «Показать как слайд-шоу» и «Показать список изображений», а всё остальное оставил по умолчанию.

— «Эффекты» — Ну здесь думаю всё понятно, выбираете любой нужный вам эффект.

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

NextGEN Gallery - настройка Водяного знака

А чтобы установить водяной знак на изображения галерей нужно выбрать пункты «Галерея» — «Галереи», далее щелкнуть по названию нужной фотогалереи. В открывшемся окне отметить изображения, на которые вы хотите наложить водяной знак, затем в выпадающем меню выбрать пункт «Установить водяной знак» и затем нажать на кнопку «Apply» («Применить»):
NextGEN Gallery - установка Водяного знака на изображения в галереи.Перед вами появиться окошко подтверждения действия, нажимаете «OK»
подтверждение действия.Внимание! Водяной знак накладывается на изображение навсегда.
Для того чтобы проверить добавился ли водяной знак на изображения, щелкнете по ссылке «Смотреть»:

Проверяем наложились ли водяные знаки.

Обратите внимание: ID изображений указаны  в левом столбце.

А ID нужной галереи можно узнать зайдя во вкладки «Галерея»-«Галереи» (отображается в левом столбце):
ID галерей.ID галереи или ID изображений, могут понадобиться вам при вставке галереи, слайдшоу или отдельных изображений в статью WordPress с помощью коротких кодов.

— «Слайдшоу» — Здесь я изменил «Размер по умолчанию (высота х ширина)» под контент блога (у меня 603х603), поставил чекбокс на против пункта «Enable flash slideshow», для того работали Flash слайд-шоу и в поле «Путь к Imagerotator (URL)» указал url до файла imagerotator.swf. Если вы скачали плагин с моего блога, то в поле «Путь к Imagerotator (URL)» укажите: http://Ваш-домен.ru/wp-content/plugins/nextgen-gallery/imagerotator/imagerotator.swf.

Открываем или создаем новую запись (страницу), набираем текст если нужно, далее щелкаем по кнопке: Добавить галерею NextGEN:
кнопка - Добавить галерею NextGEN.В результате перед Вами появится всплывающее окно с тремя вкладками: галерея, альбомы, изображения: Перейдите на нужную вам вкладку и из выпадающего списка выбираете нужное вам, допустим нам нужно вставить галерею с изображениями, тогда во вкладке «галерея» поставите галочку напротив нужного Вам способа показа изображений и нажмите на кнопку «вставить»:
Добавляем галерею NextGENВ месте где у вас стоял курсор (в окне ввода текста), появится shortcode плагина NextGEN Gallery, который и будет формировать вывод Вашей галереи в статье или на странице WordPress:
Коротенький код галереи.В принципе, можно обойтись и без визуального редактора. Прейти в режим HTML и в место где нужно вывести галерею, картинку или альбом с изображениями вставить короткий shortcode плагина NextGEN Gallery с нужными параметрами.
Например:
Для вставки в статью (страницу) одного изображения, которое при щелчке мышью по нему, будет плавно увеличиваться, нужно вписать следующий shortcode:
[ singlepic id=N h=высота w=ширина mode=web20 ] без пробелов до / после скобки.
А для вывода списка альбомов (галерей) в подробном виде:
[ album id=N template=extend ] без пробелов до / после скобки.
Подробнее о всех кодах можно узнать здесь: www.imagely.com/docs/demos-of-all-nextgen-gallery-types/

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

Ну и это ещё не всё!

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

Создание галереи при помощи NextGEN Gallery.

На сегодня всё! Жду Ваших комментариев!
Удачи вам в создании своей фотогалереи.
До скорых встреч друзья!

Поделиться с друзьями
Алексей

Веб-дизайнер и SEO оптимизатор. Занимаюсь созданием сайтов с 2010 года и их продвижение с 2012 года!

Оцените автора
( Пока оценок нет )
Web-Revenue.ru
Добавить комментарий

  1. Лидия

    Здравствуйте! У меня такая проблема, когда я пытаюсь вставить галерею в текст, нажимаю на кнопку NextGEN, всплывает пустое окно и всё! А раньше было всё хорошо, как у вас на картинке…. Что могло случиться и почему окно пустое, подскажите?

    Ответить