Wordpress плагин карта с метками. Пять лучших плагинов WordPress для отображения карт Google

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

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

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

Создание карты ограничивается тем, что вам нужно просто вставить нужный адрес в поле под картой и найти место на карте. Так же вы можете изменить размеры карты, растягивая ее за правый нижний угол. Еще, есть возможность поменять вид отображения карты и масштаб. Я всегда ставлю "Народная", мне она больше нравится. Затем ставим нужную точку на карте и подписываем ее. Все карта создана.

После этого можно просмотреть карту, и если что-то не устраивает - поменять. В режиме просмотра нужно выбрать вид карты: для блога или для сайта. Карта для блога получается статичной, и мне она не очень нравится, хотя такой вариант заметно меньше требует времени на загрузку. Я обычно выбираю вариант "карта для сайта" и меня все устраивает.

Теперь у вас есть код Яндекс карты и вы можете вставить карту на свой WordPress сайт .

Полученный код Яндекс карты у вас должен быть примерно следующим:

Его можно разделить на две части: сам скрипт и блок DIV. Для отображения Яндекс карты на вашем сайте нужно подключить скрипт к сайту. Вы можете сделать это в файле header.php , но я рекомендую подключить скрипты в файл footer.php . Скрипты нужно подключить до закрывающего тега добавив подобный код (у вас он может быть другим, вы его получили ранее):

function fid_13485848986165892726(ymaps) {var map = new ymaps.Map("ymaps-map-id_13485848986165892726", {center: , zoom: 10, type: "yandex#map"});map.controls.add("zoomControl").add("mapTools").add(new ymaps.control.TypeSelector(["yandex#map", "yandex#satellite", "yandex#hybrid", "yandex#publicMap"]));};

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

В этом коде 450px является шириной Яндекс карты, а 350px является высотой Яндекс карты - эти параметры вы можете отредактировать по желанию.

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

Сегодняшняя статья о Яндекс картах для вашего сайта на WordPRess. О взаимодействии карт от Гугла с WP написано уже довольно много. Существуют десятки разной степени полезности, бесплатных и премиум плагинов. Есть даже специализированные темы, главной фишкой которых является именно показ гуглокарт в разных видах и для разных назначений.

У Яндекса в этом плане дела выглядят поскромнее. Плагинов существует совсем мало. Впрочем, это не столько проблема Яндекса, сколько разработчиков плагинов. Отечественных, понятное дело.

Как бы там не было, любой желающий может без особого труда добавить Яндекс карту к себе на WordPress сайт. И сегодня мы подробно рассмотрим ручной способ добавления такой карты и попутно пару полезных плагинов для тех, кто в принципе, терпеть не может никакого кода 🙂

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

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

После того как вы справились с рисованием, не забудьте ввести название своей карты. Потом жмакаем на большую желтую кнопку — «Сохранить и получить код». Внизу, в строке появится код который вам нужно скопировать в буфер обмена (CTRL+C) и потом вставить(CTRL+V) на нужную страницу или пост вашего сайта. Только учтите, что перед тем как вставить код, следует переключить визуальный редактор сайта в текстовый режим. Тут же, после вставки, в тексте кода можете подправить размер окна с картами если требуется.

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

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

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

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

Единственный премиум плагин который мне удалось сыскать на тему карт от Яндекса. Плагин будут полезен всем кому надо создавать карты с многочисленными метками и описаниями к ним. Умеет делать:

• Выбор элементов управления
• Задавать размеры карты
• Задавать тип карты
• Добавлять любое число меток
• Показывать текст на иконке и в подсказке
• Выводить ссылки

Что именно использовать на своем сайте — Яндекс или Гугл карты пусть каждый решает сам. На мой субъективный взгляд, Гугл карты хороши для сложной работы ввиду того, что к ним есть масса специализированных программ и плагинов для WordPress. Ну а для быстрого вывода например, схемы проезда в отечественных городах отлично сгодится и Яндекс.

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

Yandex Maps for WordPress – плагин Яндекс карт, который с легкостью позволяет встроить в запись или на страницу сайта интерактивную карту.

Скачать Вордпресс плагин Яндекс карт можно тут: http://wordpress.org/plugins/yandex-maps-for-wordpress/ , либо установить сразу из консоли WP , воспользовавшись встроенным поиском плагинов.

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

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

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

Этот ключ необходимо скопировать и вставить в подтверждающее окно и нажать «Применить»:

Вот собственно и все, WordPress плагин Яндекс карт полностью готов к работе.

Теперь можно зайти на страницу или в запись и вы увидите поле вставки Яндекс карты.

Location Name – заголовок точки (маркера).

Address – указание адреса маркера.

Location Description – описание.

Map Width – ширина карты в пикселях.

Map Height – высота карты.

Enable Zoom/Pan Controls – опции приближения, панели управления.

Enable Map Type Controls (Map, Satellite, or Hybrid) – включить возможность переключить на карту гибрид или сателлит.

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

Как по мне, я бы отказался от плагина и просто вставил код карты на сайт. Это позволяет сделать более гибкие и широкие настройки.

MapPress Easy Google Maps – WordPress плагин Гугл карт.

Установив данный плагин можно без труда добавить на сайт Google карту .

В отличие от Плагина Яндекс карт, описанного выше, в MapPress Easy Google Maps никаких API-ключей не нужно. После установки, можно перейти в раздел добавления записей или страниц и начать создавать карту.

Жмем «New map» :

В поле Map Title задаем заголовок карты.

Size – размер в пикселях. При редактировании размера, можно визуально посмотреть как все будет выглядеть.

Add POI – задаем местонахождение, точку, где будет расположен маркер. Достаточно просто ввести в это поле нужный адрес. Например: Славутич, Белый ангел .

Точек можно задать сколько угодно.

При нажатии на маркер, откроется окно редактирования:

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

Есть функция вставки картинок, которые будут отображаться при клике по маркеру.

И что очень приятно - есть режим редактирования HTML.

В общем, WordPress плагин Google карт определенно предоставляет больше возможностей, нежели плагин Яндекс карт.

После того, как закончили делать основные настройки, нужно сохранить карту (save) и вставить в запись (insert into post).

Вот такая симпатичная карта получилась:

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

Если вы создаете портал для какой-то компании, то не лишним будет показать людям где находится заведение, о котором вы рассказываете. Вы поговорим про плагин Яндекс карты для WordPress и вы поймете стоит ли им пользоваться или есть вариант лучше и проще.

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

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

Однако, если говорить непосредственно о плагинах, то их у Яндекса в разы меньше, но так ли они нужны? Может все-таки дело в том, что ресурс настолько удобен, что в отличие от Гугловских продуктов они просто не нуждаются в дополнительном упрощении?

Давайте это выясним.

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

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

Поставив на сайте карту города и отметив там точку, вы получите значительно больше клиентов, нежели сто раз упомянете точный адрес. Те, кто действительно заинтересуется вашим предложением будут уверены, что верно поняли где находится компания и как туда пройти. Это дает +100 к вероятности, что читатель действительно посетит вашу фирму.

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

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

Можно выбрать свой цвет и тип метки.

В центр без труда устанавливается иконка. Осталось только добавить свое описание, если это необходимо и нажать «Готово».

После этого вы можете вводить и другие адреса. Снова нажимать «найти» и метки будут добавляться на эту карту. Нажав на них вы можете перемещаться между метками и удалять их.

Описание можно ввести и в названии самой карты. Осталось только «Сохранить и продолжить».

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

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

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

Ничто лучше не покажет вашу работу заказчику, чем реальные обращения от клиентов. Как и Яндекс.Карты установить эту опцию можно проще простого. Для этого есть сервис Callbackkiller (https://callbackkiller.com ). Через него можно говорить и тогда вам придется оплачивать минуты разговора, а можно просто получать письма на почту. И это совершенно бесплатно.

Я желаю удачи в ваших начинаниях. До новых встреч.

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

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

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

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

WP Google Maps является замечательным плагином, достойным того, чтобы открыть данный список. Это один из самых мощных, если не самый мощный бесплатный плагин для отображения карт Google.

Для создания карты выберите “Карты”, а затем “Моя первая карта”. К сожалению, в бесплатной версии вам доступна будет только одна карта, поэтому добавлять новые страницы не имеет смысла.

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

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

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

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

Используя настройки плагина, вы сможете управлять как из админки, так и из пользовательской части сайта интерфейсными элементами, такими, как использование API карт Google, использование jQuery для устранения неисправностей, уровнем аккаунта, WordPress. Маркерные данные также могут быть импортированы из вашей базы данных или в файле XML.

Как уже говорилось, самым большим недостатком данного плагина является то, что в бесплатной версии вы сможете создать только одну карту (премиум версия обойдётся вам в $19.99). Помимо этого, премиум версия содержит ещё массу привлекательных возможностей.

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

• бесплатная версия ограничена одной картой.

Google Maps Bank – ещё один очень функциональный плагин для отображения карт. Он имеет множество различных опций и практически неограниченные возможности настройки. Интерфейс у него очень хорошо организован.

После установки и активации плагина для создания своей первой карты выберите в боковой панели Карты Google >> Создать новую карту. Данный процесс состоит из семи несложных шагов.

Шаг 1. Вам необходимо выбрать заголовок, описание и тип карты (доступны те же четыре варианта). Шаг 2. В информации о местоположении вы указываете точные географические координаты. Шаги 3-5 позволяют вставлять маркеры и полигоны/полилинии.

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

Для того, чтобы вставить карту в запись или на страницу, перейдите в визуальный редактор WYSIWYG и нажмите на кнопку “Добавить карты банка Google”, расположенную рядом с кнопкой “Добавить медиа”. Во всплывающем окне настройте параметры так, как вам нужно.

Google Maps Bank – очень хороший плагин, но он имеет несколько недостатков. Наиболее значимым является тот, что Lite версия ограничена 2 картами, 5 маркерами, 1 полигоом и 1 полилинией. Так что, если вам нужно что-то более существенное, чем просто добавить пару карт в ваш контакт или на страницу, то вам придётся либо выполнить апгрэйд (цены начинаются от £17), либо поискать в другом месте.

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

• Lite версия ограничена двумя картами.

Simple Google Maps Short Code – крайне простой плагин, лишённый всяческих наворотов, в котором отсутствует страница настроек. Имеется только шорткод, который можно вставить в пост или на страницу.

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

• простота в использовании
• возможность создавать неограниченное количество карт.

• отсутствие дополнительных функций или настроек.

CP Google Maps – мощный плагин, имеющий множество функций, хотя его интерфейс несколько сложноват.

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

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

Когда вы закончите редактирование (не забудьте добавить заголовок и описание), прокрутите страницу вниз до конца виджета и нажмите на кнопку “Вставить тег карты”, чтобы вставить шорткод карты в свой текстовый редактор.

Чтобы настроить опции плагина, перейдите в меню Настройки >> CodePeople карта. Здесь вы сможете настроить масштаб, ширину карты, выравнивание, тип (обычная, спутниковая, физическая и смешанная), язык и несколько других параметров.

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

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

• не очень удобная навигация
• настройки не могут быть индивидуальными для каждой карты.

Intergeo Maps – отличный бесплатный плагин от компании CodeinWP. Он имеет множество полезных функций и практически полное отсутствие недостатков.

Во-первых, процесс создания карт довольно сильно отличается от подобного процесса в других описанных плагинах. После установки плагина в боковом меню вы увидите новую вкладку “Медиа”. Для создания карты вам сначала нужно будет перейти в Медиа >> Страница Intergeo, а потом кликнуть кнопку “Добавить новую”.

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

Вы можете добавлять на карту маршруты – транспортный, велосипедный, погоду и/или панорамные фотографии.

Когда вы закончите настройку всех этих параметров, кликните на кнопку “Перейти по адресу”.

Снова появится всплывающее окно, в которое вы сможете ввести адресную информацию для карты. После этого кликните кнопку “Создать карту”.

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

Вы можете также создавать карту из вашего редактора записей, единственная разница заключается в том, что нужно будет кликнуть на кнопку “Добавить медиа”, расположенную вверху редактора. Наконец, вы всегда сможете неограниченно пополнять ваши библиотеки карт через Медиа >> Страница Intergeo.

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

• недостатков не обнаружено!

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

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