Image Zoom — плагин WordPress для плавного увеличения изображений в модальном окне

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

Данную проблему решает технология highslide двумя способами: сжатием изображения до нужных размеров посредством CSS или созданием уменьшенной копии в пропорциях.

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

Пример работы плагина Image Zoom

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

Уменьшенная копия изображения по размерам сетки

Скриншот админ панели WordPress комфортно вписался в габариты страницы за счет внутреннего функционала движка. Он позволяет настроить создание уменьшенных копий оригинальных изображений и экономить на скорости загрузки страницы.

Пример плавного увеличения изображения в модальном окне. Затемнение фона и прочие нюансы можно настроить в плагине.

Плавное увеличение изображения в модальном окне — загружается оригинал

Установка и настройка Image Zoom

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

SL Image Zoom

Использование Image Zoom

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

Похожие записи

Особенности и возможности современных шаблонов для CMS WordPress
CMS WordPress — это мощная система с безграничными возможностями кастомизации шаблона и настройки функционала. На этом движке можно создать проект...
WordPress: плавное увеличение изображений на Higslide
Плагин для плавного увеличения изображений для CMS WordPress. Что делает плагин: при клике на изображение оно плавно увеличивается в модальном...
JS — скрыть внешние ссылки на сайте
Очень простой скрипт для скрытия внешних ссылок на любом сайте. Разрабатывался для CMS WordPress, но будет работать абсолютно везде. Полностью...
Как в CMS WordPress использовать символ «$» вместо «jQuery» подключаемых в скриптах
Разработчики WordPress умышленно заблокировали стандартный символ «$» в виде доллара для языка jQuery. Вы не сможете использовать данный символ без...
Как настроить WEBP изображения для WordPress
Из коробки WordPress не умеет работать с WebP картинками. На данном этапе механизм включения  WebP реализуется только с помощью сторонних...

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