Możliwe, że spotkałeś się z sytuacją w której na stronie kontaktu, zamiast prawidłowo wyświetlającej się mapy, była jej mocno przyciemniona wersja z wkopiowaną na jej powierzchni mozaiką powtarzających się napisów For development purposes only, a na pierwszym planie widać było okienko z komunikatem „Ta strona nie może poprawnie wczytać mapy google”.
Albo – próbując wejść na stronę przywitał Cię komunikat, że połączenie nie jest prywatne/bezpieczne…
A może brzmi znajomo bo przytrafiło się to Tobie, na Twojej stronie? Spokojnie, to nie awaria serwera, nie atak hakerów i nie koniec świata. To dwa konkretne problemy które mają na ogół proste rozwiązania.
1. Niedziałająca mapa – błąd autoryzacji usług
Mapy Google na stronach internetowych nie działają jak zwykłe linki. Wymagają tzw. klucza API (Application Programming Interface Key, Klucz Interfejsu Programowania Aplikacji) – unikalnego kodu, który identyfikuje Twoją stronę i pozwala jej korzystać z usługi Google Maps.
Szary prostokąt w miejscu mapy to najczęściej efekt przerwania komunikacji między Twoją stroną a chmurą Google (Google Cloud Platform) która serwuje mapy. Od 2018 roku, aby korzystać z tego typu zasobów Google wymaga aktywnego profilu płatności, nawet dla darmowych limitów wywołań map.
JAK ZDIAGNOZOWAĆ PROBLEM?
Bez dostępu do panelu Google Cloud Platform – tylko z przeglądarką:
- Wejdź na swoją stronę i kliknij prawym przyciskiem myszy na miejsce gdzie powinna być mapa
- Wybierz „Zbadaj” lub otwórz „Narzędzia deweloperskie (F12 -> Console)”. Szukaj tych komunikatów:
- BillingNotEnabledMapError: Brak podpiętej karty płatniczej lub wyczerpanie środków.
- ExpiredKeyMapError: Klucz API został usunięty lub dezaktywowany.
- ApiTargetBlockedMapError: Twój klucz jest aktywny, ale nie ma „pozwolenia” na działanie pod tym konkretnym adresem URL lub nie ma uprawnień do danej funkcji mapy.
- ApiNotActivatedMapError: Usługa Maps JavaScript API nie jest włączona w projekcie.
Jeśli zobaczysz czerwony komunikat zawierający frazy „Google Maps” i „API key” albo „Billing” – problem najpewniej dotyczy klucza i/lub rozliczeń.
Dlaczego to niszczy reputację firmy?
Mapa to często jeden z najważniejszych elementów na stronie firmy. Nawet jeśli użytkownik wykorzystuje ją tylko po to żeby wstępnie zorientować się co do lokalizacji firmy (bo precyzyjnie służy do tego adres), nie działająca mapa to sygnał, że strona jest zaniedbana.
Jak to naprawić?
Uwaga – wymaga dostępu do Google Cloud Platform.
Tropy dotyczące powodów niedziałania usług Google na danej stronie, widoczne są na ogół wśród bieżących powiadomień (ikona dzwonka w prawym górnym rogu interfejsu Google Cloud Platform).
Wariant A: Problem z kartą płatniczą lub kontem rozliczeniowym
To najczęstsza przyczyna. Zaloguj się na konto Google powiązane ze stroną, otwórz Google Cloud Platform i:
- Zaktualizuj dane karty jeśli wygasła.
- Sprawdź czy nie ma nieuregulowanych płatności.
- Upewnij się że konto rozliczeniowe jest przypisane do projektu z kluczem API.
Celowo nie podaję nazw poszczególnych sekcji czy ścieżek, gdyż struktura jest daleka od przejrzystej i przyjaznej w nawigacji, zaś nazwy z czasem mogą się zmieniać.
Po zaktualizowaniu danych (jeśli była taka potrzeba) mapa powinna zacząć działać w ciągu kilku minut do kilku godzin.
Wariant B: Klucz API wygasł lub został dezaktywowany
W sekcji „Credentials” sprawdź status klucza. Jeśli jest nieaktywny – aktywuj go lub wygeneruj nowy klucz. Nowy klucz trzeba następnie wkleić w odpowiednie miejsce w kodzie strony lub w ustawieniach wtyczki odpowiedzialnej za mapę (w WordPressie często jest to pole w ustawieniach motywu lub dedykowanej wtyczki obsługującej mapę).
Wariant C: Błędnie ustawione restrykcje/ograniczenia dla klucza interfejsu API i brak niezbędnych bibliotek
Klucz API powinien być zabezpieczony przed kradzieżą (użyciem przez kogoś innego, na obcej domenie Twoim kosztem). Jeśli zabezpieczenie jest skonfigurowane błędnie, Google odrzuci prośbę Twojej strony o wczytanie mapy. Dodatkowo sam klucz nie wystarczy – musi on mieć włączone biblioteki niezbędne do działania wybranych funkcji:
- Maps JavaScript API – wyświetlanie wizualne mapy.
- Places API – podpowiedzi podczas wpisywania adresu i wyszukiwania miejsc po nazwie.
- Geocoding API – zamiana adresu tekstowego na współrzędne geograficzne i odwrotnie.
Jeśli masz samą mapę – Maps JavaScript API wystarczy.
Wariant D: Mapa w ogóle nie była skonfigurowana z kluczem
Jeśli strona powstała dawno temu, możliwe że mapa działała bez klucza – Google przez lata pozwalało na to dla małego ruchu. W 2018 roku zmienili zasady i teraz klucz jest wymagany zawsze. W tym przypadku trzeba:
- Założyć konto w Google Cloud Console.
- Wygenerować klucz API.
- Włączyć interfejs Maps JavaScript API (i ew. inne biblioteki zależnie od potrzeb projektu) w ramach wygenerowanego klucza.
- Wkleić klucz w panelu administracyjnym / w kodzie strony.
Brzmi skomplikowanie, ale w praktyce zajmuje około 20-30 minut jeśli wiesz gdzie klikać.
Może zdarzyć się również, że z jakiegoś powodu (na nowy serwer lub nowy adres), pole na klucz API w panelu WordPress zostało wyczyszczone i wystarczy wkleić w nie aktualny klucz.
PO NAPRAWIE – JAK SPRAWDZIĆ CZY DZIAŁA POPRAWNIE
- Odświeżenie z czystym cache – Ctrl+Shift+R (lub Cmd+Shift+R na Mac) żeby przeglądarka nie pokazała starej wersji strony tylko zaciągnęła nowe dane.
- Konsola przeglądarki (F12 → Console) – jeśli nie ma komunikatów o błędach (na czerwono) związanych z Google Maps, jest dobrze.
- Tryb incognito – otwórz stronę w oknie prywatnym, żeby mieć pewność że widzisz to samo co nowy użytkownik.
- Test z innego urządzenia lub sieci – np. z telefonu na danych sieci komórkowej, nie na domowym WiFi.
- Podgląd wskaźników użycia – jeśli masz dostęp do Cloud Console, możesz podejrzeć wykresy zapytań do danego API – jeśli mapa działa, pojawią się nowe dane/odczyty.
2. Ostrzeżenie „strona niezabezpieczona / połączenie nie jest prywatne”
Drugi problem wygląda groźniej niż jest w rzeczywistości. W przeciwieństwie do mapy, gdzie problem leży po stronie usługi Google, tutaj winowajca siedzi bliżej – na serwerze Twojej strony. Przeglądarka blokuje stronę, wyświetla czerwone ostrzeżenia i sugeruje użytkownikowi żeby zawrócił. Najczęstsza przyczyna? Certyfikat SSL który po prostu przestał być ważny.
Twoja strona korzysta (lub powinna korzystać) z protokołu HTTPS (Hypertext Transfer Protocol Secure, czyli Bezpieczny Protokół Przesyłania Danych). HTTPS działa dzięki certyfikatowi SSL (Secure Sockets Layer, Warstwa Bezpiecznych Połączeń) – cyfrowemu dokumentowi, który potwierdza, że połączenie między przeglądarką użytkownika a Twoją stroną jest zaszyfrowane i bezpieczne.
Kiedy z certyfikatami jest coś nie tak, przeglądarka przestaje ufać stronie i zaczyna ostrzegać użytkowników próbujących wejść na stronę o potencjalnym niebezpieczeństwie. To trochę tak jakby Twój dowód osobisty skończył ważność: nadal jesteś sobą, ale urzędnik tego nie potwierdzi. Powody takiego stanu rzeczy mogą być różne. Zazwyczaj jest to przekroczona data ważności certyfikatu lub jego całkowity brak.
JAK ZDIAGNOZOWAĆ PROBLEM?
Symptomy nieważnego lub brakującego certyfikatu SSL widoczne w przeglądarce:
- W pasku adresu widać czerwoną/przekreśloną tarczę a obok napis Niezabezpieczona oraz przekreślone https.
- Poniżej, w oknie przeglądarki widać komunikat w stylu: Połączenie nie jest prywatne wraz z technicznym kodem błędu pod spodem, np.:
- NET::ERR\_CERT\_DATE\_INVALID – certyfikat wygasł lub data jeszcze nie nastała.
- NET::ERR\_CERT\_COMMON\_NAME\_INVALID – certyfikat nie pasuje do domeny.
- NET::ERR\_CERT\_AUTHORITY\_INVALID – certyfikat od niezaufanego wystawcy (np. self-signed).
- NET::ERR\_CERT\_REVOKED – certyfikat istnieje i nie wygasł, ale został celowo unieważniony.
- Adres strony zaczyna się od http:// zamiast https://.
- Przeglądarka blokuje dostęp do strony i wymaga ręcznego potwierdzenia, przez użytkownika, świadomości zagrożenia.
Dodatkowo żeby upewnić się, korzystając z przeglądarki:
- Wejdź na swoją stronę i kliknij ikonę ostrzeżenia lub przekreślonej tarczy w pasku adresu.
- Kliknij na szczegóły dot. certyfikatu i sprawdź daty ważności certyfikatu.
- Możesz też skorzystać z bezpłatnego narzędzia SSL Certificate Checker, które pokaże Ci dokładnie co jest nie tak i potwierdzi poprawne działanie SSL po usunięciu błędu.
Dlaczego to niszczy zaufanie do Twojej firmy?
Google traktuje brak HTTPS jako sygnał ostrzegawczy – może to wpłynąć na Twoją pozycję w wynikach wyszukiwania. Ale ważniejsze jest to, co dzieje się w głowie użytkownika: widzi ostrzeżenie i myśli, że Twoja firma jest nieprofesjonalna, nieaktywna albo – w najgorszym wypadku – niebezpieczna. Większość ludzi po prostu zamknie kartę (przejście dalej wiąże się z podjęciem świadomego ryzyka które niedoświadczonego użytkownika może skutecznie odstraszyć).
Jak to naprawić
Wariant A: Certyfikat w ogóle nie był włączony dla danego adresu/domeny
Jeśli Twoja strona zawsze działała na http:// (bez „s”), to certyfikatu SSL po prostu nie ma. Większość hostingów oferuje go bezpłatnie – najczęściej przez Let’s Encrypt, ZeroSSL (dostawcy darmowych certyfikatów SSL).
W panelu hostingu poszukaj opcji „Darmowy certyfikat SSL”, „Let’s Encrypt” (ewentualnie „ZeroSSL”) i aktywuj go dla swojej domeny. Cały proces zajmuje kilka minut.
Wariant B: Certyfikat wygasł
Jeśli strona kiedyś działała na HTTPS, a teraz przestała – certyfikat wygasł.
- Darmowy certyfikat (Let’s Encrypt, ZeroSSL) powinien odnawiać się automatycznie co 90 dni. Jeśli przestał – najczęściej problemem jest konfiguracja po stronie hostingu (niekoniecznie bezpośrednio po stronie usługodawcy – problemem może być Twoja konfiguracja tej części usług).
- Jeśli masz płatny certyfikat: musisz go odnowić przez panel swojego dostawcy certyfikatów lub przez hosting.
Podsumowanie
Oba problemy – wygasły certyfikat SSL i martwa mapa Google – mają jedną wspólną cechę: są niewidoczne dla właściciela strony dopóki nie stają się widoczne dla wszystkich. I oba są stosunkowo proste do naprawienia, jeśli wiesz gdzie szukać.
Certyfikat SSL to jak ważny dowód tożsamości Twojej strony – musi być aktualny, żeby przeglądarki i użytkownicy jej ufali. Klucz API do map to z kolei bilet wstępu do usługi Google – bez aktywnego konta rozliczeniowego ten bilet traci ważność.
Jeśli któryś z tych problemów dotknął Twojej strony i nie wiesz jak sobie poradzić – napisz do mnie. Chętnie przeprowadzę audyt Twojej witryny i wdrożę wszystkie poprawki za Ciebie.
Twoja strona sprawia kłopoty?
Jeśli wolisz, żeby ktoś się tym zajął zamiast Ciebie – opisz swój projekt albo po prostu napisz. Odpowiadam konkretnie i bez zobowiązań.