Яндекс карта и карта Гугл в Joomla 2.5

В разделе «Контакты» многих сайтов присутствует карта или схема проезда до нужного объекта. Зачастую, карты присутствуют не только в контактах и не только в единичном количестве. Раньше роль карт играли статические изображения этих самых карт, но со временем появилась возможность вставки на сайт интерактивных карт, которые предоставляют интернет сервисы такие, например как, Яндекс или Гугл. В этой статье мы и поговорим о том, как на сайт под управлением CMS Joomla вставить Яндекс карту или карту Гугл. Если кто-то из посетителей сайта попал на эту статью случайно и ему нужна информация о создании карты сайта, то ему следует перейти к статье «Карта сайта в Joomla».

А мы начнем с Яндекса. Яндекс карту на сайт Joomla можно вставить несколькими способами. Я опишу два: сгенерировать ссылку в разделе «Яндекс.Карты» и разместить её на сайте или воспользоваться специальным модулем для Joomla.
Первый способ. Переходим по ссылке в конструктор Яндекс карт, где нам предлагают создать новую карту. Советую сразу же авторизоваться. Это даст возможность сохранить, а впоследствии редактировать карту (ы). Если нужно отметить на Яндекс карте какую-нибудь точку, то в строке поиска вводим адрес объекта, нажимаем «Найти» и из предложенных вариантов выбираем нужный.

 

С помощью инструментов устанавливаем ещё точки, линиями прокладываем пути проезда и т. д. Когда всё готово, вводим название карты, иначе она сохранится без названия. Нажимаем кнопку «Сохранить и получить код».

 

Можно получить код, как для статической, так и для интерактивной карты. Полученную строку можно вставлять на сайт. Как это сделать? Сначала в админке идём Сайт –> Мой профиль и в поле «Редактор» меняем свой редактор по умолчанию на CodeMirror. После этого идём в «Менеджер плагинов» и проверяем включен ли плагин «Контент - Загрузка модулей». Затем переходим в «Менеджер модулей» и создаём модуль «HTML-код». Назовём его «yandex_map», в поле «Позиция» впишем first_map – это название нашей позиции (можно латиницей написать любое другое), а в поле «Пользовательский текст» вставим полученную в конструкторе карт строку кода.

 

Сохраняем модуль. Теперь в нужном месте статьи вставляем следующий код: { loadposition first_map }

Где first_map это название позиции.
Как вставить Яндекс карту в стандартную страницу контактов Joomla описано ниже, во втором способе, которым мы и займёмся.
Второй способ. Переходим в API Яндекса и скачиваем модуль для Joomla. Устанавливаем его и переходим в «Менеджер модулей». В списке находим модуль «Конструктор Яндекс карты FlyLeaf» и открываем его для редактирования. В левой части модуля видим карту со строкой поиска. Так же как в первом способе можем найти требуемый объект поиском.

 

Обозначить нужный объект так же можно вручную, перетащив метку или задав координаты объекта в соответствующем поле. Затем нужно установить подходящий масштаб карты, её ширину и высоту, а так же тип (схема, спутник, гибрид, народная, народная+спутник) и т.д. Подробная информация по настройке модуля Яндекс карт указана на сайте разработчика. Сохраняем изменения, выбираем позицию шаблона и публикуем модуль. Если карту нужно разместить в произвольном месте какой-нибудь статьи, то можно поступить так же, как описано в первом способе. Но для разнообразия сделаем по-другому. Просто в нужном месте статьи вставляем следующий код: { loadmodule mod_flyleaf_ymap }

 

Для того чтобы разместить карту на стандартной странице контактов, нужно отредактировать файл /components/com_contact/views/contact/tmpl/default.php. В нужное место подставляем строку:

<?php echo JHTML::_('content.prepare', '{ loadmodule mod_flyleaf_ymap }'); ?>

Это пока всё, что касается Яндекс карт на сайте Joomla. Рассмотрим теперь карты Гугл.
Существуют разные способы вставки карт Гугл на сайт под управлением CMS Joomla. Поступим так же как в ситуации с Яндекс картами – рассмотрим два варианта.
Первый способ. Практически аналогичен первому способу Яндекс карт. Переходим по ссылке на страницу карт Гугл. Если не авторизованы, то авторизуемся. В строке поиска вводим адрес объекта и запускаем поиск. Если результатов несколько, то выбираем наиболее подходящий.

 

Кликаем на ссылке «Мои места», а затем на кнопке «Создать карту». Вводим название карты, её описание и нажимаем «Готово». Теперь нужно получить код.

 

Кликаем по кнопке «Ссылка» и в появившемся окне выбираем пункт «Настройка и предварительный просмотр встроенной карты». Если нужно, то в открывшемся окне устанавливаем размеры карты, настраиваем масштаб и выбираем тип карты. Копируем код из поля «HTML-код для добавления на веб-сайт» и вставляем его на сайт. Делается это точно так же как в аналогичном способе Яндекс карт.

Второй способ. Во втором способе установки карт Гугл на Joomla сайт будем использовать модуль BT Google Maps. Скачиваем его с сайта разработчика (требуется регистрация) или с Айтишник Ру. На момент написания статьи была доступна версия модуля 2.0.4. Делаем стандартную установку модуля через «Менеджер расширений», переходим в «Менеджер модулей» и открываем модуль «BT Google Maps» для редактирования.

 

В основных параметрах, если нужно, меняем тип карты (Map Type), тип ввода адреса (адресной строкой или координатами). В адресной строке (Map Address) вводим адрес, можно по-русски. Если требуется, то меняем значения ширины (Width) и высоты (Height) карты, настраиваем масштаб (Zoom). Переключателями включаем или отключаем отображение элементов управления карты Гугл.

 

Откроем раздел «Управление маркерами» и добавим маркер (ы). Заполним нужные поля и сохраним маркер (ы). Сохраняем изменения, публикуем модуль и размещаем его на сайте. Размещать модули мы уже умеем!