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

Плагин позволяет встраивать Яндекс.Карты в ваши записи и страницы в WordPress. В отличии от Google Maps, это позволяет вставлять карты больших городов Украины и России.
В картах можно включать либо выключать кнопки увеличения, миникарту и переключения вида карты. Требуется PHP5. Есть поддержка WordPress MU.

Установка:

1. Скачайте плагин, и скопируйте в /wp-content/plugins
2. В странице администрирования блога, зайдите в раздел Plugins и активируйте модуль
3. Вверху страницы появится сообщение о том, что необходимо ввести API-ключ. Его можно получить по адресу

Использование:

1. Зайдите в создание записи или страницы
2. Внизу, под полем ввода текста появится новая панель “Yandex Maps for WordPress”
3. Заполните поля, причём
* Location name - заголовок сообщения, которое появится рядом с точкой на карте
* Address - адрес, в который небоходимо вставить точку
* Location Description - тело сообщения, которое появится рядом с точкой на карте (можно использовать HTML, но не стоит использоват одиночную ковычку)
* Map width \ height - размер карты
* Enable Zoom/Pan Controls - показывает элементы управления картой
* Enable Map Type Controls (Map, Satellite, or Hybrid) - показывает элементы управления типом карты (улицы, спутниковая, гибрид)
4. Нажмите на кнопку “Send to map editor”

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

Yandex Maps for 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) – включить возможность переключить на карту гибрид или сателлит.

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

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

Вставляем карту Google в WordPress с помощью плагина

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).

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

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

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

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

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

1. WP Google Maps

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

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

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

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

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

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

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

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

Достоинства:

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

Недостатки:

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

2. Google Maps Bank

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 версия ограничена двумя картами.

3. Simple Google Maps Short Code

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

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

Достоинства:

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

Недостатки:

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

4. CP Google Maps

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

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

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

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

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

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

Достоинства:

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

Недостатки:

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

5. Intergeo Maps

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

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

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

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

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

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

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

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

Достоинства:

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

Недостатки:

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

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

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

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

Зачем на WordPress сайте нужна карта?

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

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

Виртуальный хостинг сайтов для популярных CMS:

Как создать и добавить на сайт Яндекс карту без плагина

Чтобы создать карту без плагина для сайта WordPress, зайдите в конструктор Яндекса по адресу: https://yandex.ru/map-constructor/ .

Для использования сервиса у вас должен быть адрес электронной почты в Яндексе.

1. В конструкторе задайте адрес организации в специальной строке и нажмите кнопку «Найти».
2. Маркер укажет здание на карте по заданному адресу. Щелкните на маркере, чтобы появилась форма для его настройки. Разместите описание объекта в отведенном поле, укажите тип и цвет маркера. При необходимости выберите для него иконку из списка и нажмите кнопку «Готово».
3. Подтвердите создание карты нажатием на кнопку «Сохранить и продолжить».

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

Чтобы добавить карту на сайт, перейдите в админку WordPress, выберите нужную страницу или создайте специальную страницу для схемы проезда. В редакторе WordPress переключитесь в текстовый режим (1) правки кода. Вставьте скопированный код в требуемое место на странице (2) и опубликуйте ее.

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

Плагин OI Yandex Maps - как пользоваться, настройка, метки

Для создания и добавления карты на сайт можно воспользоваться специальным плагином Oi Yandex.Maps for WordPress. В чем преимущество использования плагина в этом случае:

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

В админке WordPress зайдите в меню «Плагины» и выберите пункт «Добавить новый». В строке поиска введите название плагина Oi Yandex.Maps, установите и активируйте его.

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

В админ-панели WordPress перейдите на страницу сайта, где будет располагаться карта. Выберите в редакторе визуальное оформление текста (1). Обратите внимание, что над панелями инструментов появилась кнопка «Яндекс карта» (2). После вставки карты плагин добавит в код страницы соответствующую информацию (3).

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

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

Для вставки карты в код страницы нажмите кнопку «Insert map». Плагин позволяет расположить на одном участке сколько угодно меток, используйте для этого кнопку «Insert placemark». Вот так выглядит на странице сайта карта, созданная плагином Oi Yandex.Maps for WordPress.

Здравствуйте, друзья блога сайт! Если вы на блоге указываете адрес своей компании, любимого бара или просто место встречи, для красоты и удобства восприятия рекомендуется приложить карту, на которой маркером отмечено это место. В этой статье я расскажу вам как быстро и просто добавить Google Map и Яндекс карту в WordPress.

Яндекс Карта — плагин Yandex Maps for WordPress

После активации, появляется отдельный пункт в панели администратора WordPress — Google Map. Настройки плагина разбиты на два раздела:

1. Shortcode Builder — генератор кода, который следует вставить в текст статьи или в виджет WP для отображения настроенной в этом разделе карты.

Рассмотрим опции этого раздела.

Basic Settings — основные настройки.

• Width и Height — ширина и высота карты в пикселях.
• Zoom — масштаб.
• Map type — тип карты.
• Alignment — выравнивание (расположение на странице).
• Direction Hint — подсказка направления.
• Map Language — язык.
• Powered By — переводится как «Приведенный в действие», но назначение данной опции осталось для меня загадкой.

Map Controls — элементы управления. Можно оставить настройки по умолчанию.

Map Markers — ставим маркеры на карту.

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

Что еще можно отображать:

• Bike Paths — велосипедные дорожки.
• Traffic Info — транспортную информацию.
• Panoramio — фотографии местности.

Когда карта настроена и на нее нанесены все необходимые маркеры, нажмите на кнопку GENERATE SHORTCODE . Появится окошко с кодом, скопируйте его и вставьте в статью.

2. Settings — в этом разделе можно разрешить или запретить отображать опции генерации кода Google карты в редакторе WordPress (как это делается в плагине Yandex Maps for WordPress по умолчанию).

Кроме этого плагин создает AZ:: Google Map . Настройки его полностью идентичны рассмотренным выше.

Спасибо за внимание! Всех Вам благ!