Хотите вставить Яндекс.Карту на свой сайт? Ловите подробную инструкцию, следуя которой вы легко и быстро добавите этот интерактивный инструмент и покажите схему проезда к офису компании, магазину или пункту выдачи.
Зачем может понадобиться интерактивная карта на сайте
Во-первых, такая опция здорово облегчает навигацию по городу. Пользователям не нужно копировать адрес, открывать карты, тратить время на поиск офиса/магазина/пункта самовывоза. Вы просто ставите метку, а потенциальные клиенты видят, где находится точка назначения и выстраивают для себя удобный маршрут. Человеку будет легче рассчитать время, которое ему понадобиться, чтобы добраться до магазина. И он точно не ошибется с адресом, если едет впервые.
Во-вторых, Яндекс карта на сайте – это возможность увеличить время визита пользователя, что улучшает поведенческие факторы и положительно влияет на результаты поисковой выдачи.
В-третьих, можно добавить все адреса организации – офисы, точки продаж, складские помещения, пункты самовывоза, что поможет продемонстрировать масштабы бизнеса. А также функционал сервиса позволяет выделить целые области, в пределах которых компания ведет свой бизнес (например, регион присутствия, область доставки).
Статические карты во многом проигрывают – они показывают лишь ограниченный участок местности. Однако их можно оформить в полном соответствии с дизайном веб-сайта. Динамические более эффективны – пользователи могут проложить маршрут в любую точку города.
Как вставить Яндекс карту на сайт
Сервис Яндекса помогает сделать интерактивный фрагмент местности и добавить туда нужные метки – адреса офисов, складов, точек продаж и выдачи заказов.
Внимание! Наличие аккаунта в Яндексе строго обязательно. Без этого вставить соответствующий код на сайт не получится.
Как вставить на сайт Яндекс карту: пошаговая инструкция
- Войдите в свой аккаунт, перейдите в конструктор Яндекса. Система сразу предложит «Создать карту»:
- В верхней части вы увидите панель конструктора, где можно подготовить будущую карту — добавить на неё нужные объекты и области:
- «Метки» позволяют отмечать и подписывать точки на карте. Можно выбрать любое количество таких точек, цвет и форму каждой из них.
- «Линии» позволяют нарисовать оптимальную схему проезда к офису, магазину. «Многоугольники» подходят для того, чтобы отметить регион доставки, например. Любые параметры контура и заливки (цвет, прозрачность) можно менять:
- Вставьте всё, что нужно, и жмите «Сохранить и продолжить». Теперь остается выбрать масштаб и получить код, чтобы вставить готовую интерактивную карту на сайт:
- Нажмите на кнопку «Получить код» и скопируйте код для вставки. При этом стоит учесть один момент. Если на вашем сайте есть возможность вставить код JavaScript, выбирайте его, это надежнее. Если же он не заработает, пробуйте iframe.
- Теперь осталось вставить сгенерированный код на сайт. Это можно сделать в любом месте – на главной странице, в контактах, блоге. Например, чтобы вставить динамичную картинку после заголовка страницы, нужно ввести код после тега <h1>:
Если у вас сайт на CMS WordPress, код можно вставить в тело самой статьи. Для этого не нужен плагин, а вставку нужно делать в режиме «Текст»:
Также карту можно вставить в боковой виджет. Только здесь нужно обратить внимание на ее ширину и высоту.
Важно! Адекватная работа динамической карты полностью зависит от работоспособности сервисов Яндекса. Если поменяется формат данных или сервисы «лягут», встроенный код не будет работать.
Вывод
Яндекс.Карта на сайте – удобный и полезный инструмент, который улучшает юзабилити и поведенческие факторы. Вставить ее можно в любом месте корпоративного веб-сайта, лендинга, интернет-магазина. Процесс занимает несколько минут – просто следуйте выше приведенной инструкции и у вас все получится.
