Пропустить

Как создать интерактивные изображения в WordPress

Divi: самая простая тема WordPress для использования

Divi: лучшая тема WordPress всех времен!

Более Загрузка 600.000, Divi - самая популярная тема WordPress в мире. Он является полным, простым в использовании и поставляется с более чем бесплатными шаблонами 62. [Рекомендуемые]

Хотите создать интерактивное изображение для своего блога на WordPress?

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

В этом уроке мы покажем вам, как создавать интерактивные изображения на WordPress.

Но раньше, если вы никогда не устанавливали WordPress, откройте для себя Как установить блог WordPress в шагах по 7 et Как искать, устанавливать и активировать тему WordPress в своем блоге

Тогда вернемся к тому, почему мы здесь.

Что такое интерактивное изображение?

Интерактивное изображение имеет области точек доступа, блики, ссылки, цвета и т. Д.

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

Это отличается от простого изображения, которое вы загружаете на WordPress. Интерактивные изображения привлекают внимание и привлекают внимание пользователей. Вы можете добавить описание различных частей изображения, добавить ссылки на страницы, выделить разделы и многое другое.

интерактивное изображение демо-дюны на WordPress.jpg

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

Открыть Как использовать FOMO в WordPress для улучшения конверсий

Давайте посмотрим, как вы можете привлечь внимание своих посетителей с помощью интерактивных изображений.

Как создать интерактивные изображения в WordPress

Первое, что нужно сделать, это установить и активировать плагин Обратить внимание, Для получения дополнительной информации см. Наше пошаговое руководство по как установить плагин WordPress.

После активации вы увидите новый тип персонализированного сообщения на панели инструментов WordPress. Вы должны пойти в Рисовать Внимание »Добавить новый для создания интерактивного изображения.

привлечь внимание WordPress.png

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

Идите дальше, обнаружив эти Премиальные плагины 9 для WordPress для оптимизации вашей медиатеки

Легко создать свой сайт с Elementor

Elementor позволяет легко создать любой дизайн сайта с профессиональным внешним видом. Перестань дорого платить за то, что можешь сделать сам. [Free]

снимите картинку, чтобы начать .png

Затем вам нужно нажать на кнопку публиковать .

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

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

создавать зоны на WordPress.gif

После рисования области «горячих точек» вам нужно прокрутить вниз раскрывающийся список Экшен и выберите действие для выбранной области на изображении. Если вы выбираете Посмотреть больше информацииВы можете просто добавить описание, чтобы объяснить область точки доступа на изображении. Вы также можете добавить ссылку на выбранную область, используя опцию " Перейти к URL».

учиться Как сделать резервную копию и восстановить ваш блог с Snapshot Pro

сохранить изображение hotspot.jpeg

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

общие настройки

Затем вам нужно нажать на кнопку Mettre à Jour и скопировать короткий код чтобы добавить его в свой пост или на страницу WordPress.

скопируйте shortcode.jpg

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

щелкните интерактивный image.jpeg

Импорт и экспорт интерактивных изображений

Если вы работаете на нескольких веб-сайтах и ​​хотите импортировать / экспортировать интерактивные изображения, плагин Draw Caution должен быть установлен на обоих веб-сайтах.

Вы ищете лучшие темы и плагины WordPress?

Загрузите лучшие плагины и темы WordPress от Envato и легко создайте свой веб-сайт. Уже более 49.720.000 XNUMX XNUMX загрузок. [ЭКСКЛЮЗИВ]

На первом сайте вы должны посетить Нарисуйте Внимание »Импорт / Экспорт и проверьте изображения, которые вы хотите экспортировать. Затем нажмите кнопку Сгенерировать код экспорта и скопируйте код.

экспортировать код hotspot.png

После этого вам нужно перейти на второй веб-сайт и убедиться, что вы активировали плагин Draw Caution. Тогда вы должны пойти в Нарисуйте Внимание »Импорт / Экспорт на панели управления и вставьте код в поле импорта.

импортировать код hotspot.jpg

Идем дальше и нажимаем на кнопку Импорт и ваши изображения будут импортированы.

Откройте для себя также несколько премиальных плагинов WordPress

Вы можете использовать другие плагины WordPress, чтобы придать современный вид и оптимизировать управление вашим блогом или веб-сайтом.

Мы предлагаем вам несколько премиальных плагинов WordPress, которые помогут вам сделать это.

1. Блокировщик контента Opt-In

Opt-In Content Locker - это плагин WordPress, который позволяет блокировать важный контент в вашем блоге и отображать его только для подписчиков.

Все, что вам нужно сделать, это заблокировать заблокированный контент с помощью коротких кодов [optinlocker] ... [/ optinlocker]. Если люди хотят отображать этот контент, они должны отправить свое имя / адрес электронной почты. После отправки все заблокированное содержимое станет видимым.

Его основными характеристиками являются: инструмент мнадежно и безопасно, Vблокирование важного контента,поддержка MailChimp, AWeber, GetResponse, iContact, Campaign Monitor, Mad Mimi, Benchmark, Sendy и MyMail, поддержка шорткоды, еxпортирование данных в формате CSV, возможность перевода на несколько языков, fпростота установки, электронная почтаПоддержка клиентов xcellent, eт другие.

Скачать | Демо | Дешёвый хостинг

2. Нажмите, чтобы Чат WhatsApp

Плагин WordPress Click to WhatsApp Chat позволяет клиентам WordPress легко связываться с владельцем веб-сайта или поддержкой клиентов, используя свою учетную запись WhatsApp.

Просто нажмите на учетную запись WhatsApp, и она будет направлена ​​непосредственно на мобильную учетную запись WhatsApp с сообщением по умолчанию. И если клиент находится на настольном компьютере или ноутбуке, он будет перенаправлен в WhatsApp Web.

Этот плагин требует номер и время и день WhatsApp, который владелец сайта или служба поддержки будет использовать для чата. Кнопка чата может быть добавлена ​​на страницу сведений о продукте WooCommerce, которая непосредственно связана с этим продуктом.

Скачать | Демо | Дешёвый хостинг

3. Был ли этот полезный

Was This Helpful - плагин WordPress, используемый для оценки комментариев ваших читателей. Следует отметить, что если положительный комментарий побуждает вас к лучшему, отрицательный комментарий, с другой стороны, помогает вам найти пробелы и улучшить ваш блог; делая его более полезным для других посетителей.

Этот плагин является уникальным, поскольку он просит посетителей ответить на вопрос, почему они не могут найти полезную публикацию, когда нажимают кнопку «НЕТ». Точно так же он спрашивает посетителей, что им нравится больше всего, когда они нажимают на вариант «ДА».

Легко создать свой интернет-магазин

Скачайте бесплатные WooCommerce, лучшие плагины для электронной коммерции, чтобы продавать физические и цифровые продукты на WordPress. [Рекомендуемые]

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

Скачать | Демо | Дешёвый хостинг

Рекомендуемые ресурсы

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

Заключение

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

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

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

...

Эта статья содержит комментарии 0

Оставить комментарий

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

Этот сайт использует Akismet для уменьшения спама. Узнайте больше о том, как используются ваши данные обратной связи.

Вверх
12 акции
доля10
чирикать1
Регистрация1