Блог по продвижению сайтов Блог по SEO

Лучший плагин для всплывающих окон в WordPress

Просмотров: 10185

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

всплывающие фото wordpress

Я перепробовал множество плагинов прежде чем нашел рабочий для себя.

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

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

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

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

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

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

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

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

Читайте также:  Как правильно выбирать шаблон для сайта

настройки плагина всплывающик картинок

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

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

Преимущества Lightbox Plus Colorbox.

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

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

Установка и настройка Lightbox Plus Colorbox

Устанавливается как обычный плагин WordPress, после активации сразу сделайте следующие настройки:

Вкладка "General"

Resize Speed:500
Overlay Opacity:80%

По умолчанию там другие значения. Может задать и на свой вкус, но мне эти больше всего понравились.

Вкладка "Position"

Fixed: Да.

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

Читайте также:  Как установить счетчик Гугл Аналитикс на сайт

Вкладка "Position"

Overlay Close: Да (чтобы можно было закрыть простым кликом на любую часть экрана)
ESC Key Close: Да (чтобы можно было закрыть по клавише Esc)

Вкладка "Styles" (основные настройки)

Lightbox Plus Colorbox Style: Выбор стиля

Внешний вид всплывающей картинки. По умолчанию там полная ерунда стоит. Мне больше всего понравились: Overtext и Fancypants.
Впрочем вы можете выбрать что-то другое или вообще создать свой CSS-стиль.

А если все равно не работают всплывающие окна?

Как я уже говорил выше Lightbox Plus Colorbox единственный плагин, что у меня заработал во всех браузерах. Другие или вообще не работали, или не работали в конкретных браузерах (чаще всего почему-то в Firefox).

Но я не исключаю ситуацию, когда и этот плагин вдруг по каким-то причинам лично на вашем блоге не заработает. Связано это может быть с конфликтом JS и искать причину, поверьте, себе дороже - можно убить сутки и ничего не найти. Тут нужно быть специалистом по Java или нанять такого специалиста, но это вам вряд ли обойдется дешевле, чем 20-30$.

Поэтому простых и дешевых вариантов несколько:

1Перебрать все остальные плагины всплывающих картинок для Wordress по очереди, в надежде что какой-нибудь из них заработает.

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

Читайте также:  Что такое хостинг

3Ну и еще есть один момент, в котором нужно убедиться. Откройте файлы, которые находятся в вашей теме header.php и footer.php. Это можно сделать с помощью FTP доступа, вот инструкция.

В файле header.php перед закрывающим тегом </head> должна находиться примерно вот такая конструкция <?php wp_head(); ?>

Не показываются всплывающие картинки WordPress в header

В файле footer.php перед закрывающим тегом </body> должна находиться примерно вот такая конструкция <?php wp_footer(); ?>

Не показываются всплывающие картинки WordPress в footer

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

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

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

Устанавливается как обычный плагин WordPress

Удачи в бизнесе.

Полезные цитаты: Сегодня я богат именно благодаря тому, что я сделал в свободное время (Р.Кийосаки)

Блог — Сергея Арсентьева 📈
image
Сергей Арсентьев
Всего материалов на сайте: 240
Активных комментариев: 3 503
Работает онлайн: 10.7 лет
Читателей за это время: 2 487 733
Я в соцсетях —
Фото
Бесплатный видеокурс для начинающих. Что такое фриланс, можно ли на нем зарабатывать и сколько?
Бесплатно Подробнее
Фото
Бесплатная мини книга для тех, кто хочет заказать сайт, но растерялся во множестве CMS и вариантов выбора.
Бесплатно Подробнее
Фото
Пошаговый видеокурс "Как работать в Опенкарт" с уроками по добавлению товаров и статей.
Комментариев 6
  • Роман
    Роман

    Этот плагин тоже не работает.

    Комментировать
  • Михаил
    Михаил

    Не работает ни один lightbox и fancybox. Точнее, на моем ПК не работает, если загружает другой человек на ту же страницу - все отлично :cry: :wall:

    Комментировать
    • Таисия
      Таисия

      У меня на одном сайте эти плагины работают, а на другом - нет. Не понимаю, почему... :facepalm:

      Комментировать
  • Юлия
    Юлия

    Не могли бы Вы ссылку дать на этот плагин, хотя бы адрес. WordPress.org плагин Lightbox Plus Colorbox не находит - нет его на официальном сайте сейчас. И Ваша статья без ссылки на плагин полностью теряет свою полезность.

    Комментировать
    • Сергей Арсентьев

      Выложил ссылку в статье, раньше он был в репозитории WordPress, так и не выкладывал ссылку на разработчика.

      Комментировать
  • Сосновоборск

    А можно не скриншот а полностью что добавлять нужно?
    А то скриншот обрезает сверху, не видно всю строку!

    Комментировать
Смотреть еще комментарии
Добавить свой комментарий