Чтобы сайт искался на Яндекс.Картах, его нужно зарегистрировать в Яндекс.Справочнике .

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

адрес_из_конструктора " alt="название_компании "/>

Режим панорамы также можно добавить к себе на сайт Результат (содержимое можно вертеть, если захватить его участок мышкой, переходить по улицам щёлкая по стрелкам):

Советую посмотреть это видео для вдохновения:

Добавить карту на сайт: две картинки рядом (HTML / CSS)

Можно возле карты поставить изображение организации. При уменьшении окна браузера картинки будут уменьшаться пропорционально.

Но я считаю так: пользователь ищет организацию и ему в первую очередь нужно узнать как до неё добраться. Поэтому лучше, если он увидит достаточного размера карту, чем мелкую карту и мелкое рядом стоящее фото здания. При уменьшении экрана максимально долго будет оставаться правая часть фонового изображения. А здесь левая: Если нужно, чтобы фотография перемещалась на новую строку, когда две картинки не умещаются вместе на текущей?
И последнее, вставка карты поверх фото. Описание картинки будет находиться либо справа от изображения с адресом фирмы, либо под ним.
Скульптура «Родина-мать зовёт!» Скульптура «Родина-мать зовёт!»

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

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

Зачем нужна интерактивная карта

Удобно для клиента – легко планируется маршрут с учетом всех актуальных изменений, так как Яндекс оперативно вносит данные о ремонтах и новых застройках на свои карты.

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

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

В былые времена адреса офисов, маршруты прохода и проезда, различные интересные объекты и т.д. отмечали на картинках, изображающих карту, и выкладывали на сайт обычным jpg или png файлом. Проблема была в том, что они не могли учесть временные ремонты, пробки или другие изменения местности, не имели возможности подсказать индивидуальных маршрут с разных направлений.

С развитием интернет сервисов, таких как Яндекс Карты и Google Maps, появилась возможность сделать карты живыми – интерактивными. Такие можно вертеть в разные стороны, менять масштаб, маршруты с разных точек задавать, планировать свое перемещение с учетом пробок и многое другое.

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

И для того, чтобы помочь вам сделать свой веб ресурс более приветливым к людям я расскажу, как добавить Яндекс карту на сайт, делается это очень легко с помощью специального конструктора (не сложнее чем ).

Конструктор карт Яндекс

Если у вас нет аккаунта в Яндексе, то надо будет его завести, так как без этого сконструировать ничего не получится, сервис попросит вас залогиниться или пройти регистрацию. Пугаться не нужно, регистрация – это создание почтового ящика на Yandex. Даже если он вам не нужен для работы с электронной почтой, пригодится для других сервисов поисковика, например, для Яндекс Метрики или Яндекс Вебмастер.

Начинается процедура с этой странички – tech.yandex.ru/maps/tools/constructor/

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

Фишка в том, что вы сможете вставить не просто Яндекс карту с точным адресом, а карту с любым количеством объектов выделенных разными маркерами и цветами – объектами, точками, маршрутами.

Все настройки производятся в визуальном конструкторе, никакие коды править не придется, работа по адаптации мало отличается от обычного использования Яндекс карт пользователем. Начнем с добавления объектов.

Добавление объектов

Первым инструментом послужит форма поиска, которая находится в верхней части карты. С ее помощью мы можем отыскать нужную точку по адресу, координатам или названию. Вводим в поле данные запроса, пример с адресом «Москва, Красная площадь»:

После нажатия на кнопку найти на местности появится точка, соответствующая расположению заданного объекта. Вставить можно много объектов. Пример с Кремлем:

Каждую точку можно настроить так, чтобы она отличалась от других объектов и была на карте легко различима – меняется цвет и форма, а также, внутри можно добавить уникальный значок, если ткнуть в выпадающее меню «Контент». Это удобно, если объектов на создаваемой карте много и их можно классифицировать по разным группам.

Слева наполняется список всех отмеченных на карте адресов.

Изменение масштаба и положения

С помощью клавиш «+» и «-», находящихся в левой верхней части макета устанавливается оптимальный масштаб. Полная карта России не нужна, чтобы перемещаться по центру Москвы и, если вы указываете точечный объект в каком-то городе, лучше настроить масштаб на уровне, когда различимы названия улиц и окружающих домов.

Для перемещения карты в разные стороны нужно захватить ее нажатием левой кнопки мыши и двигать куда нужно.

Контуры объектов (многоугольники) и линии

При необходимости выделить очертания какого-либо элемента на карты, когда указания точкой недостаточно, используем инструмент «Многоугольники». Устанавливая одну точку за другой, мы получаем периметр, залитый внутри определенным цветом.

Точек может быть сколько угодно, поэтому, фигура, закрашенная на карте, допускает любую степень сложности. Завершить построение контура можно кликом мыши по последней установленной точке или переключением на любую другую кнопку конструктора (например, на линии). Я выделил контуры Московского Кремля по его стене:

Начертание линий осуществляется кнопкой «Линии». Все действия аналогичны предыдущему инструменту, только пространство между точками не закрашивается. С помощью линий на Яндекс карте можно рисовать маршруты движения (прохода, проезда).

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

Конечную точку подтверждаем повторным ее нажатием мышью, там будет меню «Удалить»/«Завершить». После выбора завершения открывается поле для подписи к конечной точке и настройки параметров линии (толщина, цвет, прозрачность).

Завершаем маршрут нажатием на «Готово».

Вид карты и наложение пробок

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

А вот переключение режимов между схемой, спутником и гибридом может пригодиться.

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

Название и описание

Для того, чтобы в будущем мы могли возвращаться к созданной карте для ее корректировки или для повторного получения кода вставки надо придумать ей название и описание, после чего сохранить.

Код карты для вставки на сайт

Наша карта уже готова и теперь надо получить ее код для вставки на сайт, Яндекс дает возможность сделать:

• интерактивную карту (о которой я говорил с самого начала);
• статическую – обычная картинка, только с мудреным кодом, ничего двигать в ней нельзя, в добавок еще и максимальное число объектов ограничено;
• печатную – файл-изображение высокого качества, поддерживаются не все страны, в основном СНГ и Турция, не поддерживаются спутниковая и гибридная версия.

Выбор между ними будет выведен сразу после сохранения.

В этом же меню задается итоговый размер в пикселях. Задать его можно вручную или двигая за уголки рамку вокруг выделенной области справа. Галочка «Растянуть по ширине» заставляет карту занимать все пространство на сайте упираясь в края того блока, где она выводится.

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

Итоговый код появляется после нажатия на кнопку «Получить код карты», мой выглядит вот так:

При выборе печатной карты добавится выбор формата файла – png или jpg, и кода, соответственно, не будет – кнопка скачивания вместо него появится. Такой файл тоже можно вставить на сайт, только надо будет закачивать его на хостинг и, при отсутствии визуального редактора у вашего сайта, надо будет выписать изображение в HTML теги (src)

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

Код мы получили, теперь необходимо перенести его на наш веб ресурс. Для размещения подойдет любое место, главное, чтобы размеры вписывались. Если вы пользуетесь конструкторами или визуальными редакторами, то не забудьте при вставке кода переключить их в текстовых (HTML) режим. Вот так:

Карта, которую я сделал

Вот что получилось у меня после всех проведенных настроек:

Удобен сей элемент всем – и объекты нужные подсвечены и масштаб подобран как положено. Кроме того, сервис Яндекса позволяет пользователю определить свое местоположение (стрелочка в верхнем левом углу) и проложить индивидуальный маршрут в нужную точку.

Раскрыть карту на весь экран позволяет кнопка в правом верхнем углу в виде двух расходящихся в разные стороны стрелок. Теперь про плагины.

Плагины для WordPress и других CMS

Раньше делать карты было сложнее и многие пользовались для этих целей специальными плагинами, например, для WordPress был такой – Yandex Maps for WordPress. Сейчас не нужны никакие API и любой пользователь с минимальными знаниями разберется как все настроить, поэтому смысла в плагинах я не вижу. Названный выше плагин тому подтверждение – не обновляется более 2-х лет, видимо спроса нет.

Из относительно актуальных я нашел Yandex Maps API (обновлен 4 месяца назад) и Oi Yandex.Maps for WordPress (5 месяцев назад). Если у вас есть желание поиграть в плагины, то их найдете в репозитории Вордпресс поиском, а как устанавливать плагины .

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

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

Сразу дам ссылку на API : http://api.yandex.ru/maps/ . Если есть навыки обращения с API , то проблем с пониманием там не возникнет. Так же в своём курсе я так же использовал этот API для вывода карты.

В этой статье мы разберём наипростейший пример вывода Яндекс.Карт . Для начала напишем соответствующий HTML-код :

Комментировать тут особо нечего, всё очень просто: обычный блок с уникальным идентификатором, который нам потребуется позже, а так же с заданными параметрами ширины и высоты.

Теперь код JavaScript :

var myMap;
ymaps.ready(init); // Ожидание загрузки API с сервера Яндекса
function init () {
myMap = new ymaps.Map("map", {
center: , // Координаты центра карты
zoom: 10 // Zoom
});
}

Теперь при открытии страницы появится карта. Возможностей у Яндекс.Карт очень много: можно ставить маркеры, рисовать маршруты, выводить различную информацию (например, те же пробки) и многое другое. Как всё это подключается, написано в API .

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

Добавить интерактивную карту на свой сайт позволяет, например, всемирно известная поисковая система Google. Сделать это можно с помощью бесплатного сервиса Google Maps .

Шаг 1. Получить код для установки карты Google на сайте

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

Когда отметка на карте установлена, нажмите на значок меню рядом со строкой поиска.

В открывшемся списке меню выберите пункт «Ссылка/код».

В открывшемся окошке перейдите во вкладку «Код», выберите размер карты и скопируйте предложенный html-код.

Шаг 2. Как вставить код карты 2gis на сайт

Итак, код получен, осталось только разместить его на нужной странице сайта. Мы решили добавить карту в раздел «Контакты». Заходим в админку «Нубекса», на панели управления выбираем раздел «Страницы» , находим в списке нужный раздел и нажмимаем «Редактировать» .

Работать будем с текстовым блоком. Нажимаем кнопку «Источник» , чтобы перейти в режим редактирования кода. Вставляем в текстовое поле код, полученный на GoogleMaps, и сохраняем изменения.

Заходим на страницу «Контакты» нашего сайта и радуемся обновлениям!

Благодаря Google maps любой посетитель вашего сайта сможет увидеть местоположение организации, проложить маршрут на автомобиле, на общественном транспорте или пешком, а так же сохранить ваш адрес в своих заметках.

Кроме карт от Google, вы так же можете разместить на сайте карты от и 2gis , о них мы расскажем в соответствующих статьях.

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

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

Зачем добавлять компанию на Яндекс Карты?

Какую пользу получает компания от метки на карте?

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

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

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

Что такое Яндекс Справочник?

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

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

Пошаговый алгоритм, как добавить компанию в Яндекс Карты при помощи Яндекс Справочника

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

Убедившись в том, что названия вашего учреждения нет в базе, переходите к процессу самого добавления:

Что запрещено добавлять?

Также есть запреты на добавления определенных объектов на карту. Отказано в регистрации на Яндекс Картах будет следующим организациям:

• Незаконно действующие компании, предлагающие запрещенные услуги или товары, начиная от оружия и наркотиков и заканчивая незаконными полисами техосмотра и водительскими правами.
• Учреждения, занимающиеся деятельностью, подобной финансовым пирамидам.
• Организации, основным направлением которых является сетевой маркетинг.
• СМС-Рассылки.

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

Добавление фотографий компании на Карты Яндекса

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

Для этого вы должны быть владельцем магазина. Никто другой не имеет права добавлять изображения. Реализовать этот процесс можно через Справочник, найдя в интерфейсе вкладку «Мои организации», затем перейти в пункт «Фото» и добавить необходимое количество фотографий, и только после этого они будут показываться на Яндекс.Картах, при переходе на страницу вашей организации или в ее карточку.

Пользовательские требования к фотографиям компаний

Загружать можно только файлы, имеющие формат jpg, png. Больше 10 МБ файл весить не может. Не допускаются к размещению следующие фотографии:

• Дубликаты;
• Содержащие водные знаки, перекрывающие просмотр основного изображения;
• Не соответствующие самой организации;
• Фотографии плохого качества (размытые, поврежденные, переснятые с экрана монитора и т. д.);
• Имеющие в себе скрытые ссылки;
• Изображения запрещенных товаров (оружие, наркотики и др.);
• Фото эротического характера;
• Фотографии с данными о тех услугах или работах, которые запрещены российским законодательством;
• Коллажи;
• Фото с наличием провокационных сцен, жестокости, насилия, призывам к преступлениям.

Пользователи имеют право пожаловаться на фото, несоответствующее правилам сервиса, нажав на соответствующую кнопку. Фото будет отправлено модераторам на рассмотрение и, возможно, последующее удаление.

Фото, добавленные через интерфейс Справочника, можно удалить, но, опять же только владелец имеет на это право. Под фотографией, показ которой вы захотите приостановить, будет кнопка «Удалить».

Управление отзывами об организации на Яндекс Картах

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

Большинство из них оставляют пользователи сервиса, часть предоставляется сайтами-партнерами Яндекс Справочника. Каждый отзыв добавляется на сервис только после успешного прохождения модерации. Оставить его можно только один раз. Далее разрешена только редактура. Пишется только на русском языке, другие не рассматриваются. Не публикуют следующие отзывы:

• С использованием оскорблений и ненормативной лексики;
• Содержащие сравнения с конкурентами;
• Отзывы, отправленные в адрес администрации Яндекс.Карт, с предложениями по улучшению сервиса;
• Короткие, не имеющие смысловой нагрузки, либо вообще не относящиеся к организации;