Как вставить Яндекс карты на свой сайт: пошаговое руководство

Хотите вставить Яндекс.Карту на свой сайт? Ловите подробную инструкцию, следуя которой вы легко и быстро добавите этот интерактивный инструмент и покажите схему проезда к офису компании, магазину или пункту выдачи.

Зачем может понадобиться интерактивная карта на сайте

Во-первых, такая опция здорово облегчает навигацию по городу. Пользователям не нужно копировать адрес, открывать карты, тратить время на поиск офиса/магазина/пункта самовывоза. Вы просто ставите метку, а потенциальные клиенты видят, где находится точка назначения и выстраивают для себя удобный маршрут. Человеку будет легче рассчитать время, которое ему понадобиться, чтобы добраться до магазина. И он точно не ошибется с адресом, если едет впервые.

Во-вторых, Яндекс карта на сайте – это возможность увеличить время визита пользователя, что улучшает поведенческие факторы и положительно влияет на результаты поисковой выдачи.

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

Статические карты во многом проигрывают – они показывают лишь ограниченный участок местности. Однако их можно оформить в полном соответствии с дизайном веб-сайта. Динамические более эффективны – пользователи могут проложить маршрут в любую точку города.

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

Сервис Яндекса помогает сделать интерактивный фрагмент местности и добавить туда нужные метки – адреса офисов, складов, точек продаж и выдачи заказов.

Внимание! Наличие аккаунта в Яндексе строго обязательно. Без этого вставить соответствующий код на сайт не получится.

Как вставить на сайт Яндекс карту: пошаговая инструкция

  1. Войдите в свой аккаунт, перейдите в конструктор Яндекса. Система сразу предложит «Создать карту»:

для того, чтобы создать новую яндекс карту, в первую очередь нужно войти в свой аккаунт и нажать на конструктор

  1. В верхней части вы увидите панель конструктора, где можно подготовить будущую карту — добавить на неё нужные объекты и области:

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

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

на данном этапе пользователь может установить на карте любое количество точек

  1. "Линии" позволяют нарисовать оптимальную схему проезда к офису, магазину. "Многоугольники" подходят для того, чтобы отметить регион доставки, например. Любые параметры контура и заливки (цвет, прозрачность) можно менять:

с помощью линий и многоугольников можно отметить определенную область

  1. Вставьте всё, что нужно, и жмите «Сохранить и продолжить». Теперь остается выбрать масштаб и получить код, чтобы вставить готовую интерактивную карту на сайт:

для вставки yandex maps на свой веб-сайт необходимо получить код

  1. Нажмите на кнопку «Получить код» и скопируйте код для вставки. При этом стоит учесть один момент. Если на вашем сайте есть возможность вставить код JavaScript, выбирайте его, это надежнее. Если же он не заработает, пробуйте iframe.

если ресурс поддерживает вставку кода JavaScript, необходимо вставить его

  1. Теперь осталось вставить сгенерированный код на сайт. Это можно сделать в любом месте – на главной странице, в контактах, блоге. Например, чтобы вставить динамичную картинку после заголовка страницы, нужно ввести код после тега <h1>:

вставляем полученный код на нашу площадку

Если у вас сайт на CMS WordPress, код можно вставить в тело самой статьи. Для этого не нужен плагин, а вставку нужно делать в режиме «Текст»:

сайты на вордпресс поддерживают вставку кода прямо в текст статьи

Также карту можно вставить в боковой виджет. Только здесь нужно обратить внимание на ее ширину и высоту.

помимо этого, сервис позволяет вставлять карту в боковой виджет

Важно! Адекватная работа динамической карты полностью зависит от работоспособности сервисов Яндекса. Если поменяется формат данных или сервисы «лягут», встроенный код не будет работать.

Вывод

Яндекс.Карта на сайте – удобный и полезный инструмент, который улучшает юзабилити и поведенческие факторы. Вставить ее можно в любом месте корпоративного веб-сайта, лендинга, интернет-магазина. Процесс занимает несколько минут – просто следуйте выше приведенной инструкции и у вас все получится.

Читайте также: Как накрутить отзывы на Яндекс и Google картах

0
Читайте также:
 
Напишите ваш комментарий
или разместить анонимно
Loading comment... The comment will be refreshed after 00:00.