Gdy udostępniony link nie ma obrazka — albo ma wczorajszy — przyczyną prawie zawsze jest jedna z ośmiu rzeczy, a debuger samej platformy powie ci w minutę, która. Druga połowa problemu to pamięć podręczna: każda platforma trzyma własną kopię podglądu i każdą odświeża się inaczej. Ten poradnik omawia obie części, w kolejności, w jakiej warto je sprawdzać — także wtedy, gdy chcesz po prostu zmienić podgląd linku na nowy tytuł czy obrazek.
Osiem typowych przyczyn
- Względny adres.
content="/og/post.png"działa w przeglądarce i zawodzi w każdym robocie.og:imagemusi być bezwzględnym adresemhttps://. - Robot nie może pobrać obrazka. Blokuje go logowanie, zapora, ochrona przed botami (tryby botów Cloudflare, wtyczki bezpieczeństwa), ochrona przed hotlinkowaniem albo reguła w
robots.txtdlafacebookexternalhit,LinkedInBotczyTwitterbot. Slack nie respektuje robots.txt przy rozwijaniu linków, więc „w Slacku działa, na LinkedInie nie” często wskazuje właśnie tutaj. - Zły rozmiar lub plik. Poniżej 200×200 Facebook ignoruje obrazek, powyżej 8 MB go odrzuca (Meta). LinkedIn chce co najmniej 1200×627 i najwyżej 5 MB (LinkedIn); formatów dla podglądu linku nie podaje — lista JPG/PNG/GIF na tej samej stronie dotyczy reklam. Bezpiecznie jest więc trzymać się JPEG lub PNG, nie WebP.
- Tagi dodaje JavaScript. Roboty podglądu czytają HTML z serwera; aplikacja React czy Vue, która ustawia meta tagi po załadowaniu, nie pokazuje im niczego. Renderuj tagi na serwerze.
- Dwa tagi
og:image. Motyw i wtyczka SEO wypisują po jednym; robot bierze pierwszy, często ten zły. - Twój cache serwuje stary HTML. Cache strony albo CDN wciąż zwraca wersję sprzed dodania tagu.
- Adres obrazka źle przekierowuje albo zwraca zły typ. Długie łańcuchy przekierowań,
200ze stroną błędu w HTML-u alboContent-Type: text/plainprzy pliku PNG. - Pamięć podręczna platformy. Wszystko jest już poprawione, ale platforma pokazuje to, co pobrała w zeszłym tygodniu.
Krok 1: zobacz to, co widzi robot
Pobierz stronę tak jak robot i przejrzyj tagi:
curl -sL -A "facebookexternalhit/1.1" https://example.com/blog/post \
| grep -Eio '<meta[^>]+(og:|twitter:)[^>]+>'
Jeśli w wyniku nie ma og:image, problem jest w twoim HTML-u (przyczyny 1, 4, 5, 6). Jeśli jest, sprawdź sam obrazek:
curl -sIL -A "facebookexternalhit/1.1" https://example.com/og/post.png
Na końcu powinno być 200, Content-Type: image/png albo image/jpeg i Content-Length wyraźnie poniżej 5 MB. 403 to przyczyna 2; typ text/html to przyczyna 7.
Nasz darmowy OG Checker pobiera stronę tak jak robot Facebooka, wypisuje braki i pokazuje kartę na X, LinkedInie, Facebooku, w Slacku i na Discordzie; potrafi też przeskanować mapę witryny w poszukiwaniu stron bez tagów.
Krok 2: zapytaj platformę
| Platforma | Narzędzie | Odświeża pamięć? |
|---|---|---|
| Facebook, Messenger | Sharing Debugger | Tak — Scrape Again |
| Post Inspector | Tak, dla nowych postów (LinkedIn) | |
| X | Wklej link do okna nowego posta (nie trzeba publikować) | Nie — karty są pobierane mniej więcej raz w tygodniu; zmień adres |
| Slack | Niepotrzebne | Wygasa po około 30 minutach (Slack) |
| Discord | Brak | Wygasa po około 30 minutach (Discord); albo dopisz ?v=2 |
| Telegram | @WebpageBot | Tak, dla nowych wiadomości |
| Brak | Nie — zmień adres |
Debuger Facebooka to najlepsze narzędzie diagnostyczne, nawet jeśli Facebook cię nie interesuje: pokazuje dokładnie wybrany obrazek, jego wymiary, kod HTTP, jaki dostał od twojego serwera, i ostrzega, gdy obrazka nie dało się pobrać albo jest za mały. Bez ręcznego pobrania Facebook odświeża dane adresu mniej więcej co 30 dni; ponowne pobranie można też wywołać przez Graph API (POST /?id={url}&scrape=true), co przydaje się przy publikacji wielu stron naraz (Meta). Istniejące udostępnienia zachowują dane z chwili, w której powstały.
Krok 3: porządnie wyczyść pamięć podręczną
Platformy zapamiętują dwie rzeczy: stronę (jej tagi) i obrazek (plik pod adresem). Odświeżenie strony w debugerze nie zawsze odświeża obrazek — Meta sama radzi, by dla nowego obrazka „użyć nowego adresu” (Meta).
Jeśli więc zmieniasz obrazek, zmień też jego adres:
<!-- before -->
<meta property="og:image" content="https://example.com/og/post.png">
<!-- after: a new file name or a version parameter -->
<meta property="og:image" content="https://example.com/og/post-v2.png">
Generowane obrazki mają to za darmo, jeśli adres zależy od treści: skrót (hash) tytułu w nazwie pliku albo podpisany adres, którego parametry zawierają tytuł. Zmieniasz tytuł — zmienia się adres. Tak działają podpisane adresy /i/ i adresy auto-OG /u/ w Shareglint — a identyczny obrazek wraca z cache bez ponownego renderowania.
Na platformach bez narzędzia do odświeżania (X, Discord, WhatsApp) kluczem pamięci jest też adres strony. X pobiera karty mniej więcej co siedem dni i radzi udostępnić zmieniony adres, żeby szybciej zobaczyć poprawkę (archiwalna dokumentacja X). Nowe posty dostaną nowy podgląd, gdy stary wygaśnie; żeby wymusić to od razu, udostępnij adres, którego platforma jeszcze nie widziała, np. https://example.com/blog/post?v=2. Nie licz na to, że zmienią się podglądy w wiadomościach i postach już wysłanych — na większości platform zostaje to, co pobrano wtedy.
Pułapki konkretnych frameworków
- Next.js: od wersji 15.2
generateMetadatamoże strumieniować tagi po treści strony, ale dla „botów z ograniczoną obsługą HTML”, takich jakfacebookexternalhit, rozpoznawanych po user agencie, Next.js zostawia je w<head>(dokumentacja Next.js). Jeśli roboty przechodzą przez własne proxy albo user agent jest podmieniany, sprawdź, czy nadal dostają metadane blokująco. Więcej: obrazki OG w Next.js. - Aplikacje SPA (Vite, CRA, Vue CLI): prerenderuj trasy, które mają być udostępniane, albo dodaj renderowanie po stronie serwera dla meta tagów; biblioteki typu helmet działające w przeglądarce robotom nie pomogą.
- WordPress: po zmianie ustawień wtyczki SEO wyczyść cache strony; zobacz automatyczne obrazki OG w WordPressie (po angielsku).
- Strony statyczne: względna ścieżka obrazka w front matter to klasyczny błąd; zobacz obrazki OG dla Hugo, Jekylla i Astro (po angielsku).
Gdy obrazek powstaje dopiero na żądanie
Jeśli og:image wskazuje obrazek renderowany przy pierwszym żądaniu (podpisany adres, next/og, własny endpoint z Puppeteerem), koszt renderowania ponosi pierwsza wizyta robota. Roboty mają krótkie limity czasu; zimny Chrome bez interfejsu, który potrzebuje pięciu sekund, może sprawić, że pierwsze udostępnienie będzie bez obrazka — a platforma zapamięta ten wynik. Dwa wyjścia:
- Rozgrzej go: po publikacji sam raz pobierz obrazek (albo wklej adres do debugera Facebooka), zanim ktokolwiek udostępni link.
- Renderuj z wyprzedzeniem: generuj obrazek przy zapisie wpisu i zapisz jego adres, jak w poradnikach dla Laravela, Rails i Django.
Lista kontrolna na 60 sekund
-
og:imagejest bezwzględny,https://, i występuje raz w HTML-u z serwera. - Obrazek zwraca
200, typ obrazka, 1200×630, poniżej 5 MB, JPEG lub PNG (rozmiary dla każdej platformy). - Robotów nie blokuje logowanie, zapora, ochrona przed botami ani reguła hotlinkowania.
- Są
og:image:width,og:image:heightitwitter:card. - Po zmianie: nowy adres obrazka, wyczyszczony cache strony, Scrape Again na Facebooku, Post Inspector na LinkedInie.
