Mieszana zawartość strony, czyli brak zielonej kłódki

Zielona kłódka bezpieczeństwa

Brak pełnej kłódki w pasku przeglądarki pomimo włączonego certyfikatu ssl jest spowodowany mieszaną zawartością strony

Mieszana zawartość strony internetowej spowodowana jest najczęściej tym, że po zainstalowaniu certyfikatu ssl, niektóre elementy strony wyświetlają się nadal jako niebezpieczne. Błędy wyświetlania spowodowane są przez źródła takie jak obrazy, skrypty oraz arkusze stylów, które nadal są ładowane za pomocą niezabezpieczonego protokołu HTTP . W takim przypadku nie zobaczymy zielonej lub czarnej kłódki w pasku przeglądarki. Piszę zielonej lub czarnej, bo jej wygląd zależy od tego, jakiej przeglądarki internetowej używamy. Na potrzeby tego artykułu będę używał pojęcia zielona kłódka, co oznaczać będzie pełne i poprawne zabezpieczenie.

Mieszana zawartość strony internetowej w przeglądarce Chrome i Firefox.
Górny pasek URL przedstawia wygląd przeglądarki z mieszaną zawartością strony w Mozilla Firefox, a dolny w Google Chrome.

Jak sprawdzić, czy Twoja strona zawiera mieszaną zawartość?

Aby sprawdzić, które elementy strony zostały uznane za niebezpieczne, możesz w tym celu wykorzystać przeglądarkę internetową. W Google Chrome kliknij w dowolnej części strony www prawym przyciskiem myszy i wybierz zbadaj. Włączy się tryb programisty i wystarczy, że przełączysz się na zakładkę Console. Jeśli po przełączeniu pojawia się komunikat o mieszanej zawartości strony, to klikając na poszczególne elementy, zlokalizujesz problem.

Jak naprawić błędy związane z mieszaną zawartością strony?

W pierwszej kolejności zajrzyj do ustawień ogólnych WordPressa i upewnij się, czy w adresie jest https:// przed nazwą domeny. Jeśli jest http:// to zmień na https:// i zapisz ustawienia. Jeśli mieszana zawartość strony internetowej występuje nadal, to to skorzystaj z następnego kroku.

Aby rozwiązać problem z wyświetlaniem pełnej kłódki w pasku przeglądarki, polecam użycie wtyczki, która w bazie danych zamieni adresy URL. WordPress posiada wiele takich wtyczek, natomiast osobiście polecam Better Search Replace. Wspominałem już o niej w artykule Jak zainstalować certyfikat ssl w WordPressie.

Aby zmienić adresy URL, zaloguj się do panelu WordPress, przejdź do menu Narzędzia, odszukaj Better Search Replace. Następnie w polu Search for wpisz adres starej nazwy domeny, a w polu Replace with wpisz nowy adres.

Zamiana http:// na https:// za pomocą wtyczki Better Search Replace

Ostatnim krokiem jest zaznaczenie wszystkich tabel w sekcji “Select Tables”.

Wtyczka Better Search Replace pozwala na tzw. „dry run”, co oznacza, że przed uruchomieniem można najpierw sprawdzić, ile zmiennych zostanie podmienionych. Jeśli jesteśmy pewni, że chcemy, by wtyczka podmieniła wszelkie stare URL na nowe, to odznaczamy opcję “Run as dry run?” i naciskamy przycisk “Run.

Po wykonanej operacji wtyczka nie będzie już potrzebna i można ją spokojnie usunąć.