- Odwiedź Google Maps: Przejdź na stronę Google Maps.
- Znajdź Lokalizację: Wpisz adres lub wybierz lokalizację, którą chcesz umieścić na mapie.
- Opcje Udostępniania:
- Kliknij na ikonę udostępniania (zazwyczaj znajduje się obok nazwy lokalizacji lub w menu po prawej stronie).
- Wybierz opcję „Udostępnij” lub „Embed map” („Osadź mapę”).
- Kopiowanie Kodu HTML:
- W opcji „Embed map” pojawi się pole z kodem HTML.
- Skopiuj ten kod. Jest to iframe, który umożliwia osadzenie interaktywnej mapy na Twojej stronie.
- Wstawienie Kodu na Stronę WordPress:
- Przejdź do panelu administracyjnego WordPress.
- Otwórz edytor strony lub posta, na którym chcesz umieścić mapę.
- Jeśli korzystasz z edytora blokowego (Gutenberg), wybierz blok „HTML” lub „Custom HTML” i wklej skopiowany kod.
- Jeśli korzystasz z klasycznego edytora, po prostu wklej kod HTML w miejscu, gdzie chcesz, aby mapa się pojawiła.
- Zapisz i Podgląd:
Zapisz zmiany i przejdź do podglądu strony, aby upewnić się, że mapa została poprawnie osadzona.
Pamiętaj, że wykorzystywanie map Google na stronie internetowej może podlegać pewnym ograniczeniom i zasadom, zwłaszcza jeśli jest to strona komercyjna. Upewnij się, że przestrzegasz warunków usługi Google Maps.
Możesz użyć CSS do stworzenia responsywnego kontenera dla mapy, dzięki czemu mapa będzie dopasowywała się do rozmiaru ekranu urządzenia.
Możesz zaktualizować lokalizację, edytując odpowiednie parametry w kodzie HTML lub JavaScript, który osadza mapę.
W skopiowanym kodzie HTML znajdziesz fragment przypominający ten:
<iframe src=”https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d…”></iframe>
Wartość atrybutu src wewnątrz tagu <iframe> jest URL-em mapy, który zawiera różne parametry. Parametry te określają lokalizację, poziom zoomu i inne ustawienia mapy.
Przykład:
<iframe src=”https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d243647.5771237435!2d-118.243683!3d34.052235!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80c2c75ddc27da13%3A0xe22fdf6f254608f4!2sLos%20Angeles%2C%20Kalifornia%2C%20Stany%20Zjednoczone!2m2!1d34.0522342!2d-118.2436849″ width=”600″ height=”450″ style=”border:0;” allowfullscreen=”” loading=”lazy”></iframe>
W tym przypadku: 34.052235, -118.243683 to współrzędne geograficzne Los Angeles. Możesz zaktualizować te wartości, zmieniając je na współrzędne wybranej przez Ciebie lokalizacji.
Wstawienie mapy Google na stronę WordPress jest dość proste i można to zrobić na kilka sposobów. Oto krótki przewodnik:
- Użycie iFrame:
- Odwiedź Google Maps:
Przejdź na stronę Google Maps i wyszukaj pożądaną lokalizację. - Uzyskaj Kod iFrame:
Kliknij na trzy kropki obok nazwy miejsca lub na lewo od przycisku „Udostępnij” i wybierz „Udostępnij lub osadź mapę”.
Przejdź do zakładki „Osadź mapę” i skopiuj kod HTML iFrame. - Wstaw Kod na Stronę WordPress:
W edytorze WordPress, przejdź do strony lub posta, gdzie chcesz umieścić mapę.
Użyj bloku „HTML” i wklej skopiowany kod iFrame.
Zapisz lub opublikuj zmiany.
- Odwiedź Google Maps:
- Użycie Wtyczki:
- Zainstaluj Wtyczkę:
Istnieje wiele wtyczek dla WordPressa, takich jak „WP Google Maps” lub „Google Maps Easy”, które ułatwiają dodawanie map.
Zainstaluj i aktywuj wybraną wtyczkę z WordPress Plugin Directory. - Konfiguruj Mapę:
Po aktywacji, w większości wtyczek pojawi się nowa opcja w menu WordPressa, gdzie możesz tworzyć i konfigurować mapy. - Dodaj Mapę na Stronę:
Po utworzeniu mapy, wtyczka zwykle dostarcza shortcode, który możesz wkleić na dowolnej stronie lub poście, aby wyświetlić mapę.
- Zainstaluj Wtyczkę:
Tak, możesz zintegrować mapy Google z innymi wtyczkami na swojej stronie WordPress. Jest to dość powszechna praktyka, która pozwala na rozszerzenie funkcjonalności Twojej strony. Oto kilka przykładów takich integracji:
- Formularze Kontaktowe:
Możesz zintegrować mapy Google z wtyczkami do tworzenia formularzy kontaktowych, takimi jak Contact Form 7 lub Gravity Forms, aby wyświetlać mapę obok formularza kontaktowego na stronie kontaktowej. - Wtyczki SEO:
Niektóre wtyczki SEO, takie jak Yoast SEO, mogą współpracować z mapami Google, szczególnie przy lokalnym SEO, umożliwiając lepsze wyróżnienie Twojej lokalizacji w wynikach wyszukiwania. - Wtyczki do Zarządzania Wydarzeniami:
Jeśli Twoja strona WordPress obsługuje wydarzenia, takie jak Event Manager lub The Events Calendar, możesz zintegrować mapy Google, aby pokazywać lokalizacje wydarzeń. - Wtyczki E-commerce:
Dla sklepów e-commerce, jak WooCommerce, mapy Google mogą być używane do wyświetlania lokalizacji sklepów, punktów odbioru, czy do śledzenia dostaw.
Przy integracji map Google z innymi wtyczkami, ważne jest, aby upewnić się, że wszystkie wtyczki są kompatybilne ze sobą i z aktualną wersją WordPressa, a także, że masz ważny klucz API od Google Maps, jeśli jest wymagany. Warto też zwrócić uwagę na wydajność strony, gdyż dodatkowe wtyczki i skrypty mogą wpływać na szybkość ładowania strony.