Порядок действий для вставки карты от Яндекса на страницы сайтов, созданных в конструкторах redham.ru и jimdo.com
На странице с контактами, там где пишут адрес компании, бывает полезно вставить еще и карту с отмеченным адресом. Это позволяет посетителю сайта не только понять где находится ваша компания, но и позволяет быстро определить как можно доехать до вас. В настоящей статье разберем как можно создать такую карту на Яндекс.Картах и вставить ее на свой сайт.
Вставка карты про исходит в два этапа. Вначале карта создается и редактируется, а потом Яндекс выдает html-код, который вставляется на нужную страницу своего сайта и в нужном месте. Вставку кода рассмотрим на примере популярных конструкторов сайтов redham.ru и jimdo.com.
Создание своей карты на Яндексе
Заходим в свой аккаунт на Яндексе и выбираем пункт «Карты»
Далее выбираем пункт «Карта для вашего сайта»
И внизу выбранной страницы находим пункт «Конструктор карт». Можно сразу перейти к конструктору карт по прямой ссылке https://tech.yandex.ru/maps/tools/constructor/
В окошке ввода набираем свой адрес в произвольной форме и нажимаем кнопку «Найти»
Яндекс найдет введенный адрес и выдаст его в виде подсказки. Кликаем по ней мышью и карта откроется уже с вашим адресом:
Если все верно, то закрываем редакцию отметки
Карту можно изменить по своему вкусу: изменить масштаб, сместить, нарисовать на ней линии и пр.
Когда карта будет приведена к нужному виду, то вводим название карты и сохраняем свою карту
Теперь Яндекс помнит вашу карту. Ее, кстати, всегда можно редактировать. Для этого надо заходить в Яндекс под своим аккаунтом и переходить к своим сохраненным картам.
Получаем код карты
Яндекс предлагает на выбор два вида кода для вставки карты на сайт: интерактивная и статическая карты. Интерактивная карта содержит элементы управления: масштаб, смещение, вид карты (схема, спутник). Такая карта подразумевает код, содержащий скрипт. Если конструктор сайтов, который вы используете, позволяет вставлять скрипты в код страниц сайта, то разумеется, лучше использовать этот вариант. В противном случае придется использовать статичный вариант карты: это просто картинка, никак не изменяемая. Конструкторы redham.ru и jimdo.com позволяют вставлять скрипты, поэтому мы выберем интерактивную карту.
Вставляем карту на сайт, работающий на redham.ru
Для примера будем использовать сайт showlar.ru. Заходим в административную панель управления страницами сайта, выбираем нужную страницу и переходим в режим редактирования этой страницы:
Для вставки кода визуальный режим не подходит, нам потребуется в режим «Источник»
В этом режиме вставляем скопированный код от Яндекса, и сохраняем страницу
Все готово. Результат можно посмотреть здесь
Вставляем карту на сайт, работающий на jimdo.com
Для примера будем использовать сайт sharlar16.ru. Заходим в административную панель управления, выбираем страницу «Контакты» и в нужном месте вставляем новый модуль:
Открываем панель доступных модулей полностью:
Нам потребуется модуль «Widget / HTML”
В окно ввода вставляем скопированный код от Яндекса, и сохраняем модуль.
Переходим в режим «Вид» и любуемся на работающую карту. Результат можно посмотреть здесь
Всем удачи!