Самое прекрасное — это когда нужна поддержка сайта, а ты сидишь с телефоном
в руке и ЗНАЕШЬ, чей номер набрать! т. +7 831 4637611 моб. +7 910 3820622Айтишник РУ Нижний Новгород, Симферопольская, 21
A+ A A-

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

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

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

Конструктор Яндекс карт 

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

Код Яндекс карты 

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

Модуль и позиция 

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

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

Яндекс карты FlyLeaf 

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

Joomla. Загрузка модуля в произвольное место 

Для того чтобы разместить карту на стандартной странице контактов, нужно отредактировать файл /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» для редактирования.

Настройка BT Google Maps 

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

Настройка BT Google Maps 

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

Результат 

На этом всё. Надеюсь, информация окажется полезной читателям.

Не забывайте, что у нас вы можете не только купить готовый сайт, но и подобрать подходящий тариф поддержки сайта, а так же зарегистрировать домен в одной из двухсот доменных зон и выбрать недорогой тариф хостинга! У нас же вы можете заказать продвижение сайта в поисковых системах.Айтишник РУ

Об авторе:

ZolkinМеня зовут Андрей Золкин. Из более, чем пятнадцати лет работы в сфере информационных технологий, десять лет работаю с системами, базирующимися на открытом исходном коде. На страницах сайта Aitishnik.Ru веду блоги по CMC Joomla и Debian GNU/Linux.

 

Ещё статьи о Joomla 2.5

    • Настройка Apache, MySQL, PHP

      Настройка Apache, MySQL, PHPОткрываем в текстовом редакторе конфигурационный файл вэб-сервера Apache. Он называется httpd.conf и находится в корневой папке сервера, в поддиректории conf. В нашем примере C:\www\conf\httpd.conf. Найдём и раскомментируем (удалим...

    • Установка Joomla 2.5

      Установка Joomla 2.5Установка Joomla 2.5 довольно проста и не занимает много времени. В этой статье рассматривается установка CMS Joomla (Джумла) в общем виде на локальный компьютер. Установка и настройка вэб-сервера и дополнительных программ рассматриваются в предыдущей...

    • Резервное копирование сайта на Joomla 2.5...

      Резервное копирование сайта на Joomla 2.5...Одной из задач администрирования сайта является его постоянное резервное копирование. Конечно, многие хостеры ежедневно проводят резервное копирование клиентских сайтов, но как говорится «На Бога надейся, а сам не плошай». К тому же...

    • Установка счетчика на сайт с Joomla

      Установка счетчика на сайт с JoomlaВ этой статье мы рассмотрим установку счетчика на сайт под управлением Joomla! 1.5 Для примера установим популярный счётчик Liveinternet. Заходим на сайт http://www.liveinternet.ru/ и кликаем на ссылке «Получить счетчик».

    • aiContactSafe - формы обратной связи

      aiContactSafe - формы обратной связиОдной из распространенных задач для веб-мастера, является создание почтовых форм или форм обратной связи для оправки писем (сообщений) с сайта. В Joomla это можно реализовать несколькими способами, в том числе и стандартно, с помощью компонента «Контакты». Но в этой статье я расскажу о том,...

    • Joomla 2.5

      Joomla 2.5Здравствуйте, дорогие читатели и читательницы! Это первая статья посвящённая созданию сайтов на Joomla. И в ней я хочу рассказать о CMS Joomla!, о том для чего она нужна, о преимуществах Joomla 2.5 и об её отличиях от предыдущих версий. За читателем остаётся право согласиться с автором...