Добавляем Yandex map в Joomla

На многих сайтах в разделе «Контакты» можно встретить карту или маршрут проезда до нужного посетителю объекта; карты могут присутствовать не только в «Контактах», но и в других разделах сайта, причем в большом количестве. Раньше, как правило, использовались статические изображения этих карт, но с недавнего времени появилась возможность вставлять и динамические карты при помощи сервисов, к примеру, Yandex или Google.

Собственно в данном материале мы и поговорим, как можно вставить Yandex или Google map себе на сайт.

Заметим, что не стоит путать Yandex и Google map с картой сайта, это принципиально разные вещи.

Вставляем Yandex map в Joomla сайт

Начнем, наверное, с Яндекса. Yandex map можно вставить на сайт несколькими способами: сгенерить URL в разделе Яндекс. Карты и затем поставить на сайт, или же задействовать модуль для Joomla. Рассмотрим первый вариант, ведь не все хотят нагружать свою площадку еще одним инструментом.

Переходим по линку, благодаря которому вы сможете создать новую карту: http://api.yandex.ru/maps/tools/constructor/. Если имеете аккаунт от Yandex, то рекомендуем сразу же авторизоваться, ведь в обратном случае вы не сможете сохранить эту карту и внести изменения при возникновении необходимости. Чтобы отметить на Yandex map нужную вам точку/объект, то в поисковой строке вводим его адрес и нажимаем «Найти». Из показанных вариантов выбираем наиболее оптимальный вам. Дополнительно при помощи использования инструментов можно проложить пути проезда и т.д. Когда все будет готово, то введите название карты или же она сохранится «безымянной», а делается это при помощи кнопки «Сохранить и получить код».

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

Все сохраняем, и после переходим к вставке кода:

{ loadposition first_map }

Теперь перейдем ко второму способу, благодаря которому можно будет вставить в штатную страницу контактов Yandex map. Итак, переходим в API Yandex и получаем там модуль для Joomla http://api.yandex.ru/maps/tools/cms/. Ставим его и переходим в «Менеджер модулей», а после находим модуль «Конструктор Yandex с FlyLeaf» и открываем его для изменения. Тут в левой части модуля вы увидите карту с полем поиска, и тут так же необходимо найти нужный вам объект/место при помощи поиска.

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

Если все «Ок», то сохраняемся, выбираем вариант шаблона и выводим модуль. Если карту необходимо разместить в определённом месте статьи, то поступить можно точно так, как и было описано в первом способе. Но дабы не парить себе голову, можно просто вставить следующий код: { loadmodule mod_flyleaf_ymap }. Чтобы разместить на странице контактов вашу карту, необходимо внести изменения в файл contact/tmpl/default.php, где в нужном месте необходимо подставить значение:

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

Теперь вы знаете, как вставить Яндекс Карты для Joomla на сайт, поэтому перейдем к рассмотрению карт от Google.

Вставляем Google map на Joomla сайт

С Google map ситуация обстоит практически аналогичным образом, и при этом также есть два способа вставки карт на сайт. Итак, рассмотрим первый способ.

Переходим на страницу карт Google по URL: http://maps.google.ru/. Если вы не вошли в систему, то это необходимо будет сделать. В строке поиска введите адрес искомого объекта, а если результатов будет несколько, то выбирайте один наиболее подходящий из предложенных вариантов.

Тут нажимаем по ссылке «Мои места», а после – «Создать карту». Вводим название вашей карты и нажимаем «Готово». Остается только получить код; это можно сделать, кликнув по линку «Ссылка» и выбрать пункт «Предварительный просмотр». Если необходимо, то в всплывшем окне выбираем тип и масштаб карты. Копируем поле «HTML-код» и добавляем его на сайт. Делается это аналогично Yandex map.

Второй способ подразумевает использование модуля BT Google Maps. Скачать его можно с сайта разработчика (необходима регистрация), но лучше всего возьмите его по URL. Установка проходит стандартно, через «Менеджер расширений»; после установки переходим в «Менеджер модулей» и открываем «BT Google Maps» для его редактирования.

Тут в главных параметрах можно изменить тип карты, тип ввода адреса (координаты или строка); в адресной строке вводим адрес, причем можно писать и на русском языке. Если необходимо, то можно изменять значения ширины и высоты карты, а также масштабировать ее. При помощи переключателя можно включать/отключать отображение управлением карт Google. Тут стоит открыть «Управление маркерами» и добавить маркер или несколько. Далее заполняйте нужные поля и сохраняйте все. Ну а далее остается опубликовать модуль и вывести его на сайт.

Конструктор Yandex map в виде модуля Mod Xdsoft Ymaps

Собственно этот плагин избавляет от необходимости копирования и вставки кода. То есть при его помощи создать Yandex map становится еще проще. Достоинства продукта:

• возможность установки размеров карты, ее центра, масштаба и т.д.;
• добавление элементов для управления картой;
• добавление неограниченного количества объектов;
• vvvvобъекты могут быть показаны в виде полигона, круга, метки или ломаной;
• каждой карте отдается свой id, поэтому на одной странице можно разместить несколько карт;
• конструктор поддерживает русский и английский язык;
• есть возможность указания точного местоположения пользователя;
• можно отображать уровень пробок на трассах.

Установка ничем не отличается от установки прочих модулей; если она была произведена успешно, то в списке модулей появится «Конструктор Yandex map от XDSoft» (выбрать его можно в «Выборе типа модуля»). Собственно получить на сайт модуль можно по URL.