Всплывающие изображения с затемненным фоном
Плагин для красивой демонстрации изображения. В отличие от "легкого" WP-lightpop, FancyBox for WordPress обладает большими возможностями по настройке.
Если честно - то мне понравился этот плагин. В итоге установил его на один из проектов.
Вкратце, возможности FancyBox for WordPress:
- полностью меняем дизайн;
- выбираем анимацию (скорость, откуда будет вылетать и куда возвращаться);
- выбираем размеры, с каким будет появляться;
- есть возможность следования за прокруткой;
- подключение галереи;
- и прочее.
Посмотреть, как работает плагин на стандартных настройках можете Здесь.
Качаем плагин с официального репозитория по ссылке в конце статьи и устанавливаем. К слову: лучшие плагины WordPress располагаются именно там. Кто не знает как установить, читаем Инструкция по установке плагина WordPress. Все что останется сделать, это активировать FancyBox.
[infob name="Внимание!"]
Главное, чтобы ваша картинка была обернута ссылкой на саму себя!!! Т.е. она стояла в теге:
<а href="путь до картинки">картинка</a>
Если что-то не работает - читайте комментарии, т.к. там можно найти много полезных советов
[/infob]
Если же вы хотите настроить плагин под дизайн своего сайта, то у вас все карты на руках. Идем Настройки (Параметры) - Fancybox for WP. Далее предлагаю Вам вольный перевод от меня:
1. Закладка Appearance Settings (basic)
- Show Border (default: off) - показывать рамку, либо нет (по умолчанию отключена);
- HTML color of the border (default: #BBBBBB) - цвет рамки (по умолчанию #BBBBBB);
- Show Close button (default: on) - показывать, или нет, кнопку Закрыть (по умолчанию включена);
- Close button position - выбираем с какой стороны будет расположена кнопка Закрыть;
- HTML color of the padding (default: #FFFFFF) - выбираем цвет для внутреннего отступа картинки (по умолчанию белый). Простыми словами - цвет рамки от внешнего контура до картинки;
- Padding size in pixels (default: 10) - устанавливаем размер отступа от внешней рамки до картинки;
- Overlay Options - настройки наложения, заднего затемненного фона (здесь все, как в предыдущих пунктах);
- Show Title - показывать или нет название картинки ( по умолчанию включено).
2. Закладка Animation Settings (basic)
- Zoom Options - настройки приближения;
- Change content transparency during zoom animations (default: on) - Изменение прозрачности анимации во время приближения;
- далее 3 пункта по настройке времени появления и исчезания при приближении, а так же время при навигации по галерее (время перехода между картинками);
- Easing - здесь мы выбираем из представленных 30 шаблонов анимации для появления и исчезания картинки.
3. Закладка Behavior Settings (medium)
- Auto Resize to Fit - автоматически сделает изображение нужного размера, чтобы влазило в окно монитора (по умолчанию включено);
- Center on Scroll - удерживать изображение в центре монитора при прокрутке или нет (по умолчанию включено);
- Close on Content Click - закрыть изображение, при щелчке мышью на картинке (по умолчанию выключено);
- Close on Overlay Click - закрывать картинку, при нажатии мышкой по затемненному фону или нет (по умолчанию включено);
- Close with "Esc" - закрывать картинку по нажатию ESC или нет (по умолчанию включено).
4. Закладка Gallery Type
- Make a gallery for all images on the page (default) - делаем галерею для всех изображений поста (по умолчанию);
- Do not group images in gallery automatically (use this if you want to make galleries manually with the REL attribute) - Не группировать изображения в галерее автоматически (делается вручную, с применением атрибута REL);
- Make a gallery for each post (will only work if your theme uses class="post" on each post, which is common in WordPress) - сделать галерею для каждой статьи (будет работать только если ваша тема использует class= "post" в каждой статье, который является общим в WordPress);
- Use a custom expression to apply FancyBox - использовать пользовательские настройки для галереи FancyBox.
Далее закладки, отвечающие за связь с программистом и удалением плагина. Так же здесь мы найдем настройки для профильных сайтов, к примеру всевозможных фотостудий или фотохостингов. Для 99,9% сайтов данные настройки не понадобятся и будут установлены по умолчанию.
Если все перечисленное Вам понравилось, то качаем и устанавливаем.
[downpg wp="2.8 или выше" vp="2.9" href="http://wordpress.org/extend/plugins/fancybox-for-wordpress/"]Скачать плагин FancyBox for WordPress[/downpg]
Всем позитивного настроения и не бояться трудностей. Муза статьи.