Привет! Бывает так: заходишь на блог, видишь скрин, а что в нём — вообще не видно. Вот и думаешь, что же автор этого поста хотел показать в нём? Но выход есть — скрипт увеличения картинки при нажатии!
Очень классная штука, этот скрипт. Сами смотрите, увеличивает по клику:
(Кликабельно)
На самом деле существует много различных эффектов увеличения картинки в статье блога, но этот эффект на мой взгляд наилучший.
Кому будет полезен данный скрипт увеличения картинок?
- В первую очередь тем, кто снимает скриншоты с пояснениями. Например, если вы решили снять объёмный скриншот для своей статьи, что — то там подрисовали, для того, чтобы материал был более понятен, закинули в статью, а он просто-напросто в полной мере на странице вашего блога не помещается, поэтому вордпресс его автоматически сжимает, да бы не выйти за границы страницы. А после сжатия видимость, читабельность сильно уменьшается. У меня так ни раз было, поэтому я и решил воспользоваться данным скриптом увеличения картинки без потери качества.
- Если вы попросту не хотите в статье размещать объёмные изображения. Бывает так, что нужно показать много изображений в одной статье, но не хочется, чтобы эти изображения занимали много места, тогда установка скрипта — оптимальный вариант! Да и вообще, если не хотите размещать объёмные изображения, тогда данный скрипт просто необходим.
Отлично. Теперь нам нужно установить скрипт на свой сайт. Установка проходит в 3 шага:
- Скачиваем скрипт и закидываем в корневую директорию своего сайта.
- Устанавливаем необходимый код на свой сайт.
- Закидываем рисунок в статью и настраиваем её отображение.
Итак, начнём.
Скачивайте скрипт по этой ссылке. Хорошо, далее нам необходимо установить всё содержимое архива в корневую директорию сайта. Это можно сделать со своего хостинга либо воспользовавшись FTP клиентом.
Вторым этапом у нас идёт установка кода скрипта. Куда устанавливать код? Можно устанавливать в header.php, footer.php, function.php, index.php, но я обычно устанавливаю в footer.php, перед тегом </body>, чтобы код последним подгружался.
Вот сам код:
А вот, что получилось у меня:
(Кликабельно)
А теперь самое интересное .
Чтобы скрипт увеличивал картинки без потери качества нужно:
1. После закачки изображения в статью необходимо открыть «Параметры изображения» и в пункте «Ссылка» выбрать «Медиафайл«.
(Кликабельно)
2. И далее в «Параметрах изображения» в пункте «Дополнительные настройки«—> «Отношение» прописываем simplebox и не забываем нажать на кнопку «Обновить» .
(Кликабельно)
Вот и всё. На всё про всё я потратил не более 5 минут! Если кому, что не понятно — пишите.
А может кто-нибудь знает способ проще? Тоже пишите! До скорого!
А вы уже подписались на обновления блога?
Рекомендую прочесть следующие полезные статьи:
1. Ошибка установки соединения с базой данных в WordPress
С уважением, Александр Сергиенко
Скрипт реально отличное решение данного вопроса
Интересный скрипт. А чем плох плагин? Или вы сейчас скажите, что плагин нагружает сервер? Если да, то этот скрипт и коды не загружают?
Плагин не плох, но хочется, чтобы нагрузка на блог была минимальная. Не хочется использовать всякие плагины и нагружать все ту же базу данных Mysql. Ведь код выполняет одну функцию, а в плагинах встроено множество вариантов. Да и при помощи скрипта можно увеличивать отдельные картинки, а не все сразу.
К сожалению, не удалось по указанной ссылке скачать скрипт. Выдаёт ошибку. У кого -то получилось?
Людмила, проверил — всё работает.
Здравствуйте, самое простое решение это вот этот плагин Auto Highslide. По крайней мере мне он очень нравится и менять его на скрипт лично я не хочу.
Тоже вариант
Спасибо, очень полезный урок. Действительно, просто и быстро.
У меня тоже есть данная функция. Тоже в виде кода реализована.) Очень удобно. Обычные картинки я ставлю по своему стандарту, в ширину 500 мпс. А остальное делаю на увеличение уже.
Только у меня дважды картинка открывается, когда жму на увеличение, странно малость.))
Да, я тоже пользуюсь такой методикой. Классно работает
Штука хорошая! Может и себе надумаю когда-то поставить…
А не проще установить готовый плагин?
Проще, но не лучше.
Скажите а если я захочу сменить тему блога, этот скрипт подгонит все мои картинки под шаблон?
Этот скрипт увеличивает картинки до максимально загруженного размера. Т.е. Вы загрузили картинку 700Х700, грубо говоря, а в админке уменьшили её до 200Х200, тогда при нажатии на неё выйдет картинка 700Х700. А при смене шаблона нужно будет заново только код устанавливать, так как файлы в теме заменятся на новые.
Не увеличивает он на 100%, почти на 30% меньше. Я понять не могу почему, может подскажите.
Надо воспользоваться вашим скриптом,а то плагин нагружает движок.
Хотя он меня устраивает,пользуюсь плагином Auto Highslide.
За статью отдельное спасибо.
Удачно выбран размер шрифта для Вашего сайта. Комфортно читать.
А в примерах увеличивающегося текста шрифт несколько меньше, хотя окно позволяет большее увеличение.
Хочу вовремя понять, чем хуже переход по ссылке, например, на Радикал фото.
Там же скриншот, поэтому и меньше. Изначальный размер такой как при увеличении.
а если нет дополнительных настроек в медиафайле?
Здравствуйте. Как добавить крестик, который справа вверху, закрывающий увеличенную картинку? С помощью скрипта изображение увеличивается на весь экран с черным фоном, но не закрывается так как у вас на сайте. Спасибо.