Вставка Яндекс та Google карт на сайт способи встановлення

Сьогодні розповім вам, як можна додати на сайт або блог на WordPress карти від Яндекса або Гугла. Ми розберемося, в яких випадках може знадобитися така функція, а також як встановити карти на свій сайт за допомогою плагінів та без них. Також у цій статті ви дізнаєтесь, як додати свою організацію на Google та Yandex карти та які це дає переваги.
З якою метою потрібні карти?
Другий варіант використовується, як правило, для комерційних організацій із продажу товарів чи надання послуг. У такому разі власники сайтів додають свою компанію на карти пошукових систем. І тому вони вказують реальне розташування своєї фірми чи магазину, підтверджуючи свої права володіння ресурсом і достовірність поданої інформації. Розміщення на картах від Google або Яндекса в даному контексті відбувається не тільки для зручності користувачів, а й як важливий елемент SEO – просування в пошукових системах. Докладніше про те, як просувати сайт в регіонах. Подібне відображення на картах Yandex та Google надає додаткові бонуси у пошуковій видачі.
Розберемося у перевагах розміщення компанії на картах пошукових систем.
Google та Yandex карти у пошуковій видачі
Для того, щоб ваша організація з'явилася на картах Яндекса та Google, необхідно внести її у відповідні сервіси даних пошукових систем. Для Яндекса – це Довідник (https://yandex.ru/support/sprav/add-company/add-org.html). Для Google - Google Мій бізнес (https://www.google.ru/business).
Щоб перевірити, чи допомагає таке розміщення бізнесу, наведемо низку прикладів. У першому ми шукатимемо магазин одягу для собак у Санкт-Петербурзі. Це геозалежний пошуковийзапит. Вводимо запит до Яндекс.

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

Крім того, картка відображається не лише на першій, а й на наступних сторінках видачі Яндекса. Таким чином, ви отримуєте додаткову можливість залучення відвідувачів на свій сайт. І часом при пошуку послуги користувачі в першу чергу переходять саме на карту, а не переглядають сторінки видачі. Саме тому розміщення на карті – такий важливий пункт оптимізації сайту компанії.
А ось ще одна особливість при розміщенні на карті Яндекса, яка орієнтована на зручність користувачів. Вона працює, коли ми вводимо запит, що містить назву фірми.

Як бачимо, праворуч відображається карта з розташуванням компанії та опис її послуг. Тут є можливість для відвідувачів оцінити дане місце за п'ятибальною шкалою («Ви відвідували це місце?», після відповіді «Так» можна дати оцінку і додати відгук). Відгуки відображатимуться на Яндекс.Картах в описі фірми. Ще нижче за назвою організації, у нашому випадку «Туристський клуб Пік», можна натиснути кнопку «Як дістатися». При натисканні ми потрапляємо на Яндекс.карту, де можна побудувати маршрут.
Тепер подивимося, які переваги дає розміщення на картах Google. Введемо той самий запит про одяг для собак.

У лівій колонці - результати видачі (вони за позиціями відрізняються від основної пошукової видачі), праворуч - сама карта з позначеними на ній магазинами. Вибираючи та клацаючи на рядки зліва, можна переглянути короткі відомості про організацію.

Тепер введемо в пошуковий рядок назвукомпанії.

Тепер стало очевидним, що для комерційної компанії розміщення на картах Яндекса та Google – дуже корисний інструмент залучення нових клієнтів.
Далі розберемося докладніше, як додати організацію на карти Яндекса та Ґуґла, а також, як вставити схему проїзду Google або Яндекс до себе на сайт.
Як додати компанію на Яндекс
Тепер необхідно підтвердити права на ресурс та достовірність даних. Для цього переходимо в «Мої організації» (https://www.yandex.ru/sprav/companies), клацаємо «Очікують на підтвердження» і тиснемо «Підтвердити».
Також ви можете додати інформацію про місце на карті, заповнивши «Картку об'єкта».
Вибираємо будь-яке місце на Яндекс Карті для прикладу та тиснемо праву кнопку миші. Вибираємо рядок «Що тут?».

На карті з'явилася наша мітка. Тепер натискаємо «Додати організацію».

Тут нам радять додавати організацію все ж таки через Яндекс Довідник. Але ця форма також може бути використана для внесення даних про виділене на карті місце.
Після заповнення всіх даних тиснемо кнопку «Відправити» та очікуємо на обробку Яндексом поданої нами інформації.
Як додати організацію до Google Maps?
Заповнюємо всі рядки і тиснемо "Продовжити". Свою компанію необхідно знайти у переліку Гугла. Якщо хтось інший вже підтвердив сторінку вашої компанії, тоді дотримуйтесь цієї інструкції — https://support.google.com/business/answer/4566671 .
Коли всі поля заповнені правильно, натисніть «Надіслати».
Як вставити Google картку на сайт чи блог?
Є кілька способів додати Google карти до себе на сайт.
Перший варіант використовується для будь-яких ресурсів, блогів (не лише на Вордпрес).
Для цього відкриваємо Google Maps(https://www.google.com/maps ) – заходимо до Меню.


У вікні вибираємо «Код».

Наступний спосіб – створити карту за допомогою конструктора (https://mapsengine.google.com/map/).

Тут ви можете створювати карти різного виду та дизайну, додавати маршрути та додаткові шари.

Щоб додати код такої карти до себе на сайт, необхідно натиснути «Поділитися» та в «Рівні доступу» вибрати «Для всіх в Інтернеті».

Тиснемо «Готово». Тепер навпроти назви карти зі списку, що розкривається, вибираємо «Додати на сайт».

У спливаючому вікні копіюємо код виду iframe.

Прямо в цьому коді можна поміняти ширину та висоту карти (width, height) та вставити карту Google на свій сайт чи блог.
Як додати Яндекс Карту проїзду на сайт?
Перший найпростіший метод додавання карти на сторінки сайту здійснюється безпосередньо через Yandex Maps.
Так само можна отримати код для вставки «Панорами». Заходимо на панораму заданого місця, тиснемо кнопку «Поділитись», а далі «Вставити на сайт» і отримуємо код, перед цим вибравши розмір панорами.
З його допомогою можна зробити карту проїзду з маршрутами, мітками, зупинками громадського транспорту, важливими об'єктами та орієнтирами. Варто зазначити, що Яндекс Карти більш докладні та інформативні для країн СНД, ніж у Google.

В описі мітки можна вибрати вид значка, його колір, тип, зробити напис. Крім міток за аналогією з конструктором Гугл, можна створювати багатокутники (кордони території, району та ін.), лінії. Тут також є шари, можна вибирати тип карти: схема, супутник або гібрид.
Після того, як мітки створені, натискаємо «Зберегти та продовжити».

Вибираємо областьвідображення (контуром на карті), її тип (інтерактивна, статична, друкована), розмір. Натискаючи на кожен тип карти, ви будете бачити, який функціонал вона пропонує. Інтерактивну карту можна збільшувати, рухати, користуватися всіма функціями звичайної Яндекс Карти. Статична – це картка у форматі png з обмеженим функціоналом. Друковану – можна роздрукувати у високій роздільній здатності (у форматі png або jpg).
Ми вибираємо інтерактивну карту, наприклад, для розділу «Контакти» (а для вставки у статтю цілком може підійти статична картка).
Тиснемо «Отримати код карти». З'являється html-код для вставки Яндекс Карти на сайт:

Статична карта Яндекса додається на сайт як картинка.
Ось тут технічні характеристики та особливості роботи з картами API від Яндекса: https://tech.yandex.ru/maps/doc/constructor/concepts/About-docpage/
Плагіни WordPress для вставки карток на сайт
Є плагіни окремо для Google та Yandex карт.
Для Яндекса розглянемо Oi Yandex.Maps для WordPress. Цей плагін оновлюється, досить простий та зрозумілий. Установка плагіна стандартна. У налаштуваннях потрібно вказати розмір та масштаби карти, вибрати мітку.

Для вставлення карт Google на сайт ми будемо використовувати плагін WP Google Maps.