Checker podglądu linkuZobacz kartę, zanim wrzucisz link.
Wklej adres i zobacz kartę udostępniania tak, jak narysują ją Facebook, X, LinkedIn, WhatsApp, Discord, Slack, Telegram i iMessage, w wersji jasnej i ciemnej, razem z listą braków i tagami, które wystarczy wkleić, żeby to naprawić.
URL pobiera nasz serwer, bo przeglądarka nie może odczytać cudzej strony za ciebie. Nie jest logowany, nie jest zapisywany i nie trafia do nikogo z zewnątrz.
Wklej URL, żeby zobaczyć jego karty udostępniania
Dostajesz kartę tak, jak narysują ją Facebook, X, LinkedIn, WhatsApp, Discord, Slack, Telegram i iMessage, plus listę tego, czego brakuje.
Dlaczego podgląd linku pokazuje zły obrazek?
Prawie zawsze chodzi o jedną z pięciu rzeczy, a ten checker Open Graph mówi, o którą, zamiast radzić ci dodać og:image, który już masz.
Jest więcej niż jeden og:image
Motyw dodaje jeden, wtyczka dodaje drugi, a platformy w zdecydowanej większości biorą pierwszy, jaki spotkają w head. Obrazek, na który liczyłeś, zwykle jest niżej. Tabela tagów powyżej wypisuje każdego kandydata i zaznacza tego, który wygrywa.
Obrazek jest ścieżką względną
og:image="/img/card.png" to nie jest adres, który robot może pobrać. Musi być bezwzględny i musi rozwiązywać się względem adresu końcowego po przekierowaniach, a nie tego, który wpisałeś. Jeśli strona przekierowuje na www, ścieżka działająca lokalnie może na produkcji nie prowadzić donikąd.
Obrazek ma ochronę przed hotlinkowaniem
W twojej przeglądarce otwiera się bez problemu, bo masz sesję i właściwy referer. Robot nie ma ani jednego, ani drugiego, dostaje 403, a karta zostaje bez obrazka. To narzędzie wczytuje obrazek tak, jak zrobiłby to ktoś obcy, więc awaria wychodzi tutaj, a nie po publikacji.
Platforma wciąż pokazuje swój cache
Poprawiłeś tag godzinę temu, a stary obrazek dalej tam jest. Każda platforma buforuje podgląd u siebie, a niektóre trzymają go tygodniami. Nic, co zmienisz po swojej stronie, tego nie czyści, trzeba wymusić ponowne pobranie adresu narzędziem danej platformy.
Strona nigdy nie miała tych tagów
Jeśli twoja strona renderuje się po stronie klienta, tagi są w inspektorze, a nie w HTML zwróconym przez serwer. Żaden robot nie czeka na JavaScript. To najczęstsza przyczyna na nowoczesnych stackach i ta, w którą najtrudniej uwierzyć.
Których tagów Open Graph naprawdę potrzebujesz?
Cztery niosą całą kartę. Reszta to dopracowanie, a podgląd meta tagów, który oznacza wszystkie dwadzieścia jako równie pilne, nie pomaga.
og:title i og:description
Nagłówek i dwie linijki pod nim. Bez og:title platforma sięga po <title>, który zwykle pisze się pod wyniki wyszukiwania i jako nagłówek karty czyta się kiepsko. Bez opisu treść karty zostaje po prostu pusta.
og:image, bezwzględny i szeroki na co najmniej 1200 px
Facebook podaje 200x200 jako minimum i 1200x630 jako zalecenie. LinkedIn podaje 1200x627 oraz to, że obrazki węższe niż 401 px wyświetla jako małą miniaturę zamiast banera. Jeden obrazek 1200x630 zadowala wszystkie platformy naraz.
twitter:card
Jedyny tag, którego X naprawdę od ciebie potrzebuje. Ustaw go na summary_large_image, a resztę uniosą twoje tagi Open Graph: gdy brakuje odpowiedników twitter:, X sięga po og:title, og:description i og:image, więc nie musisz ich dublować.
og:url i te, które tylko porządkują
og:url sprawia, że ta sama strona nie liczy się jako kilka, gdy udostępnia się ją z różnymi parametrami śledzenia. og:image:width i height pozwalają rozłożyć kartę, zanim dojedzie obrazek. og:type, og:site_name, og:locale i og:image:alt to wykończenie.
Czy potrzebuję tagów Twittera, skoro mam Open Graph?
Najczęściej nie, i stąd bierze się mnóstwo zdublowanego kodu. Dwie rzeczy warto zrozumieć, zanim skopiujesz piętnastolinijkowy snippet z bloga.
X sam sięga po Open Graph
Jeśli brakuje twitter:title, twitter:description albo twitter:image, X czyta zamiast nich og:title, og:description i og:image. Jedyny tag, który naprawdę musisz dodać, to więc twitter:card, który mówi, czy narysować mały kwadrat summary, czy duży baner. Reszta ma sens tylko wtedy, gdy chcesz, żeby X mówił coś innego niż wszędzie indziej.
property= kontra name=, i dlaczego działa jedno i drugie
Specyfikacja Open Graph kładzie swoje tagi na property=, a specyfikacja kart X kładzie swoje na name=. W praktyce obie platformy czytają obie formy, dlatego checker rozpoznający tylko jedną zgłasza połowę twoich tagów jako brakujące. Ten parsuje obie i mówi, której użyłeś, jako notatka, a nie błąd.
Dlaczego podgląd wciąż pokazuje stary obrazek?
Bo platforma nie patrzy na twoją stronę. Patrzy na kopię, którą wzięła, gdy ktoś pierwszy raz udostępnił ten link, i będzie tak robić, dopóki coś nie zmusi jej, żeby spojrzała jeszcze raz.
Każda platforma buforuje osobno
Poprawienie tagu nikogo nie powiadamia. Facebook, LinkedIn i X trzymają własne kopie, więc link może w jednym miejscu wyglądać dobrze, a w dwóch innych w tym samym czasie nieaktualnie.
Wymuś pobranie oficjalnymi narzędziami
Facebook Sharing Debugger, X Card Validator i LinkedIn Post Inspector mają przycisk, który wymusza świeże pobranie. To jedyny pewny sposób, żeby to wyczyścić, i działa od razu.
Komunikatory prawie nie buforują
WhatsApp, Telegram, Discord i Slack zwykle pobierają stronę przy każdej nowej wiadomości, więc są najszybszym sposobem, żeby potwierdzić poprawkę, nie czekając na nikogo.
Nowy adres to wyjście awaryjne
Jeśli platforma nie chce się odświeżyć, udostępnienie adresu, którego nigdy nie widziała, omija cache w całości. Zwykle wystarczy dorzucić jeden parametr.
Nie wiesz, dokąd naprawdę prowadzi skrócony link? Rozwiń go czytnikiem kodów QR
Potrzebujesz czystego linku do udostępnienia, gdy tagi są już poprawione? Zrób go darmowym skracaczem linków
Podgląd to łatwiejsza połowa. Trudniejsza to wiedzieć, co dało kliknięcie.
Dobra karta zbiera kliknięcie. Dalej surowy adres nie mówi ci nic: ani skąd przyszła wizyta, ani która platforma faktycznie dowiozła, i nie da się go przekierować, gdy już wisi w poście. Po to jest LinkScale.
Zobacz, która platforma dowiozła
Kliknięcia według źródła, kraju i urządzenia, żebyś wiedział, czy pracę wykonał post na LinkedInie, czy newsletter.
Zmień cel później
Przekieruj link, który już jest opublikowany, bez proszenia kogokolwiek o ponowne udostępnienie.
Zachowaj kartę
Link LinkScale niesie własne tagi udostępniania, więc skrócenie go nie kosztuje cię podglądu, który właśnie naprawiłeś.
Pytania o podgląd linków
Masz jeszcze pytania?
OnlinePrawdziwi ludzie, zwykle odpowiadają w kilka minut.
Jest darmowe, bez konta i bez limitu, o którym warto by wspominać. URL pobiera nasz serwer, bo przeglądarka nie odczyta cudzej strony za ciebie, i to jedyne, co ten endpoint robi: pobiera stronę, wyciąga tagi, zwraca je. Nie logujemy go, nie zapisujemy w żadnej bazie i nie przekazujemy nikomu z zewnątrz. Jeśli wolisz, żeby nic nie opuszczało twojego komputera, tryb z wklejonym HTML wykonuje całą analizę w przeglądarce.
Zrób więcej z LinkScale
Karta naprawiona. Teraz sprawdź, ile było warte kliknięcie.
LinkScale pokazuje, skąd przyszło każde kliknięcie, i pozwala zmienić cel linku już po publikacji.
Free 14-day trial on every plan