Добрый вечер, друзья!

Волею судеб я занимаюсь техническим сопровождением конференции «Маркетинг без пыли«. Это и обработка видео, и, собственно, наполнение сайта. Одной из особенностей данной конференции является ее совершенно нестандартное место проведения — в летний сезон это обычно парк, зимой же — либо уютное кафе, либо библиотека. Организаторы, подчеркивая свое отличие от банальных маркетинговых конференций с досками и занудными речами даже подчеркнули свое отличие самим названием конференции — БЕЗ ПЫЛИ. А это значит, что: никакого официоза, никаких особых требований к внешним регалиям (ты можешь быть младшим сотрудником маркетингового отдела, и иметь интересный практический опыт, а можешь быть и звездой с погонами — главное, твой практический опыт и твое желание им поделиться).

Так вот, вернемся к главному. Место проведения. В связи с тем, что место проведения все время разное (кажется, я повторяюсь), в разделе, где указывается адрес места встречи нужно не только указать адрес, но и отрисовать схему прохода/проезда. Конечно, никто не мешает заскринить кусок карты, в Photoshop нарисовать схему прохода и вставить картинку в сайт. Но… как-то это … скучно, грустно и вообще не круто. Если согласны и дочитали до этого места — читаем дальше 😉

Круто — это создать схему прохода/проезда на карте, и интегрировать ее на наш сайт. Со всеми необходимыми для навигации фишками: масштабированием, линейкой, и прочим. Итак… начнем:

Кстати, поисковый запрос в данном случае звучит как-то так:

Вставка Яндекс-карты на сайт

🙂 Порадовали роботов, двигаемся дальше. Нам понадобится:
1. Открыть Конструктор Карт — для этого просто кликните по ЭТОЙ ссылке, которая откроется в новой вкладке. Выглядит все это дело приблизительно так:

2. Кликаем по пункту «Создать новую карту».

3. Наблюдаем вот такую картинку:

Слева вы можете указать название пункта на карте, а так же описать его. В строке поиска, ожидаемо, вы можете ввести адрес или название нужного объекта, после чего найти его на карте. Попробуем проложить маршрут по городу Черновцы — от ратуши, по улице Кобылянской, в ресторан «Панська Гуральня» (просто там вкусное пиво, а на улице так жарко 🙂 ). Вводим название искомой улицы в строке поиска:

Яндекс очень шустро отображает искомую улицу. Остается только поставить метку возле нужного пункта: ресторан. Кликаем по скрину ниже — откроется подсказка в нормальном виде 😉

4. Кликаем на кнопку «Готово», создав тем самым конечную точку на карте (никто не мешает обозначить несколько точек — ваша карта, вы и решайте)

5. Осталось добавить маршрут. Для этого находим начальную точку на карте. В нашем случае — это ратуша (горсовет). После того, как вы нашли нужную вам точку на карте, не забудьте добавить к ней метку (смотрим пункт 3). В итоге получается нечто вроде такого:

Дело за малым: выбрать кнопочку «Линии» на карте и отрисовать весь необходимый маршрут:

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

6. Отрисовали маршрут? Кликаем на желтую кнопку в левом нижнем углу: «Сохранить и продолжить». Нам открывается вот такая картина:

Как видно — у вас есть возможность выбора типа карты: интерактивная, спутниковая и печатная, указать ее размер (а можно кликнуть по полю «Растянуть по ширине» и получить карту заданной высоты и шириной в 100%), и, наконец, получить код карты, который вы и будете интегрировать в свой сайт. Для этого нужно лишь нажать на желтую кнопочку «Получить код карты». После нажимания нам открывается окно следующего вида:

7. Сохраняем полученный код, и вставляем в свой сайт, получая вот такую удобную штуку:

Кстати, на видео ниже — урок: как вставить Яндекс-карту со схемой проезда на свой сайт. Смотрим!

Спасибо за внимание! Как всегда — в случае возникновения вопросов не стесняйтесь задавать их на почту: oleksiy@lavrynenko.com