Open Graph — jak ustawić podgląd linku na Facebooku, LinkedInie i X

Aktualizacja: 18.10.2026

Gdy ktoś wkleja link do Twojej strony na Facebooku, LinkedInie czy X, serwis buduje z niego kartę: obrazek, tytuł, krótki opis. Treść tej karty podpowiadają tagi Open Graph w kodzie strony. Bez nich serwis zgaduje — i często wybiera logo w złym kadrze, przypadkowy fragment tekstu albo nie pokazuje obrazka wcale.

Uczciwie: to nie jest czynnik rankingowy Google. Pozycje w wyszukiwarce się od tego nie zmienią. Zmienia się to, jak link wygląda, gdy ktoś go udostępnia — a od tego zależy, czy ludzie w niego klikną.

Co dokładnie wykrył audyt

Brak tagów Open Graph — w kodzie strony głównej nie ma żadnego tagu og:. Facebook czy LinkedIn same wybiorą obrazek i opis linku, często nie te, które chcesz.
Tagi są, ale bez obrazka (og:image) — tagi są ustawione, brakuje obrazka. Link wyświetli się jako goły tekst albo z grafiką wybraną przez serwis, a taki wpis zbiera mniej kliknięć. Audyt sprawdza też kilka podstron: jeśli one obrazek mają, problem dotyczy tylko strony głównej i zwykle wystarczy ustawić domyślny obrazek we wtyczce SEO lub w sklepie.
Obrazek ma adres względny — w og:image jest sama ścieżka (np. /img/baner.jpg) zamiast pełnego adresu z https://. Facebook i LinkedIn potrzebują pełnego adresu, inaczej podgląd może być bez zdjęcia.
Jest obrazek, ale brak og:title — serwisy wezmą tytuł z innego miejsca strony, niekoniecznie ten, który chcesz. Dodaj og:title.
Karty X (informacja) — audyt pokazuje, jak link wyświetli się w poście na X. Brak osobnych tagów twitter: nie jest błędem: X korzysta z tagów Open Graph.

W raporcie to sprawy z kategorii kosmetyki — warto je poprawić, ale nie blokują widoczności w Google.

Jakie tagi są potrzebne

Tagi wstawia się w sekcji <head> strony. Minimalny, sensowny zestaw:

<meta property="og:title" content="Meble na wymiar z Krakowa — Stolarnia Nowak">
<meta property="og:description" content="Kuchnie, szafy i zabudowy na wymiar. Projekt i montaż w 4 tygodnie.">
<meta property="og:image" content="https://www.twojadomena.pl/media/udostepnianie.jpg">
<meta property="og:url" content="https://www.twojadomena.pl/">
<meta property="og:site_name" content="Stolarnia Nowak">
<meta property="og:type" content="website">

og:title — tytuł karty. Może być taki sam jak tag title, ale bez dopisków typu „| Sklep” — w karcie liczy się czytelność.
og:description — jedno, dwa zdania zachęty. Często kopia meta description.
og:image — najważniejszy tag. Przyjęty standard to 1200×630 px (proporcje ok. 1,91:1), plik JPG lub PNG, najlepiej poniżej 1–2 MB. Adres musi być pełny, z https:// i domeną — sama ścieżka /media/obrazek.jpg bywa ignorowana. SVG nie działa (X go wprost nie obsługuje). Ważne treści trzymaj bliżej środka, bo serwisy przycinają brzegi.
og:url — docelowy, kanoniczny adres strony (ten sam, co w canonical). Dzięki niemu polubienia i udostępnienia różnych wariantów adresu liczą się razem.
og:site_name — nazwa firmy lub serwisu. Przy okazji to jeden z sygnałów, z których Google ustala nazwę witryny pokazywaną w wynikach (najważniejsze są tu dane strukturalne WebSite — patrz dane strukturalne).

Na Facebooku warto dodać też og:image:width i og:image:height — wtedy obrazek pojawia się poprawnie już przy pierwszym udostępnieniu, zanim serwis go pobierze i przetworzy.

Karty X (dawniej Twitter Cards)

X najpierw szuka tagów twitter:, a gdy ich nie ma, bierze odpowiedniki z Open Graph: tytuł, opis i obrazek. Jedyny tag bez odpowiednika to twitter:card, czyli typ karty. Jeśli chcesz dużego obrazka na całą szerokość posta zamiast małej miniatury, dodaj:

<meta name="twitter:card" content="summary_large_image">

To wystarczy. Osobne twitter:title czy twitter:image mają sens tylko wtedy, gdy na X chcesz pokazać coś innego niż na Facebooku. Yoast SEO i Rank Math dodają twitter:card automatycznie.

Jak sprawdzić samemu

Kod strony. Otwórz stronę, naciśnij Ctrl+U (na Macu Cmd+Option+U), potem Ctrl+F i wpisz og:. Zobaczysz wszystkie tagi Open Graph. Sprawdź, czy jest og:image i czy jego adres zaczyna się od https://. Skopiuj ten adres do nowej karty — obrazek musi się otworzyć.
Podgląd Facebooka. Wklej adres w Facebook Sharing Debugger (potrzebne konto na Facebooku). Narzędzie pokaże kartę, odczytane tagi i ostrzeżenia, np. o brakującym og:image.
Podgląd LinkedIna. To samo w LinkedIn Post Inspector (wymaga zalogowania).
Podstrony. Sprawdź też kartę produktu, wpis na blogu i stronę kategorii — każda powinna mieć własny tytuł i obrazek, a nie wszędzie logo.

Jak naprawić

WordPress z Yoast SEO

Włączenie tagów: Yoast SEO → Ustawienia → Funkcje witryny — przełączniki Dane Open Graph i Dane kart X mają być włączone (domyślnie są).
Obrazek domyślny dla całej strony: Yoast SEO → Ustawienia → Podstawy witryny → pole Obrazek witryny (Site image). Używany, gdy strona nie ma własnego obrazka — to zwykle rozwiązuje problem strony głównej.
Pojedynczy wpis lub strona: w edytorze panel Yoast → zakładka Media społecznościowe (Social) → obrazek, tytuł i opis dla Facebooka i X. Gdy pole jest puste, Yoast bierze obrazek wyróżniający, potem pierwszy obrazek z treści, a na końcu obrazek domyślny.

WordPress z Rank Math

Obrazek domyślny: Rank Math SEO → Tytuły i meta → Globalne meta → Miniatura OpenGraph → wgraj obrazek 1200×630 i zapisz.
Strona główna (gdy pokazuje listę wpisów): Tytuły i meta → Strona główna → miniatura dla Facebooka.
Pojedynczy wpis: w edytorze panel Rank Math → zakładka Social → osobno Facebook i X. Kolejność wyboru obrazka jest podobna jak w Yoast: własny obrazek, obrazek wyróżniający, pierwszy obrazek z treści, miniatura domyślna.

WooCommerce

Produkty i kategorie obsługuje ta sama wtyczka SEO. Produkt bez ustawionego obrazka social dostanie zdjęcie główne produktu — wystarczy, że jest ono wystarczająco duże (szerokość co najmniej 1200 px). Nie instaluj dodatkowej wtyczki „Open Graph” obok Yoast lub Rank Math, bo tagi się zdublują i serwisy wezmą przypadkowe.

Shopify

W panelu: Sklep internetowy → Preferencje → sekcja Obraz udostępniania w mediach społecznościowych i SEO → Dodaj obraz → Zapisz. To obrazek dla strony głównej i stron bez własnego zdjęcia (np. „O nas”).
Produkty, kolekcje i wpisy na blogu w darmowych motywach Shopify dostają automatycznie swoje zdjęcie wyróżnione.
Jeśli obrazek z Preferencji się nie pokazuje, sprawdź Motyw → Dostosuj → Ustawienia motywu → sekcja mediów społecznościowych — obrazek ustawiony w motywie ma pierwszeństwo.

PrestaShop

Domyślny motyw Classic (PrestaShop 1.7 i 8) wstawia og:title, og:description, og:url i og:site_name na wszystkich stronach, ale og:image tylko na kartach produktów (zdjęcie główne). Strona główna i kategorie zostają bez obrazka — dokładnie ten przypadek, który zgłasza audyt. Rozwiązania:

Moduł Open Graph / SEO z PrestaShop Addons, który pozwala ustawić obrazek domyślny i dla stron CMS.
Edycja motywu (najlepiej motywu potomnego): w pliku templates/_partials/head.tpl dopisz tag og:image z pełnym adresem obrazka dla stron innych niż produkt. Edycję motywu zostaw osobie, która zna Smarty — po aktualizacji motywu zmiany w oryginalnych plikach przepadną.

Shoper

Kontrolę nad obrazkiem udostępniania daje płatna aplikacja OG Image z Shoper Apps (jednorazowa opłata instalacyjna): osobny obrazek dla strony głównej, produktów i wpisów blogowych. Alternatywą jest dopisanie tagów w kodzie szablonu (plik header.tpl), ale Shoper ostrzega, że zmienione pliki szablonu nie aktualizują się automatycznie przy aktualizacjach.

Strona bez CMS

Wklej zestaw tagów z przykładu wyżej do sekcji <head> każdej strony, podmieniając tytuł, opis, obrazek i adres. W szablonach generowanych przez programistę te wartości powinny brać się automatycznie z tytułu i zdjęcia danej podstrony.

Jak sprawdzić, że naprawione, i odświeżyć podgląd

Facebook i LinkedIn zapamiętują kartę przy pierwszym udostępnieniu. Po poprawkach stary podgląd może się trzymać, dopóki nie wymusisz odświeżenia:

Wyczyść cache strony (wtyczka cache, LiteSpeed, Cloudflare) i sprawdź w kodzie (Ctrl+U, okno prywatne), że nowe tagi są na miejscu.
Facebook: w Sharing Debugger wklej adres i kliknij Scrape Again (Pobierz ponownie). Facebook trzyma obrazki według ich adresu — jeśli podmieniłeś plik pod tym samym adresem, wgraj go pod nową nazwą.
LinkedIn: w Post Inspector wpisz adres i kliknij Inspect — narzędzie pobierze stronę od nowa. Zmiana dotyczy tylko nowych postów; opublikowane wcześniej zachowują stary podgląd.
X: osobnego walidatora już nie ma — wklej link w okno nowego posta (bez publikowania) i zobacz kartę.

Efekt jest natychmiastowy po odświeżeniu w narzędziach — nie trzeba czekać na Google. Jeśli podglądu nie ma w ogóle, sprawdź, czy firewall lub ochrona przed botami nie blokuje robotów Facebooka i LinkedIna (więcej: blokada botów i firewall).

Kiedy warto poprosić o pomoc

Gdy tagi są w kodzie, a narzędzia Facebooka czy LinkedIna dalej pokazują stary albo pusty podgląd, przyczyną bywa cache serwera, zdublowane tagi z dwóch wtyczek lub blokada robotów. Podobnie w sklepach, gdzie potrzebna jest zmiana szablonu. IF.PL zajmuje się SEO i stronami WWW — możemy to uporządkować razem z profilami społecznościowymi i resztą wizytówki firmy w sieci.