Здравствуйте, друзья! В этом уроке мы поговорим о создании галереи в WordPress. Практически каждый рано или поздно столкнется с необходимостью создать галерею изображений на сайте. В WordPress это достаточно простая задача, о который мы сегодня подробно и поговорим.
Создать галерею можно и без плагинов, использую для этого встроенную в WordPress стандартную функцию. Но в этом случае при нажатии на миниатюру, изображение будет открываться в новом окне, как отдельное изображение или на странице вложения. Такой просмотр изображений будет очень неудобным для пользователей вашего сайта.
Нам же нужно создать удобную и простую в использовании галерею, в которой при клике на миниатюру изображения будут открываться в лайтбоксе (lightbox). Данный эффект мы создадим с помощью простого и очень полезного плагина Simple Lightbox. И так, начнем!
Создание галереи изображений в WordPress
Самое первое что нам нужно — создать стандартную (встроенную в WordPress по умолчанию галерею). Для этого нужно:
1. Открываем страницу или запись на которую мы хотим добавить галерею и нажимаем «Добавить медиафайл».
2. В открывшемся окошке нажимаем «Создать галерею».
3. Нажимаем кнопку «Выберите файлы» и загружаем изображения для нашей галереи. После того как файлы загрузились, нажимаем кнопку «Создать новую галерею».
4. На этом этапе нам нужно указать настройки галереи, а именно:
- значение Ссылка можно оставлять по умолчанию;
- в значении Колонки указываем значение 4 (Количество колонок галереи изменяем в зависимости от настроек размера миниатюр. Чем меньше миниатюра изображения, тем больше колонок можно делать);
- в значении Случайный порядок ставим или убираем галочку по желанию. Если она стоит — изображения в галереи будут появляться в случайном порядке при каждой перезагрузке страницы, а если галочку не ставить — изображения будут всегда в том порядке, который вы укажите в настройках галереи (изменять порядок изображений можно в настройках галереи, простым перетаскиванием с помощью мышки);
- в значении Размер оставляем значение «Миниатюра».
После этого нажимаем кнопку «Вставить галерею» и сохраняем страницу.
Таким образом мы создали самую простую галерею с помощью WordPress. Но это еще не все, осталось сделать самую малость. Теперь нам нужно добавить Lightbox эффект для нашей галереи. Сделаем мы это таким образом:
5. Скачиваем и устанавливаем плагин Simple Lightbox. Сразу после активации плагина все изображения в нашей галереи будут открываться с Lightbox эффектом! Если вы забыли как в WordPress можно скачать и установить плагин — почитайте этот урок.
Готово!
Таким образом, всего за несколько минут можно создать красивую и простую галерею изображений в WordPress. Вот такой результат в итоге мы получили:
Друзья, если у вас возникли вопросы или трудности при создании галереи, пишите в комментариях. Постараюсь ответить на все ваши вопросы и помочь в решении вашей задачи.
Добрый день! Подскажите, пожалуйста — если мне понравился определенный шаблон сайта на WP, но тема, которая на этом шаблоне и фото для меня не актуальны. Я могу в этом шаблоне потом менять изображения, название меню? извините за идиотский вопрос, но я совсем новичок)))) Спасибо!
Нужно в настройках темы смотреть. Лучше всего скопировать название темы и через поисковик найти ее сайт. Там в основном можно посмотреть, какие настройки тема позволяет сделать. А те картинки, которые стоят можно будет поменять. Темы лучше всего смотреть и выбирать через админку (внешний вид — темы) С фоном может быть сложнее, но опять же от темы зависит. Мое мнение главное это внешний вид (наличие или отсутствие шапки сверху, возможность ставить виджеты, количество колонок по бокам и их расположение). И конечно гибкость настроек: т.е. насколько их можно будет настроить под себя. И удачи в сайтостроении))))
Здравствуйте! Скажите, эта самая галерея будет где? на главной? или можно делать галереи в записях? У меня сайт с текстовыми новостями, но хочу делать записи с картинками, но массово загружать их, и выводить на главной просто как новость, а по переходу в новость чтобы отображалась галерея.
Как реализовать такое?
Здравствуйте! Такую галерею можно добавлять на любой странице или записи.
спасибо за ответ, нашёл уже.
Подскажите пожалуйста, почему после установки и активирования плагина Simple Lightbox в моей галерее не произошло никаких изменений?
спасибо, помогло!
Александр, как сделать так, чтобы галлерея которую мы создали выглядела также на странице, куда мы переносим фотографии? Дело в том, что после переноса фото на страницу из фотогаллереи смотрится все ужасно.
А есть ли возможность создать галерею из фотографий со стороннего ресурса, например из альбома в гугл фото?
Возможно этот плагин сможет вам помочь Google Photos WordPress Plugin
Скачала шаблон с крутящейся галереей из 5 популярных записей, выбрала свою рубрику, как там написано, с картинками, но картинки не крутятся а просто стоит одна последняя. Как быть?
После установки плагина фото все-равно открываются в новой вкладке… в чем проблема, подскажите?
Здравствуйте!
Подскажите можно ли сделать так чтобы фотографии в уже созданную галерею добавлялись не в конец, а в начало.
А то если большая галерея то добавить пару фоток и потом их перетаскивать в самый верх довольно сложный процесс.
Спасибо.
Здравствуйте!
Как вариант, возможно Вам стоит разбить галерею на две. Также попробуйте использовать кнопку «В обратном порядке». Перед загрузкой фото ставите стандартную последовательность, загружаете фото и после еще раз нажимаете кнопку. Таким образом мне кажется можно решить Вашу задачу.
Спасибо! Интересный вариант решения )) Будем им пользоваться пока не найдём другого решения.
Может где-то в коде надо что-то подправить чтобы изначально в начало добавлялись?
у меня почему то на страницы смотрится это без рамочек. как у вас на рисунке и все фотки просто слипаются. а вот в лайтбоксе отображаются нормально. и не кнопок чтобы показать следующую фотку, только по одной
Скажите, пожалуйста, а по какой причине после создания такой галереи сами фотографии в ней не открываются?
Галерея есть (ряды, колонки), но при нажатии на какую-нибудь фотографию происходит затемнение экрана и всё.
Вероятнее всего, где-то конфликт JS скриптов. Посмотрите консоль браузера на наличие ошибок, или попробуйте отключить все плагины кроме галереи, чтобы исключить конфликты плагинов. Как вариант, также может быть проблема где-то в самой теме, если она давно не обновлялась или сделана не по стандартам.
Александр, Вы пишите «попробуйте отключить все плагины кроме галереи» — их нужно деактивировать или еще и удалить после этого?
Здравствуйте, Александр!
Подскажите, пожалуйста, как можно сделать, что бы при просмотре изображений галереи, при наведении мышки на край изображения, появлялись кнопки «вправо» и «влево» для просмотра «туда-сюда»?Интересуют боковые кнопки поверх самого изображения,а не стрелочки внизу под изображением. Видела такое много раз на сайтах на вордпресс, но нигде не могу найти,как так сделать.
Буду очень благодарна, если вы сможете помочь.
С уважением, Наталья.
Плагины Fotorama или Esy Fancy Box for wordpress
Easy FancyBox
Здравствуйте, Александр!
А подскажите, пожалуйста, как создать вот такую страничку пример: templatemonster.com/ru/demo/58572.html (нужно зайти в раздел категории), она вроде похожа на галерею, но не совсем. Мне необходимо, чтобы это были мои рубрики (у меня сайт по приготовлению пищи) и я хочу сделать аналогично. Подскажите, это относиться к галерее или это совершенно другой плагин или эта функция есть в вордпрессе. Где почитать про это или посмотреть.
Заранее спасибо
С уважением, Ярославна
Здравствуйте!
В примере это также судя по всему категории, просто с установленной миниатюрой. Сделать по умолчанию так не получится, особенно в красивом виде.
Рекомендую поискать какой-то плагин для вывода категорий/подкатегорий с миниатюрами (картинками этих категорий).
Добрый день ! Скажите пожалуйста , когда выкладываешь галерею … как мне повысить читаемость и нужны ли эти настройки в принципе ? Или главное правильно подписать сами фото ?
не подскажете как вывести определённое колличество изображений на странмце в галерее?
добрый день!
а как при создании галереи — вставить фото с сайта, с инстаграма.
Я вставляю ссылку со своего рабочего инстаграма. Но не пойму, что делать потом
title у Вас с ошибкой написан в последнем слове….поменяйте 😉
Спасибо за статью!
добрый день!создаю интернет магазин на вукоммерс,добавил товары.Но есть одно наименование в категорий с разными характеристиками и ценами т.д,их 3штуки,вот из них можно сделать слайдер или галерею с разными ценами и описанием,и когда меняешь картинку менялись и цены и описания,спасибо
Здравствуйте, у меня в библиотеке скопилось очень много повторных картинок (и некоторых аж по 10 штук, причем с одним и тем же размером и обозначением) . Как узнать, какие картинки и их миниатюры действующие, а какие повторные? Повторные появились после скачивания плагина для упорядочивания медиафайлов не по датам, а по страницам, где они присутствуют. Плагин мне не понравился, потому что надо было вручную создавать новые папки и туда загонять картинки. Я его удалила, но в медиа-библиотеку он загнал кучу повторов после сканирования моей библиотеки.
Добрый день! Хочу самостоятельно создать галерею с помощью плагина для сайта прочистки канализации на этой странице http://zasorvrn.ru/metod-mekhanicheskoy-elektromekhanicheskoy-prochistki.php. Как лучше установить плагин, чтобы не поймать вирусов? Надо устанавливать через админку в разделе плагины и искать их там или можно загрузить архив скачанный в другом месте?