Добрый вечер, уважаемые читатели блога Disseo.ru. Сегодня я хочу рассказать вам о том, как вставить карту Яндекс на сайт или блог, с целью улучшения его внешнего вида и повышения Юзабилити. Конечно, если вы владелец личного блога или ресурса, в котором вы пишите исключительно о себе, своем хобби, делитесь различными советами, то добавлять карту Яндекс на сайт для вас будет лишним. Прежде всего, вставлять карту Яндекс, необходимо, на те сайты, которые занимаются продажами, предоставлением коммерческих  или иных услуг, то  есть тем ресурсам, которые имеют непосредственный физический контакт с посетителями, читателями или потребителями.

В предыдущих  статьях я уже рассказывал, как создать Sitemap XML, которая будет помогать поисковому роботу для быстрой индексации ресурса и рассказывал, как установить карту сайта Wordpress для посетителей. Сегодня же речь пойдет о карте Яндекс, которая прежде всего будет указывать место положение вашей компании или фирмы.

Карта Яндекс на сайт

Первое, что необходимо сделать для того чтобы в будущем добавить карту Яндекс на сайт, следует зарегистрировать API-ключ. Нужен он нам для того, чтобы активировать или зарегистрировать ресурс в системе. Для получения API-ключа, пройдите по ссылке ниже и нажать на строку «Получить API-ключ».

http://api.yandex.ru/maps/

Заполните открывшуюся перед вами форму, согласитесь с пользовательским соглашением и  нажмите на кнопку «Получить API-ключ».

Регистрация Api.yandex.maps

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

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

Чтобы перейти ко второму этапу, перейдите по ссылке ниже, которая автоматически пере направит в окно «Конструктор схем проезда».

API.Yandex.ru/maps/tools/constructor/

Здесь следует указать адрес места расположения на Яндекс карте. Если потребуется подробно прорисовать маршрут движения, то  можете воспользоваться инструментами.

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

Как только разберетесь с указанием адреса и места расположения, вам следует перейти в следующее окно «Просмотр». Там можно выбрать параметры того, как будет отображаться карта Яндекс на сайте.

  • Статический — пользователь не сможет менять масштаб и просматривать скрытые области.
  • Интерактивный — пользователь не только может просматривать близ лежащие области, а так же измерять расстояние до пункта назначения.
Вставить карту Яндекс на сайт
Теперь осталось дело за малым. Переходим к последнему этапу, предварительно щелкнув по окну «Код для вставки». Здесь следует согласится с пользовательским соглашением и нажать на «Получить код карты».
Карта Яндекс на сайт

Далее будет сгенерирован html код, для того чтобы вставить карту Яндекс на сайт, который размещается на любой странице блога в режиме «HTML». Но это еще не все. Я так же подготовил материал о том, как вставить карту яндекс на сайт при использовании плагина Yandex Maps for WordPress.

Плагин Yandex Maps for WordPress

Плагин Yandex Maps for WordPress удобен тем, что он позволяет добавлять несколько Яндекс карт на сайт. Это очень удобно, если ресурс представляет из себя каталог, форум, доску объявлений. Чтобы научится с ним работать, предлагаю перейти в административную панель wordpress блога и во вкладке «Плагины» нажать на кнопку «Добавить новый». В строку поиска ввести «Yandex Maps for WordPress» и щелкнуть по «Поиск плагинов».

плагин Yandex Maps for WordPress

Установите плагин Yandex Maps for WordPress и активируйте его. Далее, после активации, пройдите во вкладку «Плагины» — «Yandex Maps» и в строке «Yandex API Key» укажите ключ, который мы получили в самом начале статьи и  нажмите «Применить».

Yandex Maps

Ну, и для того, чтобы на конец добавить карту Yandex на сайт, следует «Создать новую запись» и в самом конце окна для редактирования записи, найти следующую форму и заполнить ее, в самом конце нажать на «Send map to Editor»

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

Только после того, как вы выполните все эти действия, карта Яндекс будет отображаться на вашем ресурсе и  будет она выглядеть следующим образом.

Карта Яндекс на сайт

На этом я завершаю данную статью. Так же я подготовил для вас видео урок, в котором подробно изложил весь материал. Подписывайтесь на получение статей по E-mail. Как вам статья?

С уважением, Дороднов Иван!

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

0

Получайте свежие посты прямо на E-mail: