Стандартно все картинки, которые Вы вставляете в Wordpress, открываются в пустом окне, то есть в окне без какой-либо навигации. И для того чтобы вернуться от картинки обратно к блогу, Вашему посетителю придется нажимать кнопку “Назад” у себя в браузере. А это не так удобно, как если бы пользователь мог просматривать картинки, не покидая интерфейс своего сайта. Такой просмотр может осуществлять плагин Lightbox2, но мне он показался каким-то слишком громоздким. Медленная загрузка картинок в этом плагине и его острые углы  настроили меня против него. А когда я начал искать ему альтернативу, то наткнулся на скрипт, который называется FancyZoom. Он, как мне кажется, очень органично будет вписываться в любой блог. Вы можете посмотреть, как он работает, нажав на картинку к этому посту.


Установка FancyZoom на Wordpress:

Чтобы установить этот скрипт на Ваш блог, выполните 5 действий.

  1. Скачайте и распакуйте архив со скриптом FancyZoom.
  2. В архиве находятся 2 папки. Папку “__MACOSX” сразу удаляйте, она нам не нужна. А содержимое второй папки, то есть “images-global” и “js-global” копируйте со всем содержимым в корень сайта. (Например: http://dragonblog.ru/js-global/ и http://dragonblog.ru/images-global/)
  3. Теперь в файле header.php Вашей темы (в новых версиях Wordpress его можно редактировать в администраторской панели “Дизайн” -> “Редактор”) перед закрывающим тегом </head> вставьте:
  4. <script src="/js-global/FancyZoom.js" type="text/javascript"></script>

    <script src="/js-global/FancyZoomHTML.js" type="text/javascript"></script>

  5. Не выходя из редактора в том же header.php тег <body> замените на <body [...] onload="setupZoom()">. После изменений не забудьте сохранить этот файл (в редакторе просто нажмите “Обновить файл” внизу страницы).
  6. Теперь скрипт работает. Для того чтобы Ваша картинка открывалась FancyZoom’ом вводите её таким образом:  <a href="image-max.jpg"><img src="image-min.jpg" /></a> , где “image-max.jpg”-это Ваша большая(оригинальная) картинка, а “image-min.jpg”-ее уменьшенная копия(image-max.jpg и image-min.jpg могут быть одной и той же картинкой). А если хотите сделать подпись к картинке, то в тег <a> добавьте значение title=” “.

Если Вы все сделали правильно, то и на Вашем блоге будут красиво просматриваться картинки с помощью FancyZoom. А если Вам что-то из установки не понятно или не получается – спрашивайте в комментариях. Хочется верить, что с помощью этого скрипта, хотя бы несколько блогов рунета станут более удобными для своих посетителей.

Постовой: Красивые темы для WordPress от блога Мир Вордпресс.

Похожие посты


Добавь статью в:
Подпишись на RSS | Читай в Твиттере

Получай обновления DragonBlog.ru: