Как вставить карту Яндекс или Google (maps.yandex.ru maps.google.ru) в Joomla 1.5 в com_contact

Карты Яндекс (Yandex) или Гугл (Google) можно вставить в Joomla 1.5 несколькими способами:

  1. во фрейме в материал, скопировав ссылку с карты.
  2. при помощи дополнительных плагинов или модулей Joomla 1.5.

Однако оба эти способа не совсем удобны:

  • первый способ доступен только web-мастеру, т.к. при пересохранении материала пользователем со стандартным визуальным редактором все карты удаляться. Т.е. для пользователя придеться отключать визуальный редактор.
  • второй способ не всегда применим, если требуется разместить несколько карт.

Стандартный компонент Joomla 1.5 com_contact также не позволяет вывести карты Яндекс (Yandex) или Гугл (Google) на страницах контактов.

В этом посте мы расскажем как прикрутить карты Yandex или Google к компоненту com_contact Joomla 1.5 чтобы иметь возможность для каждого контакта показывать карту.

 

В нашем случае реализация будет следующей:

  • в расширенных настройках контакта компонента com_contact Joomla 1.5 мы создадим три дополнительных пункта настройки, которые будут отображаться справа в расширенных параметрах: ссылка на карту, ширина и высота фрейма.
  • в шаблоне контакта пропишем вывод фрейма под изображением контакта.

Вставляем карту Яндекс (Yandex) или Гугл (Google) в контакты компонента com_contact Joomla 1.5

Итак, приступим...

1. обязательно создайте бэкап сайта.

2. все изменения где-нибудь фиксируйте, т.к. при обновлении Joomla 1.5 изменения могут быть утрачены. Так вам будет удобнее восстановить изменения.

3. создаем три дополнительных пункта настройки контакта. Для этого редактируем файл /administrator/components/com_contact/contact_items.xml.

Между строками:

<param name="icon_misc" type="imagelist" directory="/images/M_images" hide_none="1" default="" label="Misc Icon" description="Icon for the Misc info" />
</params>

Вставляем строки:

<param name="map" type="textarea" default="" label="LINK TO MAP" rows="3" cols="30" description="LINK TO MAP DESC" />
<param name="frame_width" type="text" default="425" label="FRAME WIDTH" size="5" description="FRAME WIDTH DESC" />
<param name="frame_height" type="text" default="350" label="FRAME HEIGHT" size="5" description="FRAME HEIGHT DESC" />

4. В языковом файле /administrator/language/[язык]/[язык].com_contact.ini создаем шесть языковых переменных.

Добавляем строки в конец файла:

LINK TO MAP=Ссылка на карту
LINK TO MAP DESC=Скопируйте и вставьте в поле ссылку на карту из Яндекса или Гугла
FRAME WIDTH=Ширина
FRAME WIDTH DESC=Укажите ширину фрейма с картой
FRAME HEIGHT=Высота
FRAME HEIGHT DESC=Укажите высоту фрейма с картой

5. Копируем все содержимое из папки /components/com_contact/views/contact/tmpl в папку /templates/[шаблон]/html/com_contact/contact/

6. В нужное место файла шаблона контакта /templates/[шаблон]/html/com_contact/contact/default.php вставляем код вывода карты:

<?php if ($this->contact->params->get('map')) : ?>
<iframe width="<?php echo $this->contact->params->get('frame_width'); ?>" height="<?php echo $this->contact->params->get('frame_height'); ?>" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="<?php echo $this->contact->params->get('map'); ?>"></iframe>
<?php endif; ?>

7. Сохраняем все файлы на хосте.

8. Тестируем наши изменения. Для этого:

  1. Заходим в админку сайта с паролем администратора;
  2. Переходим в "Компоненты > Контакты > Контакты" и создаем новый контакт или редактируем существующий;
  3. В панели редактирования контакта переходим на закладку справа "Расширенные параметры" и заполняем поля "Ссылка на карту", "Ширина", "Высота";
  4. Сохраняем контакт и проверяем отображение карты.
Создание корпоративного портала/a>

30 комментариев

  1. Алексей
    2010/06/12 в 20:08

    Для вставки Google карты в материал можно использовать плагин вставки iframe в Joomla

    Ответить
  2. Иван
    2010/08/12 в 10:56

    На локалхосте это работать не будет? Что-то денвер ругается.. В качестве ссылки я взял javascript:GoogleMapsFind(48.206183,%2036.022671,%2016) (скопировал с другого сайта)

    Ответить
    1. admin
      2010/08/12 в 14:58

      В качестве ссылки с картой надо использовать например, http://maps.google.com/maps/ms?ie=UTF8&hl=ru&msa=0&msid=118172974075117081941.000488d1e61c0102ad053&ll=55.806479,37.587576&spn=0.002713,0.004828&z=17&output=embed

      Такую ссылку можно получить, нажав на кнопку "Ссылка" (справа вверху) при просмотре карт Гугла

      Ответить
      1. Иван
        2013/10/18 в 14:57

        В любом случае, спасибо за труд! Буду разбираться... :roll:

        Ответить
  3. Василий
    2010/10/06 в 17:17

    Что означает:
    1. обязательно создайте бэкап сайта.
    И Можно вообще более подробно? Я просто новичок в этом. Но уже неделю парюсь над тем как вставить карту в контакты. Мне проще подходит яндекс карта.

    Ответить
    1. Aeon
      2010/10/06 в 22:22

      собственно о понятии бэкапа можно прочитать тут http://ru.wikipedia.org/wiki/Backup

      соответственно для вставки яндекс.карты нужно обратить внимание на пункт 6

      есть также еще один нюанс с яндекс.картами - он заключается в том что для использования сгенерированной карты на сайте нужно использовать api-ключ

      Ответить
      1. Василий
        2010/10/07 в 22:10

        а как вставить ссылку яндекс? захожу но пишет Not Found

        The requested URL /http://maps.yandex.ru/-/CRFc4sD was not found on this server.

        Ответить
  4. Максим
    2010/10/08 в 15:08

    по-моему ошибочко закралось...
    в 6ом пункте во второй строке слэш после двойной кавычки не нужен
    не src="/

    Ответить
    1. Aeon
      2010/12/11 в 22:23

      да, действительно ошибка... поправил)

      Ответить
  5. Максим
    2010/10/08 в 15:10

    а src="

    Ответить
  6. Максим
    2010/10/08 в 15:11

    а то она пытаетсяя запустить скрипт из
    каталога www/http и падает с ашипкой CGI
    По крайней мере после этого у меня все зафурычило... Автору респект. Единственный способ встраивания без плагинов.

    Ответить
  7. Василий
    2010/10/10 в 23:58

    Спасибо автор и те кто помог) Все работает и все гуд))) :lol:

    Ответить
  8. Сергей
    2011/01/20 в 22:22

    Google без проблем ставит, а вот Яндекс даже при подключении API не появляется, не подскажите в чем может быть дело, может что то поменялось после написания статьи?

    Ответить
    1. Максим
      2011/01/21 в 09:34

      Пока нет вроде...

      Ответить
    2. Алексей Ваганов
      2011/01/21 в 10:38

      Сергей, т.к. в Яндексе карта создается Ява-скриптом, то для вставки карты яндекса есть 2 варианта:
      1. создать html-файл и вставить код Яндекса в него. Загрузить файл на сайт. Сссылку на него указать в настройке "Ссылка на карту"

      2.в 6-м пункте вы можете вместо iframe вставить код яндекс карты

      Ответить
      1. Сергей
        2011/01/21 в 18:15

        Я брал ссылку на карту отсюда http://screencast.com/t/rPWnbywZtu70
        (не короткую, а вторую после нее) подставляю в "Расширенные параметры" в компоненте самой Joomla, как описано в статье (естественно после всех настроек описанных выше) в результате: фрейм грузится, но отображается не сама карта, а часть той страницы на которой она находится со всеми дополнительными панелями Яндекса и его меню, сразу после этого почему то перекидывает редиректом на эту самую страницу с самой картой на maps.yandex.ru
        Ума не приложу, что не так.
        Пока пришлось напрямую вставлять в страницу самого компонента, но это не обеспечивает той гибкости которую подразумевает ваш вариант.

        Ответить
  9. Владимир
    2011/02/27 в 23:38

    Спасибо большое. После установки заработал сразу. Автору +++++!!!!

    Ответить
  10. stakan
    2011/03/10 в 11:29

    Спасибо большое!!!
    Перерыл весь интеренет, но заработало с твоими указаниями...
    Огромное спасибо!!!

    Ответить
  11. stakan
    2011/03/10 в 11:31

    тока я за место 6-го пункта вставил карту яндекса и все работает

    Ответить
  12. Perca
    2011/04/21 в 02:10

    Красота! Единственное - пришлось повозиться, в 6-м пункте убрать / после src=" Да, и пятый пункт вообще необязательный оказался.. :-*

    Ответить
    1. admin
      2011/05/22 в 23:29

      5 пункт не является обязательным, но лучше его выполнять. Он предназначен для вынесения шаблона за пределы компонента. Иначе при обновлении Joomla все ваши труды пойдут прахом и надо будет выполнять все шаги заново.

      Ответить
  13. Alexxxandr05
    2011/05/28 в 21:05

    Карта открывается на полный экран на яндекса а не на сайте.В чем дело?

    Ответить
    1. Beagler
      2011/06/07 в 13:11

      аналогично

      Ответить
  14. eric5
    2011/06/29 в 19:28

    Спасибо большое!!!
    А как то можно ее сместить так чтобы она отображалась с боку возле контактов а то она сверху а контакты с низу. Некрасиво как то.
    Спасибо

    Ответить
  15. Delik
    2011/06/30 в 04:29

    Сначала Огромное Спасибо автору за очень нужный материал!!!
    Теперь вопрос: можно ли таким образом проапгрейдить com_virtuemart? - суть такова: у меня март используется под каталог аренды для агентства недвижимости - тоесть под каждый товар надо вставить карту гугла где он там находится... :-* спасибо за ответ

    Ответить
  16. Delik
    2011/07/01 в 04:20

    так как, такую штуку в virtuemarte сделать?

    Ответить
  17. avp
    2011/10/31 в 22:40

    А как вставить только фрэйм с пробками (google или yandex не важно)?

    Ответить
  18. marugin
    2012/02/12 в 03:38

    Спасибо за статью, помогла. Только почему сбился шрифт в контактах?

    Ответить
  19. Евгений
    2012/08/06 в 07:41

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

    Ответить
  20. Nikolay
    2013/11/26 в 11:30

    Спасибо за статью! Способ компактен и эффективен!)

    Ответить

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Имя *