Автор: Taggify
Перевод: Всеволод Козлов

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

Итак, разберем применение данного виджета на примере двух небезызвестных личностей: Билла Гейтса и Стива Джобса. Добавим к изображению каждого из них сводную информацию о каждой персоне.

Сперва я покажу Вам результат:

Виджеты добавить на сайт

Вот наше исходное изображение:

Как добавить всплывающую подсказку к изображению?

Шаг 1: Установка Виджета Taggify на Ваш Сайт

Перво-наперво Вам нужно установить виджет Taggify на Ваш сайт. Зарегистрируйтесь, настройте виджет и скопируйте / вставьте полученный код перед тегом </BODY>.

Шаг 2: Добавьте Редактор Taggify в Закладки или Избранное

Теперь Вы можете добавить редактор Taggify в закладки для быстрого доступа к нему. Для этого правой кнопкой мыши нажмите на эту ссылку и выберете «Добавить в закладки (избранное)».

Как добавить всплывающую подсказку к изображению?

Шаг 3: Авторизуйтесь в Редакторе Taggify

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

Всплывающая подсказка на виджет

Шаг 4: Отметьте Нужные Объекты на Изображении

Теперь отмечаем на изображении нужные объекты с помощью растягивающихся прямоугольничков. Для этого кликните на изображении левой кнопкой мыши в верхнем левом углу начала выделения. После этого Вы можете изменять размер прямоугольника.

Всплывающая подсказка на виджет

Всплывающая подсказка на виджет

Шаг 5: Добавьте Текстовые Метки к Объекту

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

Виджеты добавить на сайт

Как только все будет заполнено просто нажмите Save!

Оригинал статьи: How to add advanced tooltips for people on your photo



Смотрите также:

Понравилась статья? Поделитесь ей в социальных сетях: