Главная / Главное / Работа с текстовым редактором / ЧаВо / Как вставить на сайт Яндекс-карту

Как вставить на сайт Яндекс-карту

Видео инструкция

Шаг 1

Авторизовавшись в Яндексе, пройдите по ссылке tech.yandex.ru/maps/tools/constructor.

Далее необходимо нажать на кнопку "Создать карту".

phpYcZuvG

Шаг 2

Введите в строку "Адрес или объект" - адрес месторасположения.

Затем нажмите на кнопку "Найти".

phpmWHuQA

Шаг 3

Из предложенного списка результатов поиска выберите нужный Вам адрес.

phpzryoCH

Шаг 4

На карте отобразится всплывающее окно, в котором можно:

  • Задать подпись для метки на карте;
  • Указать описание для точки на карте (по умолчанию - адрес);
  • Подобрать цвет метки;
  • Выбрать тип метки;

После указания всех настроек для метки нажмите "Готово".

php1Hl1Oc

Обратите внимание!

  • Вы также можете перенести метку вручную в нужное Вам место карты (например, если Вы хотите сделать акцент на каком-либо конкретном корпусе здания или явно указать, где находится вход). Для этого просто закройте окно настроек описания, цвета и пр. и перетащите метку на карте, кликнув на нее и зажав с помощью левой кнопки мыши. Вернуться после этого к настройкам описания, цвета и пр. Вы можете, нажав на метку на карте.

Шаг 5

Если Вам необходимо оставить еще одну точку на карте, нажмите на кнопку "Метки".

phpZ0eDiG

И кликните в том месте карты, где Вам необходима дополнительная метка - отобразится еще одно окно с настройками метки.

phpvogQHk

Шаг 6

Затем в левой части экрана укажите название и описание карты (если это необходимо).

После чего - нажмите "Сохранить и продолжить".

php4aidx5

Шаг 7

Теперь на карте Вы можете:

  • Изменить размер карты, зажав и перетащив один из квадратных маркеров в углах и на сторонах карты;
  • Изменить масштаб карты с помощью бегунка;
  • Переместить область карты.

phprzxv8W

Также в меню слева Вы можете:

  • Выбрать тип карты: интерактивная, статическая или печатная;
  • Задать размер карты в пикселах.
  • Растянуть карту на 100%.

phppIGLuu

Шаг 8

После произведения всех настроек нажмите "Получить код карты" и скопируйте код - его будет необходимо вставить на стороне системы управления.

phpD7KMi7

Шаг 9

Зайдите в редактор страницы и нажмите на кнопку "Редактировать HTML-код".

phpNDgfQD

Разместите код карты ниже всего кода страницы и нажмите "Обновить" и "Сохранить изменения".

phpderhxf

Обратите внимание!

  • Для корректного отображения карты Вам может потребоваться указать в настройках ключ API. О том, что это такое, как его получить и где указывать - читайте в инструкции по ссылке.
Была ли статья вам полезна?
Укажите, пожалуйста, почему?
Комментарий