Плагин Lightbox Plus — улучшенный эффект для изображений

Сергей Арсентьев

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

Только одна проблема: эти плагины довольно капризны и не каждый захочет "всплывать" на вашем сайте. Я перепробовал множество плагинов прежде чем нашел рабочий для себя.

WP Lightbox, Lightbox2, Fancybox, Jquery Lightbox и другие плагины - лично у меня НЕ работали.

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

Внимание! Я нашел еще более крутой плагин!

Я нашел еще более крутой и толковый плагин для всплывающих картинок и галерей - Responsive Lightbox от dFactory. Так что все остальное можно не читать, оставляю как историю

Плагин полностью русифицирован, простые и нужные настройки, работает еще стабильнее и лучше.

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

Можете качать из репозитория https://ru.wordpress.org/plugins/responsive-lightbox/

5 минут и все работает, удачи!

Для истории оставляю предыдущий текст:

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

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

В файле header.php перед закрывающим тегом

В файле footer.php перед закрывающим тегом должна находиться примерно вот такая конструкция

Если их там нет совсем - добавьте. Если они где-то далеко от закрывающих тегов - переместите ближе. В некоторых темах WordPress эти php-конструкции отсутствуют и скрипты работают некорректно.

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

Раньше плагин был в репозитории WordPress, но сейчас вроде уже его там нет. Но зато можно скачать напрямую с сайта разработчика https://www.23systems.net/wordpress-plugins/lightbox-plus-for-wordpress/

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

Скачать бесплатно

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

Если после клика на социальный замок не показывается содержимое (такое бывает иногда в зависимости от браузера), то есть такие варианты:

• Попробуйте другую соцсеть или зайти из другого браузера
• Оставьте страницу подождать какое-то время (в новой полной версии соцзамка есть таймер обратного отсчета, он в углу показывает оставшееся время до самооткрытия).
• Заходите в спецархив - я тут выкладываю ссылки на все файлы ()

Полезный совет: Как можно быстро добавить полезную статью в закладки своего браузера: просто нажмите на клавиатуре "CTRL + D" и кнопку "Готово", это работает в большинстве браузеров, проверьте сейчас!

Эффект lightbox, когда изображение открывается в модальном окне, затемняя содержимое окна, довольно популярен среди администраторов сайтов и блогов. Используя такой эффект, вы сможете концентрировать все внимание читателей на конкретном изображении. Для активации подобного эффекта, очень часто требуется в код прямой ссылки, которая указывает на изображение, вставлять rel=»lightbox» или что-то в этом роде. Иногда используемый плагин или скрипт не делает этого автоматически и приходится искать и переписывать коды ссылок на изображения вручную, что неудобно.

Для того, чтобы rel=»lightbox » в коды прямых ссылок вставлялись автоматически, откройте файл functions.php, и добавьте в него:

Add_filter("the_content", "addrellightbox"); function addrellightbox($content) { global $post; $pattern ="//i"; $replacement = "post_title.""$6>"; $content = preg_replace($pattern, $replacement, $content); return $content; }

Данный код создает фильтр, пропускающий все ссылки, ведущие к файлам с расширениями bmp, gif, jpeg, jpg и png. Фильтр автоматом добавляет в ссылку rel=»lightbox».Изменить фильтр легко, если добавить в него другой тег, и такое изменение автоматически заработает в блоге.

1. Скачиваем архив скрипта Lightbox 2, разархивируем и заливаем на ФТП в любую директорию.

2. Открываем код шаблона wordpress и в файл header.php добавляем: