Доброе время суток!
В сегодняшнем посте рассмотрим такой вопрос, как реализовать на сайте (блоге) галерею изображений с помощью плагина nextgen gallery ну и конечно разберемся со всеми тонкостями его настроек — это размещения галереи изображений в статьях, страницах, рубриках, установка водяного знака на изображения и множество других параметров.
Итак, ниже вы можете увидеть, как будет отображаться галерея изображений на вашем сайте.
Скачать с сайта разработчика
Настройка плагина nextgen gallery
Пункт установки и активации плагина пропускаю, думаю, вы не впервые устанавливаете плагины WP, а если призабыли, тогда вспоминаем здесь.
После установки в админ. панели WP появится новый пункт «Галерея» с 7 пунктами, пронумерованы на скриншоте ниже.
1. пропускаем там статистические данные сколько создано галерей и альбомов.
2. «Добавить галерею/Изображения»
- 1 – создать новую галерею – данный пункт будет установлен по умолчанию.
- 2 – указываем свое название галереи – к примеру: Корсеты2.
- 3 – переходим Add Files – откроется окно выбираем свои
заранее.заготовленные изображения, картинки. - 4 – открыть.
- 5 – список загруженных изображений.
- 6 – Start Upload – загрузка изображений в созданную галерею.
3. Управления галереями – в данном пункте будут отображаться созданные галереи и их информация (id, название, количество изображений, id страницы).
Также в данном пункте устанавливается водяной знак той или иной галереи.
- 1 – выбираем действие.
- 2 — отмечаем id.
- 3 – выбираем поставить водяной знак nextgen gallery.
- 4- применить.
4. Управления альбомами — после создания и выбора альбома ниже, вы можете перетащить галерею или другой альбом в ваш новый альбом.
5. Теги – правка, изменение или задать новые теги изображениям.
6. Настройка галереи – здесь задаются основные требования для вашей галереи изображений при настройки плагина nextgen gallery – это раздел можно считать одним из основных, итак, что здесь будет
7 пунктов
п. 1 NextGEN Basic Thumbnails — основных миниатюр
К примеру: зададим 3 изображения на страницу и 3 в ряд получим
п. 2 NextGEN Basic Slideshow — слайд-шоу
здесь можно задать максимальный размер изображения (параметры 600 на 400 вполне нормальные) но можно и поэкспериментировать.
п. 3 NextGEN Basic imageBrowser — изображения в браузере.
Также можно оставить по умолчанию (Переключение страниц через AJAX)
п. 4 NextGEN Basic Single Pic — одиночное
здесь отмечаем п. 1, п. 2 и п. 3 отмечены на скриншоте
обратите внимание на п. 2 показывать водяной знак (который подключается к галереи в Управлении галереи).
п. 5 NextGEN Basic TagCloud — облако тегов.
максимальное количество тегов — по умолчанию стоит 45 — можно ничего не менять.
п. 6 NextGEN Basic Compact Album — компактный альбом.
п. 7 NextGEN Basic Extended Album — расширенный альбом.
Можно оставить по умолчанию с самого названия уже должно быть вам видно что они предназначены для альбомов, если будите создавать альбомы тогда можно их настроить указав сколько галерей отображать в альбоме и т.д.
7. Прочие настройки — здесь задаются основные настройки всему плагину в данном пункте 8 подпунктов.
Здесь основное внимание хочу обратить на пункт 3 эффекты Lightbox и 4 водяной знак.
3 — эффекты Lightbox здесь два пункта.
Пункт 1. Выбор эффекта — их там 5, при установки того или иного эффекта изображения будут переключаться для просмотра по-разному. Пример, трех показан на скриншоте
по тестируйте подберите свой эффект переключения изображений.
Пункт 2. Позволяет выбрать область применения — можно выбрать для всех изображений которые у вас есть на сайте или только для этого плагина.
4. водяной знак — здесь настраиваем свой водяной знак, можно надпись, или картинку.
Как разместить галерею изображений на странице
Для этого необходимо разместить шорткод на странице где вы собираетесь отобразить галерею
миниатюра галерей
1 | [nggallery id=1] |
1 | [nggallery id=1 template=caption] |
слайд-шоу
1 | [slideshow id=1] |
альбом
1 | [album id=1 template=compact] |
Показать подписи в галереи эскизов
1 | [nggallery id=1 template=caption images=3] |
Диафильм галереи
1 | [nggallery id=1 template=carousel images=6] |
полный список кодов можно просмотреть на сайте разработчика тут.
На этом все.
Кому подкинуть книгу? «WordPress для чайников» обращайтесь.