Создавайте собственный интерактивный план помещений с расширением HTMLMaps

Этот бесплатный компонент, разработанный специально для Joomla 3.x, предоставляет возможность создавать собственный план или карту объекта любой сложности.

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

Особенности настроек расширения

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

Важно! Основное изображение загружается в папку /images/htmlmaps/. Кроме этого папка для создания выделенных картинок создается в том же каталоге. Это может быть, к примеру, /images/htmlmaps/plan/. Если хотите, можно также указать соответственный CSS стиль, который поможет с подсказками.

Когда основная картинка готова, необходимо добавить нужные интерактивные элементы. Когда вы наведете на любую из них курсор, будут отображаться подсказки, а если кликнуть – должны открываться страницы. Чтобы это сделать, нужно:

  • выбрать карту из имеющегося списка
  • нажать на специальную иконку ссылок вместе с ее элементами
  • создать свою ссылку, с помощью которой интерактивность добавится уже в ваше помещение

В процессе настроек, в первую очередь, нужно как-то назвать ссылку, и выбрать, нужно ли указывать URL. Далее с помощью редактора вы самостоятельно пишите текст подсказки, и при желании также вставляете изображение.

А Вы Знаете? Создавать и вставлять разные картинки с цветовым оформлением совершенно не обязательно. Для этого достаточно взять всего лишь одну картинку, и просто выделить подсказку в отдельных элементах.

Особенности работы с формой и координатами

Когда все сделано, нужно задать расширению фигуру рабочего объекта: прямоугольную или многоугольную, а также указать конкретные координаты в пикселях, которые определяться, в зависимости от изображения. Чтобы получить их, можно воспользоваться одним из обычных графических редакторов, к примеру, Фотошопом, в опциях которого есть возможность включить соответственную функцию.

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

Главные преимущества расширения HTMLMaps

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

Данный компонент поможет:

  • создавать интерактивные карты объектов любой сложности
  • видоизменять стили подсказок для каждого объекта, используя настройки
  • в каждую подсказку добавлять собственные картинки и заголовки
  • присваивать карту рабочего помещения к нужному меню
  • вставлять результат, в какой угодно текст, имеющийся на сайте

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

Если затрудняетесь с выбором хостинга, берите этот (для российских сайтов) или этот (для украинских сайтов).

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


Защитный код
Обновить

Наверх
Шаблоны, модули и плагины для Joomla 3.7.3
Scroll to top