Hostuj szczegółowe mapy Google za pomocą wtyczki Map Locations WordPress

Opublikowany: 2023-03-30

Czy wiesz, że możesz hostować interaktywną mapę Google na swojej stronie WordPress?

Być może już wiesz, że możesz osadzić mapę Google na dowolnej stronie lub poście, po prostu kopiując kod iframe do bloku HTML. Spowoduje to wyświetlenie mapy dowolnego wyznaczonego obszaru. Jest to jednak ograniczenie metody osadzania HTML.

Jeśli chcesz przenieść lokalizacje na mapie Google na inny poziom w swojej witrynie WordPress, zostań, ponieważ pokażę ci dokładnie, jak to zrobić w tym artykule.

Ale najpierw zastanów się, jakie potencjalne zastosowania możesz mieć, umieszczając mapę Google w swojej witrynie?

Po pierwsze, możesz pokazać lokalizację swojej firmy za pomocą pinezki. Lub, jeśli planujesz wydarzenie, możesz wyświetlić dokładną lokalizację bezpośrednio na stronie wydarzenia, aby odwiedzający mogli łatwo planować z wyprzedzeniem. Załóżmy, że masz witrynę turystyczną, która zawiera informacje o najlepszych muzeach w danym mieście. A może możesz pokazać szlaki turystyczne i pozwolić użytkownikom na wprowadzanie własnych notatek na temat wędrówki?

Możesz to wszystko zrobić za pomocą wtyczki Map Locations WordPress firmy Creative Minds. Zacznijmy!

Twórz unikalne mapy za pomocą wtyczki Map Locations

Dzięki wtyczce Map Locations możesz umieścić wiele lokalizacji na mapie Google wraz z określonymi informacjami o lokalizacji — a także zdjęciami, filmami, trasami z kodami pocztowymi i znacznikami z możliwością wyszukiwania.

Korzystając z integracji z mapami Google możesz stworzyć system lokalizacji sklepów za pomocą wielu map, tworząc interaktywny katalog lokalizacji. Wtyczka umożliwia również wyświetlanie unikalnej ikony dla każdej lokalizacji.

zrzut ekranu strony WordPress z wtyczką Cm Map Locations

Ponadto wtyczka obsługuje:

  • Importowanie i eksportowanie lokalizacji
  • Wyszukiwanie lokalizacji według kodu pocztowego
  • Osadzanie lokalizacji za pomocą skrótów
Sprawdź lokalizacje na mapie

Pierwsze kroki z wtyczką Map Locations WordPress

Wtyczka Map Locations zawiera pełne menu ustawień i zawiera łatwo dostępny podręcznik użytkownika bezpośrednio na pulpicie administratora WordPress. Aby skonfigurować i skonfigurować swoje mapy, należy wykonać kilka ważnych kroków. Pierwszym z nich jest zainstalowanie wtyczki w Twojej witrynie.

Zainstaluj wtyczkę Map Locations

Możesz znaleźć i pobrać wtyczkę Map Locations na swojej stronie WordPress.org. Alternatywnie możesz wyszukać „lokalizacje na mapie cm” na pulpicie nawigacyjnym w sekcji Wtyczki → Dodaj nowy .

Możesz także kupić jedną z wersji premium wtyczki na stronie Creative Minds.

Po zainstalowaniu i aktywacji znajdziesz nowy element menu w menu pulpitu nawigacyjnego po lewej stronie o nazwie „Lokalizacje na mapie CM”.

Pierwszym krokiem w konfiguracji wtyczki jest wprowadzenie klucza Google Maps API. Jeśli jeszcze go nie masz, przejdźmy do tego teraz.

Uzyskaj klucz API Map Google

Najpierw potrzebujesz konta Google. Od lipca 2018 r. korzystanie z danych Map Google, Tras i Miejsc wymaga również posiadania informacji rozliczeniowych w Google Cloud. Będziesz jednak mieć możliwość dodania tych informacji podczas tworzenia klucza API.

W sekcji CM Map Locations→Settings znajdziesz pole na klucz API oraz link do jego uzyskania, jeśli jeszcze go nie masz.

zrzut ekranu menu lokalizacji na mapie

Do korzystania z wtyczki Map Locations będziesz potrzebować kilku kluczy API:

  • API JavaScriptu
  • API geolokalizacji (dla niektórych funkcji; wymaga HTTPS)
  • API do geokodowania
  • Interfejs API miejsc

Aby zdobyć te klucze, przejdź na stronę Google Developers.

Przejdź do swojego projektu lub utwórz nowy.

zrzut ekranu menu projektu Google Developer

Następnie przejdź do APIs & Services→Library .

Wybierz jeden interfejs API z listy lub użyj paska wyszukiwania, aby znaleźć jeden z interfejsów API, o których wspomniałem wcześniej. W wyskakującym menu interfejsu API kliknij niebieski przycisk Włącz . Powtórz kroki dla każdego interfejsu API.

Po włączeniu wszystkich interfejsów API musisz zdobyć klucz (potrzebujesz tylko jednego). Na pasku bocznym wybierz Poświadczenia, gdzie zobaczysz swój klucz API. Skopiuj klucz API do schowka — za chwilę wkleisz go na swojej stronie internetowej.

Najpierw musisz włączyć rozliczenia za Google Cloud, jak wspomniałem wcześniej. Jest to ważny krok, aby wtyczka Maps Location działała poprawnie. Po zalogowaniu się do projektu kliknij menu hamburgerów w lewym górnym rogu i wybierz Rozliczenia. Otrzymasz wiadomość z prośbą o połączenie konta rozliczeniowego . Kliknij ten przycisk i postępuj zgodnie z instrukcjami.

Po wykonaniu wszystkich czynności niezbędnych do skonfigurowania i uzyskania kluczy Google API, wróć do witryny WordPress. Na stronie ustawień CM Map Locations wklej swój klucz Google Maps API i kliknij Zapisz u dołu. Jeśli chcesz, możesz przetestować konfigurację za pomocą przycisku po prawej stronie.

Dodawanie lokalizacji

Wtyczka Map Locations tworzy zarówno stronę indeksu dla odwiedzających, jak i dla użytkowników. Po dodaniu lokalizacji zostanie ona wyświetlona na tych stronach. Przed dodaniem lokalizacji dobrze jest utworzyć co najmniej jedną kategorię dla swoich map.

Jest to tak proste, jak dodanie nowej kategorii postów, ale są one specyficzne dla lokalizacji na mapie. Utwórz tyle kategorii, ile chcesz w CM Map Locations→Categories . Możesz także dodać domyślne ikony znaczników dla każdej kategorii.

zrzut ekranu menu lokalizacji na mapie

Po utworzeniu kategorii możesz dodać lokalizację. Możesz skorzystać z menu Lokalizacje na mapie CM lub kliknąć + Nowy na pasku narzędzi administratora i wybrać Lokalizacja . W nowym edytorze strony Lokalizacja wypełnij pola Nazwa lokalizacji i Opis, które odnoszą się do wybranej lokalizacji.

Wybierz odpowiednią kategorię z listy i wybierz ikonę znacznika. Możesz także przesłać własną ikonę, jeśli chcesz. Następnie możesz dodać dowolne zdjęcia lub filmy dotyczące swojej lokalizacji — może to być przydatne w przypadku witryn z przewodnikami turystycznymi.

Następnie przewiń w dół do mapy Google wyświetlanej na stronie. W razie potrzeby wyszukaj lokalizację lub przesuń mapę. Gdy masz już w zasięgu wzroku swoją lokalizację, wybierz jedno z narzędzi do rysowania i narysuj granice swojej lokalizacji na mapie.

zrzut ekranu przedstawiający tworzenie lokalizacji na mapie na mapie Google

Przewijając stronę w dół, zobaczysz automatycznie uzupełnione dokładne informacje o szerokości i długości geograficznej oraz dane adresowe dla Twojej lokalizacji. Jeśli chcesz, możesz dodać:

  • Numer telefonu
  • Strona internetowa
  • Adres e-mail
  • Adres URL

Kliknij przycisk Zapisz , a Twoja lokalizacja zostanie dodana do listy lokalizacji dostępnych w Twojej witrynie. Podczas przeglądania lokalizacji Twoi goście zobaczą starannie sformatowane informacje i mapę.

zrzut ekranu z wyświetlaną mapą Santa Barbara

Tworzenie strony indeksu

Celem strony indeksu jest wyświetlenie mapy ze znacznikami reprezentującymi różne lokalizacje wraz z konfigurowalną listą tych lokalizacji.

Stronę indeksu można skonfigurować tak, aby wyświetlała różne informacje o każdej lokalizacji, takie jak:

  • Tytuł
  • Opis
  • Adres
  • Ocena.

Użytkownicy mogą wchodzić w interakcje z mapą i listą lokalizacji, aby wyszukiwać określone lokalizacje lub przeglądać wszystkie dostępne opcje.

Strona indeksu może również zawierać takie funkcje, jak filtr promienia kodu pocztowego oraz możliwość dodawania niestandardowych adresów URL lub wskazówek dojazdu do każdej lokalizacji.

Wyświetlaj mapy za pomocą skrótów

Skróty to skróty specyficzne dla WordPress, które pozwalają użytkownikom dodawać dynamiczne funkcje, takie jak mapy z lokalizacjami, do postów i stron.

Istnieją różne skróty do różnych celów, w tym do wyświetlania fragmentu lokalizacji, pokazywania określonej lokalizacji na mapie, wyświetlania map z lokalizacjami z kategorii i wyświetlania aktualnych map lokalizacji.

Użytkownicy mogą dodawać parametry, aby te skróty były bardziej szczegółowe, takie jak wybór motywu, szerokości i wysokości mapy lub ograniczenie liczby wyświetlanych lokalizacji.

Poniżej znajduje się lista wszystkich skrótów i ich parametrów wraz z przykładami ułatwiającymi zrozumienie:

Skróty lokalizacji:

  1. Skrawek
    • Krótki kod: [fragment cmloc]
    • Użycie: Wyświetla fragment lokalizacji.
    • Parametry filtrowania: id
    • Zobacz parametry: polecane
    • Próbka: [cmloc-snippet id=”487″ opisywany=”mapa”]
  2. Konkretna mapa lokalizacji
    • Krótki kod: [cmloc-mapa-lokalizacji]
    • Użycie: Pokazuje określoną lokalizację na mapie.
    • Parametry filtrowania: id
    • Zobacz parametry: motyw, wysokość mapy, szerokość mapy, szerokość, tytuł pokazu, data pokazu
    • Przykład: [cmloc-location-map id=1767 mapwidth=640 mapheight=480 width=700 showtitle=1 showdate=1]
  3. Mapa wielu lokalizacji
    • Krótki kod: [cmloc-lokalizacje-mapa]
    • Zastosowanie: Wyświetla mapy z lokalizacjami z wybranej kategorii.
    • Parametry filtrowania: showonlybyparams, limit, page, category, taxonomy_key
    • Wyświetl parametry: motyw, lista, szerokość mapy, szerokość, menu, podpowiedź, mapa, śledzenie użytkownika, od_daty, do_daty
    • Pobierz parametry: bgcolor, bgcolor_filter, time, time_filter, identifier, identifier_filter, from_date, to_date, hours, path
    • Próbka 1: [cmloc-locations-map category=”góry”]
    • Próbka 2: [cmloc-locations-map list=left limit=4 page=1 category=”111″]
  4. Aktualna mapa lokalizacji
    • Krótki kod: [cmloc-bieżąca-mapa-lokalizacji]
    • Użyj: Pokazuje aktualne mapy lokalizacji.
    • Parametry filtrowania: limit, strona
    • Zobacz parametry: motyw, szerokość mapy, szerokość, podpowiedź
    • Próbka: [cmloc-bieżąca-mapa-lokalizacji]

Skróty można znaleźć w opcji Skróty w celach informacyjnych.

Dostępne skróty

Szczegółowe instrukcje dotyczące konfigurowania skrótów i wyświetlania lokalizacji za pomocą skrótów można znaleźć w dokumentach pomocy bazy wiedzy CM Map Locations.

Kontrola dostępu

Jeśli chcesz, aby Twoje mapy były interaktywne, musisz skonfigurować kontrolę dostępu w menu Lokalizacje map CM . Dostępnych jest wiele opcji dostępu.

Ustawienia dostępu pozwalają administratorowi kontrolować, kto może wyświetlać, wyświetlać, tworzyć i aktualizować lokalizacje, a także jakie role mogą korzystać z Biblioteki multimediów podczas przesyłania obrazów.

Administrator może wybierać spośród wstępnie ustawionych opcji, takich jak wszyscy, zalogowani użytkownicy lub określone role użytkowników, takie jak administrator, redaktor, autor, współautor lub subskrybent.

Alternatywnie mogą utworzyć niestandardową rolę i wyświetlić listę nazw możliwości osób, które mają do niej dostęp.

Lista lokalizacji

Dzięki temu możesz określić, kto może uzyskać dostęp do indeksu lokalizacji oraz wyszukiwać lub filtrować lokalizacje.

Zobacz lokalizację

To określa, kto może wyświetlać stronę lokalizacji.

Utwórz lokalizację

Wybierz, kto może tworzyć lokalizacje.

Zaktualizuj własną lokalizację

Wybierz, kto może aktualizować lokalizacje.

Role uprawnione do korzystania z biblioteki multimediów

Jeśli subskrybent ma możliwość przesyłania_plików, może zobaczyć kartę WordPress Media Library podczas przesyłania obrazu do lokalizacji. Jeśli chcesz uniemożliwić użytkownikom przeszukiwanie Biblioteki multimediów Twojej witryny, upewnij się, że cofniesz dostęp dla określonych ról.

Dla każdej kategorii możesz wybrać jedną z domyślnych ról zawartych w rdzeniu WordPress lub ról zapewnianych przez wtyczki, które wyznaczają określone role.

Dodatkowe funkcje

Omówiłem podstawy konfigurowania i używania wtyczki Map Locations, ale dostępnych jest o wiele więcej funkcji.

Motywy

Do wyboru jest aż sześć motywów, dzięki którym Twoje lokalizacje będą się wyróżniać na Twojej stronie.

Płytki/Warstwy

Kafelek lub warstwa to część mapy, która jest generowana i wyświetlana oddzielnie od reszty mapy.

Te kafelki lub warstwy to zazwyczaj kwadratowe obrazy, które są wstępnie renderowane i przechowywane w pamięci podręcznej na serwerze, co pozwala na szybkie wyświetlanie ich na mapie bez konieczności jednoczesnego ładowania całej mapy przez przeglądarkę użytkownika.

Kafelki lub warstwy służą do ulepszania wizualnej prezentacji map, umożliwiając wyświetlanie dodatkowych informacji na górze mapy podstawowej. Może to obejmować etykiety, znaczniki i inne dane, które mogą pomóc użytkownikom w poruszaniu się po mapie i zrozumieniu kontekstu wyświetlanego obszaru.

Ponadto kafelki lub warstwy mogą również poprawić wydajność map, umożliwiając przeglądarce ładowanie tylko części mapy, które są aktualnie widoczne, zamiast całej mapy naraz.

Możesz dodawać warstwy na swoich mapach, aby wyświetlać informacje, takie jak wyświetlanie cykli ruchu, za pomocą OpenStreetMap lub innej usługi.

Przykład nakładek kafelków na mapach
Przykład nakładek kafelków na mapach

Ustawienia znajdują się w zakładce Ogólne, w sekcji Mapa.

  • Domyślny widok mapy – wybierz domyślny widok. Użytkownicy mogą to zmienić w dowolnym momencie.
  • Wstaw adres URL kafelka — Dodaj adres URL wybranej usługi kafelków. Sprawdź Tiles – OpenStreetMap Wiki, aby uzyskać więcej przykładów
Ustawianie kafelków i warstw na mapach
Ustawianie kafelków i warstw na mapach

Pozwól odwiedzającym włączać i wyłączać kafelki podczas przeglądania mapy.

Wybierz przycisk Kafelki, aby wyświetlić lub ukryć kafelki
Wybierz przycisk Kafelki, aby wyświetlić lub ukryć kafelki

Możesz nawet zezwolić użytkownikom na przesyłanie kafelków.

Pokaż lokalizację użytkownika

Twoi użytkownicy mogą udostępniać swoją geolokalizację i wyświetlać ją na mapie.

Obsługa REST/API

Użyj REST API do tworzenia lokalizacji z innych stron, a nawet aplikacji mobilnych.

Wyświetl szablony

Dostępnych jest kilka szablonów wyświetlania, umożliwiających łatwe tworzenie lokalizatora sklepów, listy lub ciekawych miejsc.

Szukaj według promienia

Możesz wyszukiwać określony promień od kodu pocztowego w dowolnym kraju.

Wskazówki Waze i Google

Gdy tworzysz nową lokalizację, do wpisu są automatycznie dodawane łącza Wave i Google wskazujące kierunek.

Ceny wtyczki Map Locations

Możesz zainstalować i używać wtyczki Map Locations za darmo w dowolnej liczbie witryn WordPress. Zawiera wszystkie podstawowe elementy potrzebne do stworzenia dowolnej liczby lokalizacji, dodania opisu i obrazów oraz pokazania każdej lokalizacji na unikalnej mapie. Jednak kupując wersje premium, uzyskujesz dostęp do większej liczby funkcji.

Lokalizacja na mapie Essential (Pro) = 39 USD rocznie

Oprócz podstawowych funkcji wymienionych powyżej otrzymujesz szablony wyświetlania, import/eksport, obsługę kategorii, informacje o pogodzie, kontrolę dostępu i wiele więcej — w jednej witrynie.

Pakiet Advanced Map Location + Route Manager = 69 USD rocznie

Ten poziom dodaje wtyczkę Route Manager firmy Creative Minds i rozszerza licencję na trzy strony internetowe.

Najlepsza lokalizacja na mapie + trasy na mapie + 5 dodatków = 119 USD rocznie

Poziom Ultimate dodaje kilka dodatków i wtyczkę Map Routes z licencją na maksymalnie dziesięć stron internetowych.

Każdy poziom zapewnia roczne wsparcie i oferuje 30-dniową gwarancję zwrotu pieniędzy.

Wyświetlaj interaktywne mapy w swojej witrynie WordPress

Wtyczka Map Locations umożliwia tworzenie list lokalizacji sklepów, prowadzenie turystów przez dowolne miasto, a nawet pozwala użytkownikom tworzyć i dostosowywać mapy do swoich potrzeb. To jedna z wielu wtyczek oferowanych przez zespół programistów w Creative Minds.

Wypróbuj wtyczkę Map Locations