Вход • Регистрация

Как вставить код яндекс карт.

  •
  • 20 декабря 2010 г.
  • Составляю карту, получаю от яндекса код, иду на страничку, жмак HTML, далее вставляю полученный код.. и ничего кроме ссылочки "Создано с помощью инструментов Яндекс.Карт" не появляется. только у меня так?
  •
  • 20 декабря 2010 г.
  • Сервис Яндекс.Карты предоставляют HTML и JS код. Код можно добавить в исходный код страницы в визуальном редакторе или в шаблон страницы с картой (например, themes/site_yandex_map.php).

    Аналогичным образом добавляются любые другие части, не содержащие PHP-код: ролики с YouTube, видеоплееры и пр.
  •
  • 20 декабря 2010 г.
  • У Вас визуальный редактор в целях безопасности вырезал подключение сторонней библиотеки:
    Код
    <script src="http://api-maps.yandex.ru/1.1/index.xml?key=..." type="text/javascript"></script>

    Включите ее в шаблон страницы. Лучше создать отдельный шаблон для этой страницы, чтобы библиотека не грузилась на других.
  •
  • 20 декабря 2010 г.
  • Все получилось. В очередной раз спасибо, Марина.
    На всякий случай напишу более подробный алгоритм, мало ли кому пригодится.

    1. Создаем на яндекс картах желаемое. То есть то, что в итоге хотим видеть на сайте.
    2. Код, который выдал яндекс для удобства можно вставить в любой временный файл
    3. Идем в локальную папку сайта и находим там папку themes
    4. Берем файлик site.php (тот который отвечает за вывод шаблона Вашего сайта) и копируем его в эту же папку, получив что то вроде "копия_site.php"
    5. Переименовываем "копия_site.php" в "site_yandex_map.php", к примеру. Назвать на самом деле можно как угодно, важно чтобы первое слово в названии файла было site.
    6. Открываем файлик в notepad++ или другом доступном редакторе и между тегами head вставляем строчки из того кода что выдал яндекс:

      7. Код
      <script src="http://api-maps.yandex.ru/1.1/?key=ADg8D00BAAAAEK4kagIAcqPdfd1yC9pnApff8g4PqaFyw5AAAAAAAAAAAACPeKzS0lKl-lmk-Ho6JXVE6O7QWQ==&modules=pmap&wizard=constructor" type="text/javascript"></script>

    7. Берем любой FTP менеджер и заливаем на хостинг файлик "site_yandex_map.php" в папку themes
    8. Логинемся в системе управления своим сайтом и открываем страничку, на которую планируется установка карты.
    9. Нажимаем кнопку "дополнительно" и в пункте "дизайн страницы" выбираем наш файл "site_yandex_map.php".
    10. Нажимаем кнопку html в редакторе и туда вставляем полностью код, который предлагает яндекс и нажимаем обновить. Еще раз нажимаем html в редакторе и для собственного удовлетворения удаляем пустые строки в начале
      Код
      <script type="text/javascript"></script>
    11. сохраняем страничку и готово.
    •
    • 20 декабря 2010 г. , редакция: 15 октября 2012 г.
    • Немного подправлю пост с учетом актуальности последних версий
      Можно так, как пишет Петр. А можно шаги 3-7 пропустить, а вместо шага 9 в "Дополнительно" в поле javascript вписать то, что выдал Яндекс. Затем уже на шаге 10 в HTML источник вставляется оставшийся код, как описано.
  •
  • 08 февраля 2012 г. , редакция: 08 февраля 2012 г.
  • Я думаю ничего страшного не будет если разрешить тег <script> в админском тинимце, ну и в догонку и <style> =)
    в config.js, при инициализации добавляем
    Код
    valid_children : "+body[style],+body[script]"


    стили и jquery ui работают точно !
  •
  • 16 октября 2012 г. , редакция: 16 октября 2012 г.
  • Кстати, если необходимо вывести на яндекс карте адрес объекта (дом, квартира и т.п), можно сделать следующим способом:
    в файле show.view.id.php
    Код

    echo ' <script src="http://api-maps.yandex.ru/1.1/index.xml?key=ваш ключ"
    type="text/javascript"></script><div id="ya_map" style="width:490px;height:400px"></div>
    <script type="text/javascript">
    var map, geoResult, show;
    window.onload = function () {
    map = new YMaps.Map(document.getElementById("ya_map"));
    map.removeOverlay(geoResult);
    map.addControl(new YMaps.TypeControl());
    map.addControl(new YMaps.ToolBar());
    map.addControl(new YMaps.Zoom());
    map.addControl(new YMaps.ScaleLine());
    var geocoder = new YMaps.Geocoder("';
    echo $result['param'][0]['value'] . " " . $result['param'][1]['value'];
    echo '", {results: 1, boundedBy: map.getBounds()});

    YMaps.Events.observe(geocoder, geocoder.Events.Load, function () {
    if (this.length()) {
    geoResult = this.get(0);
    map.addOverlay(geoResult);
    map.setBounds(geoResult.getBounds());
    } else {
    alert("Извините, объект на карте не найден")
    }

    });
    }
    </script>';


    где:
    $result['param'][0]['value'] - характеристика, где указана Область (город)
    $result['param'][1]['value'] - характеристика выводящая адрес
    Предварительно, конечно в админке необходимо создать характеристики к категории выводимых объектов, номера оттуда-же.
    • 04 октября 2013 г.
    • Недавно поменялся Яндекс.API. Теперь простенького редактора, описанного Петром нету(по крайней мере пока). Я бы хотел рассказать подробнее как сделать свою карту со своим логотипом вместо стандартной точки и подключить её к diafan.
      Итак, начем:
      Для начала нам необходимо определить координаты точки.

      Для этого
      1. Идем на ресурс http://api.yandex.ru/maps/tools/getlonglat/
      2. Находим наш адрес на карте
      3. В поле центр карты появятся координаты(напр. 37.610805,55.854769)
      4. Меняем их местами, чтобы получилось 55.854769, 37.610805 (новые АПИ яндекс карт воспринимают координаты наоборот)
      Теперь у нас есть координаты.

      Далее пишем скрипт карты:
      Код

      <script type="text/javascript">
      var myMap;
      ymaps.ready(init);
      function init () {
      myMap = new ymaps.Map("your_div_id", //В этой строке your_div_id это ИД которым будет вызываться карта.
      {
      center: [55.854769, 37.610805], //Говорим, что центр карты будет по координатам 55.854769, 37.610805
      zoom: 10, // Маштаб карты, допустимо от 1 до 16
      behaviors: ['drag','scrollZoom'], // Добавляем возможно скролить карту колесиком мышки (scrollZoom) и перетаскивать левой кнопкой мыши (drag)
      type: "yandex#hybrid" // Тип покрытия карты: "Гибрид".(Возможные варианты: yandex#satellite (Спутник), yandex#map (Обычная), yandex#publicMap (Народная)
      });
      myMap.controls
      .add("zoomControl", {right: 5, top : 325}) // Кнопка изменения масштаба и ее положение. См css3 -> position: absolute

      .add(new ymaps.control.TypeSelector(["yandex#map", //Добавляем выпадающий список типов карты
      "yandex#satellite",
      "yandex#hybrid",
      "yandex#publicMap"])
      );

      myMap.geoObjects //Тут мы начинаем добавлять точки на карту(можно сколько душе угодно).
      .add(new ymaps.Placemark([55.854769, 37.610805], //Добавляем точку с координатами 55.854769, 37.610805
      {balloonContent: "Какое-то абстрактное место в Москве"}, //Это будет выводится при клике на точку(можно использовать html теги)
      {iconImageHref: 'http://site.ru/img/mapicons/mapicon.png', //Говорим, что точка должна выводится картинкой и подсказываем скрипту где эта картинка находится.
      iconImageSize: [45, 45], //Размеры иконки
      iconImageOffset: [-30, -30]})) // Смещение левого верхнего угла иконки относительно её "ножки" (точки привязки).

      .add(new ymaps.Placemark([55.777446, 37.770106], //Вторую точку добавляем по аналогии(если она конечно нужна)
      {balloonContent: "Вот те еще одно место в Москве"},
      {iconImageHref: 'http://site.ru/img/mapicons/mapicon.png',
      iconImageSize: [45, 45],
      iconImageOffset: [-30, -30]}))
      };
      </script>


      После этого идем в административную часть сайта, создаем страницу Контакты и наполняем её нужным контентом
      и затем нажимааем кнопку "HTML" в визуальном редакторе и пишем туда
      Код

      <div id="your_div_id" style="width: 600; height: 500px;">&nbps;</div>


      Затем идем в "Дополнительные параметры" и в поле JavaScript вставляем следующее:
      Код

      <script src="//api-maps.yandex.ru/2.0/?load=package.standard,package.traffic&lang=ru-RU" type="text/javascript"></script> //Подключаем яндекс АПИ 2.0


      и затем весь наш скрипт карты включая теги <script type="text/javascript">

      З.Ы. Не забывайте, что содержимое вышеупомянутого поля JavaScript не выводится если в шаблоне нету <insert name="show_js">
      •
      • 04 октября 2013 г.
      • Цитата
        Затем идем в "Дополнительные параметры" и в поле JavaScript вставляем следующее:

        Это для какой версии инструкция?
        •
        • 05 октября 2013 г.
        • Для любой пятерки. Сейчас покопаться в архивах не могу, но по-моему, отдельное поле для js мы ввели еще в 4.5
          •
          • 05 октября 2013 г.
          • Как раз работал в каталоге, и там и искал )) Нашёл в страницах
            Цитата
            А не проще через api.yandex.ru/maps/tools/constructor/ ?

            Иконку свою добавить нельзя, как и ещё одно место на карте.

      • 12 октября 2013 г.
      • У меня почему-то метки не отображаются, в чем проблема?
        •
        • 12 октября 2013 г.
        • и че-то не найду где там ключ прописывается, наверно в этом проблема
          •
          • 13 октября 2013 г.
          • Начиная с версии API 2.0 яндекс отменил ключи. Покажите Ваш код сообществу, тогда мы сможем посмотреть что не так.
          • 11 февраля 2014 г.
          • Скорее всего путь к файлу с иконкой не правильный.
            Всё работает отлично взял на заметку и освоил. Очень удобно кстати. Чего и всем советую.
            С конструктором быстрее создать, зато вставить как хочется, может стать камнем приткновения. Вообщем не советую пользоваться конструктором.

            P.S. Максу бы плюс в карму поставил как разработчику, но увы нет такой фишки пока.
            •
            • 03 июля 2014 г.
            • Спасибо, Денис! Приятно! :)

              Если у кого есть вопросы по сабжу, с удовольствием отвечу! )
              •
              • 03 июля 2014 г.
              • Я делал через отдельные точки, приписанные у объекта, только там момент, что в этом решении надо менять местами координаты полученные от яндекса.

                вот пример: http://www.regmlm.ru/buro_biosea/

                Код
                <script src="//api-maps.yandex.ru/2.0/?load=package.standard,package.traffic&amp;lang=ru-RU" type="text/javascript"></script>

                На примере 2х точек
                Код

                <script type="text/javascript">// <![CDATA[
                var myMap;
                ymaps.ready(init);

                function init () {
                // Создание экземпляра карты и его привязка к контейнеру с
                // заданным id (map)
                var myMap = new ymaps.Map("map", {
                // При инициализации карты, обязательно нужно указать
                // ее центр и коэффициент масштабирования
                center: [65.106416,92.541517], // Москва
                zoom: 3
                });

                //Добавляем элементы управления
                myMap.controls
                // Кнопка изменения масштаба
                .add("zoomControl")
                // Список типов карты
                .add("typeSelector")
                // Стандартный набор кнопок
                .add("mapTools")
                //Линейка масштаба
                .add(new ymaps.control.ScaleLine())
                //Обзорная карта, с заданным типом
                .add("searchControl", { left: 120, top: 5 })
                ;



                myMap.behaviors.enable("scrollZoom");

                myMap.geoObjects //Тут мы начинаем добавлять точки на карту(можно сколько душе угодно).



                .add(new ymaps.Placemark([46.698973,141.866854], //Добавляем точку с координатами 55.854769, 37.610805
                {balloonContent: '<a href=http://www.regmlm.ru/>Невельск, Сахалинская область</a><br>Адрес: ул. Железнодорожная<br>www.regmlm.ru'}, //Это будет выводится при клике на точку(можно использовать html теги)
                {iconImageHref: 'http://regmlm.ru/maps/yandex.png', //Говорим, что точка должна выводится картинкой и подсказываем скрипту где эта картинка находится.
                iconImageSize: [26, 26], //Размеры иконки
                iconImageOffset: [-13, -13]})) // Смещение левого верхнего угла иконки относительно её ножки (точки привязки).




                .add(new ymaps.Placemark([42.809527,132.873398], //Добавляем точку с координатами 55.854769, 37.610805
                {balloonContent: '<a href=http://www.regmlm.ru/>Находка, Приморский край</a><br>Адрес: ул. Ленинская, д.2а, кор. 2, оф. 202<br>www.regmlm.ru'}, //Это будет выводится при клике на точку(можно использовать html теги)
                {iconImageHref: 'http://regmlm.ru/maps/yandex.png', //Говорим, что точка должна выводится картинкой и подсказываем скрипту где эта картинка находится.
                iconImageSize: [26, 26], //Размеры иконки
                iconImageOffset: [-13, -13]})) // Смещение левого верхнего угла иконки относительно её ножки (точки привязки).



                };
                // ]]></script>

  • 09 марта 2015 г.
  • Всем доброго времени суток. Вопрос а как добавить яндекс карты в форум. Т.е как сделать так чтоб можно было добавлять всем скрипт яндекс карт в ответах и вопросах форума????
    Заранее всем спасибо!!!
    •
    • 09 марта 2015 г.
    • Геокарта есть. По аналогии с объявлениями. Подключили, потом выводите echo $this->diafan->_geomap->get($result["id"], 'модуль');
  •
  • 11 марта 2015 г. , редакция: 11 марта 2015 г.
  • попробуйте так:

    1. Идете на api.yandex https://tech.yandex.ru/maps/tools/constructor/, генерите карту, копируете код
    2. Создает блок на сайте, и ставите галочку, что это html-код. туда копируете код с Яндекса
    3. Вставляете блок, который у вас получился на страницу там где надо, к примеру, Контакты через кнопку в левом углу html у редактора

    Код
    <insert name="show_block" module="site" id="13">


    id свой конечно же
  •
  • 11 марта 2015 г.
  • А как добавить его как пункт вон среди смайликов чтоб можно было просто нажать кнопку и добавить скрипт в описание и фсе.
  • 11 марта 2015 г. , редакция: 11 марта 2015 г.
  • вот например вставил между этим тегом скрипт и все работает code сюда /code
  •
  • 18 марта 2015 г.
  • Создаете блок - вставляете скрипт яндекс карт от сюда https://tech.yandex.ru/maps/tools/constructor/
    там ставите галочку html-код

    на странице вставляете

    <insert name="show_block" module="site" id="12">

Новости

  • Вышла очередная сборка DIAFAN.CMS 7.2.2
  • 18 июня
  • В сборке большое обновление demo-шаблона, дополнительная защита от спама, улучшение YML-импорта и еще много важного и интересного.
  • Не пропустите сборку DIAFAN.CMS 7.1.4
  • 24 апреля
  • В новой сборке совершили революцию в структурировании кастомизированной информации в шаблонах, добавили авторегистрацию пользователей, усовершенствовали защиту от спама, актуализировали накопительную скидку, а также улучшили производительность и стабильность работы системы.
  • Сборка DIAFAN.CMS 7.1.3
  • 12 января
  • После выхода сборки 7.1 мы выпустили уже три патча, в каждом из которых улучшаем административную часть сайта. Сборка DIAFAN.CMS 7.1.3 уже доступна к установке. 
Все новости

Форум

Перейти на форум