Strona główna /Baza wiedzy /Jak umieścić mapę Google na stronie WordPress za darmo?

Jak umieścić mapę Google na stronie WordPress za darmo?

Jak umieścić mapę Google na stronie WordPress za darmo? To jedno z tych pytań, które często pojawia się przy tworzeniu strony firmowej, szczególnie gdy firma działa lokalnie i chce pokazać klientom swoją siedzibę, punkt odbioru, gabinet, biuro albo miejsce wykonywania usług. Sam bardzo często dodaję mapę Google na stronach dla lokalnych firm, bo to prosty element, który od razu poprawia wygodę użytkownika. Klient nie musi kopiować adresu, szukać firmy ręcznie w Google ani zastanawiać się, gdzie dokładnie znajduje się lokalizacja. Wystarczy rzut oka na mapę i od razu może sprawdzić trasę dojazdu.

Dobra wiadomość jest taka, że w wielu przypadkach można dodać mapę Google do WordPressa całkowicie za darmo, bez płatnych wtyczek i bez programowania. Najprostsza metoda polega na skopiowaniu kodu mapy z Google Maps i wklejeniu go na stronę jako blok HTML.

W tym poradniku pokażę najprostsze darmowe sposoby na dodanie mapy Google do WordPressa, kiedy warto użyć zwykłego kodu iframe, kiedy można skorzystać z Elementora, a kiedy lepiej rozważyć prostą wtyczkę.

Po co dodawać mapę Google na stronie WordPress?

Mapa Google na stronie WordPress to przede wszystkim wygoda dla użytkownika. Jeżeli ktoś wchodzi na stronę lokalnej firmy, bardzo często chce szybko sprawdzić, gdzie znajduje się siedziba, biuro, gabinet, sklep albo punkt odbioru. Sama treść z adresem jest ważna, ale mapa od razu pokazuje lokalizację w praktyce.

Dzięki mapie klient może szybciej ocenić, czy firma znajduje się blisko niego, jak wygląda dojazd i czy warto kliknąć w trasę w Google Maps. To szczególnie ważne w przypadku firm lokalnych, takich jak salony fryzjerskie, gabinety kosmetyczne, warsztaty samochodowe, restauracje, firmy budowlane, biura usługowe czy punkty stacjonarne. Dlatego przy usłudze takiej jak Tworzenie strony internetowej warto od razu pomyśleć nie tylko o wyglądzie strony, ale też o praktycznych elementach, które pomagają użytkownikowi szybko znaleźć najważniejsze informacje.

Czy mapa Google pomaga w SEO? Sama mapa nie sprawi magicznie, że strona nagle wskoczy na pierwsze miejsce w Google. Nie działa to tak prosto. Może jednak pośrednio wspierać lokalne SEO, ponieważ wzmacnia czytelność danych kontaktowych i pomaga użytkownikowi szybciej potwierdzić lokalizację firmy.

Dobrze przygotowana strona firmowa powinna nie tylko ładnie wyglądać, ale też ułatwiać klientowi kontakt, dojazd i szybkie znalezienie najważniejszych informacji. O takich elementach szerzej piszę w poradniku: co powinna zawierać dobra strona firmowa .

Najważniejsze jest to, aby dane na stronie były spójne z wizytówką Google, czyli nazwa firmy, adres i numer telefonu powinny zgadzać się z tym, co widnieje w Google Business Profile. Taka spójność buduje zaufanie i ułatwia użytkownikom kontakt z firmą.

W praktyce mapę Google warto dodać szczególnie wtedy, gdy firma obsługuje klientów lokalnie albo posiada fizyczny adres. To prosty element, który nie tylko wygląda profesjonalnie, ale też zmniejsza liczbę pytań typu „gdzie dokładnie Państwo jesteście?” albo „jak do Was dojechać?”.

Jak dodać mapę Google do WordPressa krok po kroku?

Aby dodać mapę Google do WordPressa za darmo, najlepiej skorzystać z gotowego kodu osadzania dostępnego bezpośrednio w Google Maps. To najprostsza metoda, ponieważ nie wymaga instalowania dodatkowych wtyczek, tworzenia klucza API ani znajomości programowania.

Cały proces polega na wyszukaniu adresu firmy w Google Maps, skopiowaniu kodu mapy i wklejeniu go w WordPressie jako blok HTML. Poniżej pokazuję to krok po kroku, na przykładzie zwykłego osadzenia mapy przez iframe.

Dzięki tej metodzie możesz szybko dodać mapę na stronę kontaktową, do stopki, sekcji „Kontakt” albo na podstronę z lokalizacją firmy. To dobre rozwiązanie dla większości prostych stron firmowych, szczególnie gdy zależy Ci na darmowym i szybkim sposobie.

Krok 1. Wejdź w Google Maps i wyszukaj adres firmy

Na początku przejdź do strony Google Maps i wpisz adres firmy, który chcesz pokazać na swojej stronie WordPress. Może to być dokładny adres biura, gabinetu, sklepu, punktu odbioru albo innej lokalizacji, do której mają trafiać klienci.

Jeżeli firma posiada wizytówkę Google, najlepiej wyszukać ją po nazwie, a nie tylko po samym adresie. Dzięki temu na mapie może pojawić się konkretna lokalizacja firmy z nazwą, opiniami i dodatkowymi informacjami z profilu Google.

Po znalezieniu właściwego miejsca kliknij w wybraną lokalizację i upewnij się, że na mapie pokazuje się poprawny punkt. To ważne, bo właśnie tę mapę będziesz później osadzać na stronie WordPress.

Jak dodać mapę Google - Wejdź w Google Maps i wyszukaj adres firmy

Krok 2. Kliknij „Udostępnij” i „Umieszczanie mapy”

Po wyszukaniu adresu firmy w Google Maps kliknij przycisk „Udostępnij”. Zazwyczaj znajduje się on w panelu z informacjami o wybranej lokalizacji. Po kliknięciu pojawi się okno z kilkoma opcjami udostępniania mapy.

W tym miejscu wybierz zakładkę „Umieszczanie mapy”. To właśnie tam Google Maps generuje gotowy kod, który można wkleić później na stronę WordPress. Nie wybieraj zwykłego linku do mapy, jeśli chcesz, aby mapa była widoczna bezpośrednio na stronie.

W zakładce „Umieszczanie mapy” możesz też wybrać rozmiar mapy, na przykład mały, średni, duży albo własny. W większości przypadków dobrze sprawdza się rozmiar średni lub własny, który później można dopasować do układu strony.

Krok 3. Skopiuj i wklej kod <iframe> mapy w WordPressie

Po wybraniu opcji „Umieść mapę” Google Maps pokaże gotowy kod HTML. To właśnie ten fragment odpowiada za wyświetlenie mapy na stronie. Kod zwykle zaczyna się od znacznika <iframe> i wygląda mniej więcej jak dłuższy fragment tekstu z adresem mapy, szerokością, wysokością oraz dodatkowymi ustawieniami.

Kliknij przycisk „Kopiuj HTML”, a następnie przejdź do panelu WordPressa. Otwórz stronę lub wpis, w którym chcesz dodać mapę, na przykład podstronę Kontakt. W edytorze WordPress dodaj blok „Własny HTML” i wklej tam skopiowany kod.

Jeżeli korzystasz z Elementora, zamiast bloku „Własny HTML” użyj widgetu HTML. Wystarczy przeciągnąć go w wybrane miejsce na stronie, wkleić kod <iframe> i zapisać zmiany.

Po zapisaniu strony warto od razu sprawdzić, czy mapa poprawnie wyświetla się na komputerze i telefonie. Jeśli mapa jest za wysoka, za niska albo nie wygląda dobrze na stronie, można później zmienić jej rozmiar w samym kodzie, na przykład przez edycję wartości width i height.

Krok 4. Wklej kod mapy w WordPressie

Po skopiowaniu kodu HTML z Google Maps przejdź do edycji strony w WordPressie, na której chcesz wyświetlić mapę. Najczęściej będzie to podstrona Kontakt, sekcja z adresem firmy albo stopka strony.

W edytorze WordPress kliknij miejsce, w którym ma pojawić się mapa, a następnie dodaj blok Własny HTML. To właśnie tam należy wkleić kod mapy skopiowany z Google Maps. Kod zwykle zaczyna się od znacznika <iframe> i kończy na </iframe>.

Po wklejeniu kodu możesz kliknąć opcję podglądu bloku albo po prostu zapisać stronę i sprawdzić efekt na żywo. Jeżeli mapa wyświetla się poprawnie, oznacza to, że wszystko zostało dodane prawidłowo.

W przypadku Elementora kod mapy można wkleić w widget HTML. Wystarczy przeciągnąć widget w wybrane miejsce na stronie, wkleić kod iframe i zapisać zmiany. To działa bardzo podobnie jak blok „Własny HTML” w standardowym edytorze WordPressa.

Krok 5. Zapisz stronę i sprawdź mapę

Po wklejeniu kodu mapy zapisz zmiany w WordPressie. Możesz kliknąć „Zaktualizuj”, jeśli edytujesz istniejącą stronę, albo „Opublikuj”, jeśli tworzysz nową podstronę od zera.

Następnie przejdź na stronę jako zwykły użytkownik i sprawdź, czy mapa wyświetla się poprawnie. Warto zobaczyć ją nie tylko na komputerze, ale też na telefonie, ponieważ mapa może inaczej wyglądać na mniejszym ekranie.

Jeżeli mapa jest za wysoka, za niska albo wychodzi poza szerokość strony, wróć do edycji i popraw jej rozmiar. Najczęściej wystarczy zmienić wartości width i height w kodzie <iframe>. Przy szerokości dobrze sprawdza się wartość 100%, ponieważ mapa dopasowuje się wtedy do szerokości sekcji na stronie.

Na końcu kliknij w mapę i sprawdź, czy można ją przesuwać, powiększać oraz otworzyć trasę w Google Maps. Dzięki temu masz pewność, że mapa działa prawidłowo i faktycznie pomaga użytkownikom znaleźć lokalizację firmy.

Czy do dodania mapy Google w WordPressie potrzebna jest wtyczka?

Do zwykłego dodania mapy Google na stronie WordPress nie potrzebujesz żadnej dodatkowej wtyczki. Jeżeli chcesz tylko pokazać lokalizację firmy, adres biura, gabinetu, sklepu albo punktu odbioru, najprostszy kod <iframe> z Google Maps w zupełności wystarczy.

To dobra wiadomość, bo każda kolejna wtyczka w WordPressie może dodatkowo obciążać stronę, wymagać aktualizacji i czasem powodować konflikty z motywem lub innymi dodatkami. Dlatego przy prostych stronach firmowych wolę najpierw korzystać z rozwiązań bez wtyczek, a dopiero później sięgać po dodatkowe narzędzia.

Wtyczka do mapy może mieć sens wtedy, gdy potrzebujesz bardziej rozbudowanych funkcji, na przykład kilku lokalizacji na jednej mapie, własnych pinezek, filtrowania punktów, mapy sklepów albo bardziej zaawansowanego wyglądu. W większości prostych przypadków, takich jak strona kontaktowa z jedną lokalizacją, darmowe osadzenie mapy przez HTML będzie najwygodniejszym rozwiązaniem.

Czy mapa Google może spowolnić stronę WordPress?

Mapa Google jest wygodna dla użytkownika, ale warto pamiętać, że jest to zewnętrzny element ładowany z serwerów Google. Oznacza to, że po dodaniu mapy na stronę WordPress może pobierać dodatkowe skrypty i zasoby, które wpływają na czas ładowania strony.

Nie znaczy to od razu, że nie warto dodawać mapy. Trzeba po prostu robić to rozsądnie. Najlepiej umieścić mapę tam, gdzie faktycznie jest potrzebna, na przykład na podstronie kontaktowej, w sekcji z adresem firmy albo na stronie konkretnej lokalizacji. Nie zawsze trzeba dodawać mapę na każdej podstronie czy w stopce całej witryny.

Jeżeli zależy Ci na szybkości strony, dobrym rozwiązaniem może być dodanie mapy tylko na stronie „Kontakt” albo zastąpienie jej zwykłym przyciskiem „Zobacz trasę w Google Maps”. Wtedy użytkownik nadal może szybko przejść do mapy, ale sama strona nie ładuje od razu dodatkowego iframe.

W praktyce przy małej stronie firmowej jedna mapa Google nie powinna być dużym problemem, ale przy większych stronach warto zachować umiar. Im mniej zewnętrznych dodatków ładuje się na stronie, tym łatwiej utrzymać dobrą szybkość i wygodę korzystania z witryny.

Podsumowanie

Dodanie mapy Google do strony WordPress za darmo jest prostsze, niż może się wydawać. W większości przypadków nie trzeba instalować dodatkowej wtyczki ani korzystać z płatnych rozwiązań. Wystarczy wejść w Google Maps, wyszukać adres firmy, wybrać opcję udostępnienia mapy, skopiować kod <iframe> i wkleić go w WordPressie jako blok Własny HTML.

To dobre rozwiązanie szczególnie dla lokalnych firm, które chcą ułatwić klientom znalezienie siedziby, biura, gabinetu, sklepu albo punktu odbioru. Mapa nie zastąpi dobrze przygotowanej strony kontaktowej, ale może ją świetnie uzupełnić i poprawić wygodę użytkownika.

Warto tylko pamiętać, żeby nie przesadzać z liczbą map na stronie. Najczęściej jedna mapa na podstronie kontaktowej w zupełności wystarczy. Jeżeli zależy Ci na szybkości strony, możesz też dodać zwykły przycisk prowadzący do Google Maps zamiast osadzonej mapy.

Najważniejsze jest to, aby dane na stronie były spójne z wizytówką Google: nazwa firmy, adres i numer telefonu powinny zgadzać się we wszystkich miejscach. Dzięki temu strona wygląda bardziej profesjonalnie, a użytkownik od razu wie, gdzie znajduje się firma i jak do niej trafić.

Krzysztof Gruca

Krzysztof Gruca

Projektant stron i specjalista SEO/UX z 20-letnim stażem. Łączę wyczucie grafiki z technicznym SEO i dbałością o wydajność (Core Web Vitals), żeby każdy projekt był intuicyjny, szybki i gotowy na wysokie pozycje - a kawa to mój najwierniejszy framework.