Пропустить

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

перетащите картинку на start.png

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Включите блокировку контента плагины wordpress блокировать контент сайта

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

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

скачать | Демонстрация | веб-хостинг   

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

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

Нажмите, чтобы чат в WhatsApp для WordPress

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

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

скачать | Демонстрация | веб-хостинг

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

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

Был ли этот полезный плагин для wordpress

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

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

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

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

скачать | Демонстрация | веб-хостинг

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

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

Заключение

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

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

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

... 

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

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

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

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

Вверх