WordPress: Настройки плагина галереи NextGen Gallery

WordPress: Настройки плагина галереи NextGen Gallery Полезные настройки плагина галереи NextGen Gallery и примеры кода вывода фотографий.

Чтобы вывести фотки из галереи, отмеченные каким-либо тегом, пишем

[nggtags gallery=tag1]

Мне это понадобилось, чтобы вывести только 5 фоток из галереи, в которой всего 6 фотографий (до этого выводились они [nggallery id=5]).

вывод фото по тегам в NextGen Gallery для WordPress

___________________________

Вывести фото с сортировкой по названию файлов:

[nggallery id="8" images="200" ngg_gal_sort="filename" ngg_gal_sortdirection="ASC"]

 

 

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

1. Как установить NextGEN Gallery

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

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

Плагин находится тутwordpress.org/extend/plugins/nextgen-gallery

2. Как настроить NextGEN Gallery

Выберите в меню Галерея или Gallery и нажимайте.

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

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Откройте меню Галерея - Настройки:

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Рассмотрим некоторые из них:

  • Путь к галереи — в этой папке на хостинге будут храниться фотографии.
  • Активировать ЧПУ — включение человеко-подобных адрессов для фотогалерей.
  • Создать новый URL изображения с ЧПУ ссылкой — Для обновления структуры постоянных ссылок, кликните по кнопке «Ок».

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

3. Добавление NextGEN галереи

Откройте пункт меню Галерея → Добавить галерею / изображения. Укажите название галереи и кликните Добавить галерею.

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Вы увидите сообщение с кодом вставки галереи на ваш блог: [nggallery id=n].

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

 

4. Добавление фотографий

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

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Фотографии можно просто перетащить — так они тоже добавляются в список загрузки.

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

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

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

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

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

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

В правом столбце галочками можно исключить отображающиеся фотографии.

Есть достаточно много шаблонов галерей. Шаблон с отображением описания и названия к фотографиям получит текст именно с этой странички. С помощью Тегов можно создать коды для отображения фотографий с определенными тегами.

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

6. Добавление альбома

Для добавления и редактирования альбома перейдите в меню Галерея — Альбом. Укажите название нового альбома и кликните на кнопку Добавить.

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

Если вы создадите мало галерей, то альбомы вам вряд ли понадобятся.

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Создайте альбом и свяжите его со страницей.

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Выберите альбом. Для добавления галереи в альбом перетяните ее мышкой в альбом и кликните «Обновить».

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

7. Добавление галереи на страницу

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

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Вот так будет выглядеть галерея:

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

У NextGen галерей есть несколько шаблонов по умолчанию с разными эффектами. Вид галереи настраивается через параметры кода вставки.

Пример slideshow шаблона carousel:

[nggallery id=1 template=carousel images=3]

wordpress  NextGEN Gallery — WordPress плагин для фотогалереи

Список остальных параметров можно прочесть вот тут: www.nextgen-gallery.com/nextgen-gallery-features

Параметры кодов вставки:

Отображать подписи в виде эскизов галереи

  • [ nggallery id=2 template=caption]

Основные Filmstrip галереи

  • [ nggallery id=2 template=carousel images=5]

Использовать изображение тегов для создания галереи / Альбомов

  • [ nggtags album=Nature,England,Sea]

Template Engine for Gallery Types

  • [ nggallery id=2 template=sample1]
  • [ nggallery id=2 template=sample2]
  • [ nggallery id=2 template=sample3]
  • [ nggallery id=2 template=sample4]
  • [ nggallery id=2 template=sample5]
  • [ nggallery id=2 template=sample6]

Отображать Exif данные

  • [ imagebrowser id=28 template=exif]

Сортировка изображений в галерее на основе их тегов

  • [ nggtags gallery=Sea,England,..]

Интеграция с сторонними плагинами

  • [ monoslideshow id=1 w=560 h=460]
  • [ nggallery id=2 template=galleryview images=0]
  • [ media id=7 width=520 height=424 plugins=revolt-1]
  • [ media id=3 width=330 height=250 plugins=rateit-2]

Добавить облака тэгов

  • [ tagcloud]

Опции одиночного изображения

  • [ singlepic id=y w=ширина h=высота mode=web20|watermark float=left|right]

Оригинал: wordpresso.org/plugins/nextgen-gallery-samyiy-populyarnyiy-wordpress-plagin-dlya-foto

 

 

almix
Разработчик Loco, автор статей по веб-разработке на Yii, CodeIgniter, MODx и прочих инструментах. Создатель Team Sense.

Вы можете почитать все статьи от almix'а.



Другие статьи по этой теме:

Комментарии (3)     Подпишитесь на RSS комментариев к этой статье.

3 комментариев

#1110
Виктор говорит:
March 7, 2014 at 08:18 pm
Я у себя на сайте, установил плагин этот. все классно и красиво, вот только он нагружает очень хостинг, при просмотре галереи. Что можете посоветовать? у меня просто много фото по теме (10-30) а как их оформить в статье не знаю.
#1302
Александр говорит:
December 15, 2014 at 07:32 pm
Здравствуйте,
может кто сможет подсказть в чем проблема и как ее исправить.
Установил NextGEN Gallery и NextGEN Gallery Voting все легло отлично, все работает.
Но вот незадача...
У меня ппочему то на странице как то странно фотЫ отображаются, а конкретно - три в ряд на следующем одно фото, тир в ряд и одно.
Как можно сделать, чтобы небыло таких одиночек.

Вот урла для визуального пояснения: http://www.korsetynadomspb.ru/


И вот еще один вопрос:

можно ли как нить такой шорт [nggallery id=x template=caption] прописать по другому?

Просто в редакторе мне выдал вот такой код:

<img class="ngg_displayed_gallery mceItem" class="template=caption" src="http://www.korsetynadomspb.ru/nextgen-attach_to_post/preview/id--3344" alt="" />


Буду весьма благодарен за помощь!
#1303
almix говорит:
December 15, 2014 at 08:53 pm

Александр, у вас может в параметрах плагина Nextgen в админке wordpress'а стоит показывать 4 фото в ряду. Это видно в исходном коде:

<div id="ngg-image-16" class="ngg-gallery-thumbnail-box" style="width: 25%;">
<div id="ngg-image-17" class="ngg-gallery-thumbnail-box" style="width: 25%;">
<div id="ngg-image-18" class="ngg-gallery-thumbnail-box" style="width: 25%;">
<div id="ngg-image-19" class="ngg-gallery-thumbnail-box" style="width: 25%;">
<br style="clear: both;"/>

Ширина у div 25% и добавляется перенос строки clear:both после 4-го блока. Посмотрите может есть там поле показывать в ряд столько-то фото. Что-то типа amount of thumbs per row