Добавляем карту Яндекса на сайт.

Недавно столкнулся с необходимостью разместить карту Яндекса на странице сайта. Собственно этим и хочу с Вами поделиться. В данной статье опишу как получить код карты Яндекса и каким образом её разместить на страницу.

Добавляем карту Яндекса на сайт.

Для того чтобы добавить карту Яндекса на сайт нам необходим её код. Для того что бы получить код нам необходимо перейти по этой ссылке: Ссылка. Так же Вы должны быть зарегистрированы в системе Яндекса. Перейдя по ссылке попадаем на конструктор Яндекс карт.

Первым делом нам предложат создать карту сайта, нажимаем кнопку «Создать карту»

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

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

Далее необходимо в строку поиска ввести наш адрес и нажать «Найти». Выбранное место отобразится на карте. Нажимаем кнопку «Готово». Так же можете внести название и описание. Нажимаем «Сохранить и продолжить».

Конструктор Яндекс карты - вводим адрес

Конструктор Яндекс карты — вводим адрес

Дальше нам предложат выбрать карту из трёх вариантов:

  • Интерактивная — карту можно будет двигать, а объекты отзываются на действия пользователя.
  • Статическая — карта будет в виде картинки в формате PNG.
  • Печатная — сохранение изображения карты в высоком разрешении.

Я выбрал интерактивную. Указываем необходимый нам размер в пикселях либо можно поставить галочку на пункте «Растянуть по ширине». После выбора всех параметров нажимаем «Получить код карты». Копируем полученный код и вставляем в нужное место на сайте.

Создание карты Янддекса

Создание карты Яндекса

К примеру я хочу вставить карту Яндекса на страницу доставки в WordPress. Открываем в редакторе нужную страницу в формате «Текст» и вставляем наш код.

Вставляем кодна страницу WordPress

Вставляем код на страницу WordPress

В результате получаем нашу карту на странице доставки.

Итоговая карта

Итоговая карта

Так же хочу заметить, ели Вы удалите из профиля Яндекса сохранённые карты, то вместо карты на странице увидите ошибку.

Надеюсь данная статья Вам помогла. Не забывайте пользоваться кнопками «Поделиться в соц. сетях», так же подписываться на наш Канал и группы в ВК, Twitter, Facebook.

Всем удачи и море печенек!

Поделиться в соц. сетях:

Понравилась статья? Поблагодари автора, накорми печеньками! :)

CrazyKing

Печенько-кодер :Р

2 Комментария

  1. Огромное спасибо! Как раз столкнулся с такой же необходимостью. А для других CMS это так же работает (имею ввиду вставка кода карты в html на нужной странице)?

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