Zoom изображения WordPress при наведении мышки

Изображения WordPress в данный момент не достаточно хорошо отработаны. Конечно же, в CMS есть все необходимые инструменты для того, чтобы поработать с картинками, загрузить их, назначить нужные атрибуты. Однако чего-то большего там нет.

Для того чтобы изображения WordPress имели какие-то особые интересные дизайнерские эффекты, придётся использовать дополнительные плагины. В этой статье мы расскажем о дополнении, которое позволяет сделать zoom картинки при наведении мышки.

Zoom картинки с плагином WP Image Zoom

Плагин WP Image Zoom позволяет создать zoom изображения при наведении мышки на неё. То есть, если навести курсор мышки на картинку, то можно будет увидеть какую-то увеличенную её область. Такой эффект вы часто могли видеть в интернет-магазинах. И этот плагин отлично подойдёт для интернет-магазинов на WordPress.

Такой подход к публикации картинок будет удобен, когда требуется сохранить пространство на странице, и не растягивать картинку на весь экран, и при этом позволить посетителю рассмотреть все мелкие детали фото.

Для того чтобы начать работать с плагином, скачайте WP Image Zoom, установите его на своём сайте и активируйте. После этого в консоли появится новый пункт «WP Image Zoom». Перейдите в него, чтобы настроить плагин.

Во вкладке «General settings» есть основные опции плагина:

  • Enable the zoom on WooCommerce products. Включает эффект zoom изображения WordPress для товаров магазина WooCommerce.
  • Enable the zoom on WooCommerce category pages. То же самое только для изображений категорий WooCommerce.
  • Enable the zoom on mobile devices. Включает zoom для мобильных устройств.
  • Compatible with LazyLoad (unveil.js). Включает скрипт для совместимости. Рекомендуется включить, если что-то отображается не так, как надо.

Во вкладке «Zoom settings» собраны настройки внешнего вида эффекта изображения WordPress.

  • Choose the Lens Shape. Здесь нужно выбрать эффект. Есть четыре вида эффекта. Внизу есть предпросмотр с картинкой, и при выборе того или иного эффекта можно сразу навести мышку и посмотреть, как это выглядит.
  • Make more fine-grained configurations on the zoom. Тут можно выбрать внешний вид курсора мышки и установить уровень анимации.

Когда вы создали все настройки, можно применить эффект к изображению WordPress. Для этого загрузите в редакторе страниц или записей картинку обычным способом, выделите её мышкой и нажмите на панели инструментов на кнопку «Image zoom».

Возможно, вам также будет интересен этот плагин, который создаёт другой эффект изображения WordPress при наведении мышки.

  1. Незаменимый плагин для тех, кто создает свой интернет-магазин!

  2. Как интересно узнать от чего подобные эффекты встречались раньше при присмотре разных изображений.
    Надеюсь.что мне тоже удастся установить этот плагин через некоторое время.

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

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