Трябва да намерите как да добавите Google Maps към WordPress с JetElements?

Добавянето на Google Maps към вашия WordPress сайт може да подобри потребителското изживяване чрез предоставяне на точна географска информация. Но има много добавки, които можете да използвате, за да добавите Google Maps към вашия уебсайт WordPress. JetElements е едно.

JetElements, мощен плъгин за Elementor, опростява тази интеграция. Това е първокласна добавка Elementor, разработена от Crocoblock. Той предлага набор от инструменти за персонализиране, включително специално приспособление за Google Maps. Тя ви позволява да създавате персонализирани карти, без да докосвате нито един ред код. Освен това е лесен за използване и се вписва безпроблемно във всеки WordPress тема.

В тази статия ще проучим как да добавите Google Maps към WordPress с помощта на WordPress плъгин JetElements и джаджата Разширена карта.

Как да добавите Google Maps към WordPress с JetElements

Преди да започнете, уверете се, че сте инсталирали Elementor и JetEements на вашия WordPress сайт. Можете да използвате безплатната версия на Elementor, за да използвате JetElements. Но за JetElements ще трябва да го придобиете от него официален уебсайт за $19.


Съдържание


Стъпки за добавяне на Google Maps към WordPress с JetElements

Стъпка 1: Инсталирайте JetElements и Elementor

Започнете, като инсталирате Elementor, визуален конструктор на страници за WordPress. След това добавете JetElements чрез таблото за управление на WordPress. Активирайте и двата плъгина.

За повече информация вижте нашето ръководство за: Как да овладеете Elementor в WordPress: Инсталиране, използване и разширени функции

Стъпка 2: Вземете ключа за API на Google Maps

Преди да можете да добавите Google Maps към уебсайта си с помощта на JetElements, трябва да получите API ключ за интегриране на JetElements с Google Maps. Можете да получите API чрез конзолата на Google API. Така че, посетете Google API конзола и влезте с вашия акаунт в Google.

След като влезете, създайте нов проект, като щракнете върху падащото меню в горната част и щракнете върху НОВ ПРОЕКТ.

Дайте име на вашия проект и щракнете върху бутона СЪЗДАВАНЕ.

Изберете вашия нов проект от падащото меню и щракнете библиотека на левия панел.

добавете Google Maps към WordPress с JetElements

JetElements не предоставя подробна информация за API, които трябва да активирате, за да работи джаджата. Разширена карта. Според нашия опит трябва да активирате поне следните API:

  • API за геокодиране
  • JavaScript API за карти

Самият Google разделя API на Google Maps на 17 типа. Можете да ги видите, като щракнете ПОКАЖИ ВСИЧКИ в секцията Карти.

За да активирате API, изберете API, който искате да активирате (като щракнете върху него) и щракнете върху бутона АКТИВИРАТЕ.

След като завършите активирането на необходимите API, върнете се към главното табло за управление на конзолата на Google API и щракнете върху Идентификатори на левия панел. Кликнете върху бутона Създайте идентификационни данни и изберете API ключ. Копирайте API ключа в изскачащия прозорец, който се появява.

След това влезте в таблото за управление на WordPress и отидете в менюто JetPlugins –> JetElements Настройки.

добавете Google Maps към WordPress с JetElements

Отворете раздела интеграции и поставете API ключа, който току-що копирахте, в полето Ключ за API на Google Map.

Стъпка 3: Добавете приспособлението Google Maps

След като JetElements и Google Maps са интегрирани, можете да започнете да добавяте картата. За да направите това, отворете страницата, към която искате да добавите картата в Elementor. В редактора на страницата Elementor. Търсете джаджата “ Разширена карта » в библиотеката JetElements. Плъзнете и пуснете тази джаджа в желания раздел на страницата.

добавете Google Maps към WordPress с JetElements

Стъпка 4: Персонализирайте картата

Конфигурирайте адреса, който искате да показвате. Можете да персонализирате височината, мащаба и други настройки на картата, за да отговарят перфектно на дизайна на вашия сайт. JetElements също така предлага опции за добавяне на множество местоположения на една карта, идеални за фирми с множество местоположения.

Освен това ще можете да манипулирате други параметри на вашата карта. Можете да направите настройки от раздела Настройки на картата.

За да промените стила на картата, можете да отворите секцията Стил на картата.

промяна на стила на картата

Стъпка 5: Добавете вашето местоположение към картата

По подразбиране ПИН адресът е настроен на London Eye, Лондон, Великобритания. Можете да го редактирате, за да добавите местоположението на вашия бизнес.

За да направите това, отворете секцията Pins и щракнете върху съществуващия ПИН адрес. Поставете адреса на фирмата си в полето ПИН адрес и променете описанието в полето Описание на щифта.

Добавете вашето местоположение към картата – добавете Google Maps към WordPress с JetElements

За да направите пин адреса, който току-що сте задали, видим на картата, трябва да зададете центъра на картата. Например, ако бизнес местоположението ви е в Париж, бихте задали центъра на картата на Париж.

За да определите центъра на картата, отворете секцията  Настройки на картата отново въведете предпочитания от вас център на картата (име на град).

задайте центъра на картата

Ремарк: Ако видите съобщение „Само за целите на разработката“, когато добавяте карта, не забравяйте да активирате таксуването си в Google Cloud. Новата политика на Google изисква от разработчиците да активират акаунта за таксуване (все още можете да използвате API на Google Maps безплатно).

Стъпка 6: Запазване и публикуване

След като персонализирането приключи, запазете промените и публикувайте страницата. Можете да прегледате страницата, за да се уверите, че картата се показва правилно на всички устройства.

Предимства от използването на JetElements за Google Maps

JetElements не само опростява интегрирането на Google Maps, но също така предлага разширени опции за персонализиране. Това е идеален инструмент за тези, които искат да създадат професионален сайт без технически сложности. Освен това, той се актуализира постоянно, за да се осигури съвместимост с най-новите версии на WordPress и Google Maps.Вземете Elementor Pro сега!!!


Ресурси, подобни на тази статия

ЧЗВ за това как да добавите Google Maps към WordPress с JetElements

JetElements съвместим ли е с всички теми на WordPress?

Да, JetElements работи с повечето Теми на WordPress съвместим с Elementor.

Мога ли да добавя няколко местоположения към карта?

Да, JetElements позволява добавяне на множество местоположения на една карта.

Необходимо ли е да знаете кода за персонализиране на картата?

Не, JetElements предлага интуитивен интерфейс, който не изисква умения за програмиране.


Заключение

Така че! Интегрирането на Google Maps във вашия WordPress сайт е от съществено значение за подобряване на достъпността и потребителското изживяване. Благодарение на JetElements този процес става лесен и бърз. Този плъгин е чудесен избор за всеки, който иска да добави функционалност на картата без проблеми. Ако все още не сте проучили възможностите, предлагани от Elementor и JetElements, време е да се потопите в тях.

Това е всичко за тази статия, която ви показва как да добавите Google Maps към WordPress с JetElements. Ако имате някакви притеснения относно това как да стигнете до там, уведомете ни в Връзка.

Можете обаче да се консултирате нашите ресурси, ако имате нужда от повече елементи, за да осъществите вашите проекти за създаване на интернет сайтове, като се консултирате с нашето ръководство за Създаване на блог на WordPress или тази, която е включена Divi: най-добрата тема на WordPress за всички времена.

Но междувременно, споделете тази статия във вашите различни социални мрежи.

...

Тя ПИН на Pinterest