Czy chcesz utworzyć mapę z wieloma lokalizacjami w WordPress za pomocą Elementor i niezbędne dodatki?

Załóżmy, że masz firmę, która ma już kilka oddziałów w mieście i chcesz utworzyć cyfrową mapę pokazującą lokalizację tych oddziałów. Jeśli masz witrynę opartą na WordPressie, możesz bez problemu stworzyć taką mapę. Istnieje świetna wtyczka, której możesz użyć do stworzenia mapy z wieloma lokalizacjami: Niezbędne dodatki.

Niezbędne dodatki jest dodatkiem Elementor premium, więc musisz także zainstalować Elementor zanim będziesz mógł z niego skorzystać. Możesz użyć darmowej wersji Elementora do stworzenia karty z modułem Essential Addons.

La darmowa wersja Essential Addons jest również dostępny. Jednak widżet do tworzenia mapy jest dostępny tylko w wersji płatnej. Możesz pobrać płatną wersję Essential Addons na jej stronie oficjalna strona internetowa.

Wykorzystamy platformę Google Maps do stworzenia mapy na Twoim WordPressie za pomocą Essential Addons. Zanim zaczniesz, upewnij się, że zainstalowałeś Elementor i Essential Addons.

Zintegruj Mapy Google z modułem Essential Addons

Zanim będziesz mógł dodać mapę Google Maps za pomocą Essential Addons, musisz je najpierw zintegrować. Potrzebujesz klucza API, aby zintegrować Mapy Google z modułami Essential Addons.

Najpierw odwiedź tzw Konsola API Google i zaloguj się na swoje konto Google. Utwórz nowy projekt, klikając menu rozwijane u góry i kliknij NOWY PROJEKT.

Nadaj nazwę nowemu projektowi i kliknij przycisk TWORZENIE .

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Po utworzeniu nowego projektu wybierz go z rozwijanego menu i kliknij Biblioteka na lewym panelu.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Google dzieli Google Maps Platform API na 17 typów. Możesz je zobaczyć klikając w link WYŚWIETL WSZYSTKIE w sekcji Kartki. Musisz włączyć interfejsy API w zależności od tego, co chcesz osiągnąć.

Odkryj również: Jak stworzyć niestandardowy szablon pojedynczego produktu w WooCommerce za pomocą Elementora

W naszym przypadku musisz włączyć następujące interfejsy API, aby dodać mapę z Google Maps za pomocą Essential Addons.

  • Kierunki API
  • API do geokodowania
  • Mapuje interfejs API JavaScript
  • Fotele API

Aby aktywować API, wybierz API, które chcesz aktywować (klikając na nie) i kliknij przycisk AKTYWUJ.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Po zakończeniu włączania wymaganych interfejsów API wróć do głównego pulpitu Google API Console i kliknij identyfikatory na lewym panelu. Kliknij przycisk Utwórz dane logowania i wybierz Klucz API. Skopiuj klucz API w wyskakującym okienku.

Zaloguj się do pulpitu nawigacyjnego WordPress i kliknij Niezbędne dodatki na lewym panelu. Kliknij zakładkę Elementy i przewiń w dół w sekcji Zaawansowana mapa Google, Kliknij Ustawienia i wklej właśnie skopiowany klucz API.

Kliknij przycisk ZAPISZ USTAWIENIA aby zastosować nową zmianę.

Rozpocznij tworzenie mapy

Po zintegrowaniu Google Maps i Essential Addons możesz rozpocząć tworzenie mapy. W tym celu utwórz nową stronę (Strony – > Dodaj ) lub nowy przedmiot (Pozycje – > Dodaj) i edytuj go za pomocą Elementora.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora

Przed utworzeniem strony ustaw układ, klikając ikonę koła zębatego w lewym dolnym rogu, aby otworzyć panel Ustawienia. Ustaw układ z menu rozwijanego.

Utwórz nową sekcję, klikając przycisk plusa w polu edycji. Aby mieć większy obszar mapy, możesz wybrać strukturę jednokolumnową. Przeciągnij widżet Mapy Google firmy EA z lewego panelu do obszaru edycji.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Przejdź do lewego panelu i ustaw typ karty na znacznik wielokrotny.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Otwórz sekcję Ustawienia znaczników mapy i kliknij istniejący znacznik mapy, aby go edytować. Wklej szerokość i długość geograficzną pierwszej lokalizacji, którą chcesz dodać do mapy. Ustaw także tytuł i opis.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora

Aby uzyskać szerokość i długość geograficzną lokalizacji, otwórz Mapy Google i wyszukaj lokalizację (miejsce), której szerokość i długość geograficzną chcesz uzyskać. Po znalezieniu kliknij prawym przyciskiem myszy, a następnie lewym przyciskiem myszy liczbę, która pojawia się w menu kontekstowym.

Ta czynność umożliwia zatem skopiowanie szerokości geograficznej (pierwsza wartość) i długości geograficznej (druga wartość).

Po zakończeniu dodawania szerokości i długości geograficznej pierwszej lokalizacji kliknij przycisk DODAJ ELEMENT , aby dodać kolejną lokalizację do mapy.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora

Ponownie otwórz Mapy Google i znajdź nową lokalizację, którą chcesz dodać do mapy, skopiuj długość i długość geograficzną i wklej je w odpowiednich polach, takich jak powyższe. Powtórz powyższe kroki, aby dodać więcej lokalizacji do mapy.

Czytaj także: Jak korzystać z widżetu postów Elementora

Po zakończeniu dodawania lokalizacji otwórz blok Sterowanie mapą aby włączyć/wyłączyć polecenia, które chcesz wprowadzić na karcie. Tutaj możesz również ustawić poziom powiększenia.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora

Możesz także otworzyć blok Motyw mapy , aby wybrać motyw Map Google, którego chcesz użyć.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Jak dotąd pomyślnie utworzyłeś mapę z wieloma lokalizacjami. Możesz otworzyć zakładkę Styl określić wysokość i szerokość mapy.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora

Jeśli chcesz mieć mapę o pełnej szerokości, ustaw sekcję zawierającą mapę na pełną szerokość. Aby to zrobić, kliknij uchwyt sekcji.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

W zakładce i bloku Układ ustaw szerokość zawartości na pełna szerokośćr i luka w kolumnie włączona Bez odchyleń

utwórz mapę z wieloma lokalizacjami za pomocą Elementora

Kliknij przycisk OPUBLIKOWANYER na dole lewego panelu, aby opublikować swoją stronę.

Osadź mapę na stronie lub w poście

Jeśli z jakiegoś powodu wolisz osadzić swoją mapę na stronie/postie (strona/post utworzony za pomocą domyślnego edytora WordPress — Gutenberg), możesz użyć WordPress Plugin Bloki Elementora dla Gutenberga. Ta wtyczka przekształci szablon Elementora w blok Gutenberga.

Aby zapisać właśnie utworzoną mapę jako szablon Elementora, kliknij ikonę strzałki obok przycisku OPUBLIKUJ / AKTUALIZUJ i wybierz Zapisać jako szablon.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Nadaj swojemu modelowi nazwę i kliknij przycisk REKORD.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora i Essential Addons

Następnie utwórz nową stronę lub post (upewnij się, że zainstalowałeś Wtyczka Elementor Bloki dla Gutenberga). Dodaj nowy blok i wybierz Biblioteka Elementora i wybierz właśnie utworzony szablon.

utwórz mapę z wieloma lokalizacjami za pomocą Elementora

Remarque: Jeśli podczas dodawania karty zobaczysz komunikat „Tylko do celów programistycznych”, pamiętaj o włączeniu rozliczeń Google Cloud. Nowa polityka Google wymaga od programistów aktywowania konta rozliczeniowego (nadal możesz bezpłatnie korzystać z Google Maps API).

Pobierz Elementor Pro teraz !!!

Wnioski

Więc ! To wszystko w tym artykule, który pokazuje, jak utworzyć mapę z wieloma lokalizacjami za pomocą Elementora. Jeśli masz jakiekolwiek wątpliwości, jak się tam dostać, daj im znać w commentaires.

Możesz jednak również skonsultować się nasze zasoby, jeśli potrzebujesz więcej elementów do realizacji projektów tworzenia stron internetowych, zapoznaj się z naszym przewodnikiem na stronie Tworzenie bloga WordPress lub ten na Divi: najlepszy motyw WordPress wszechczasów.

Ale w międzyczasie udostępnij ten artykuł w różnych sieciach społecznościowych.

...