Стань специалистом и зарабатывай в Интернет

Только реальные способы заработка в сети.
От копирайтинга до SEO-оптимизации.
Проверено 100% на личном опыте!

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

Всплывающие картинки на Wordpress

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

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

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

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

Преимущества 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

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

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

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

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

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

Было интересно - жми на звезды:



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

  2. Юлия

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

  • :smile:
  • :giggle:
  • :cool:
  • :yes:
  • :no:
  • :facepalm:
  • :nerd:
  • :clap:
  • :devil:
  • :wait:
  • :whew:
  • :cry:
  • :wall:
  • :bow:
  • :cash:
more »

Подписка на бесплатные уроки
Подписаться!