Krótka odpowiedź: aby sprawdzić Open Graph online, wklej adres strony do darmowego programu Open Graph Debugger PromoPilot. Odczyta on wszystkie tagi og:* i Twitter Card, sprawdzi obecność i rozmiar obrazka, oceni kompletność znaczników oraz wyświetli podglądy linków dla Facebook, X (Twitter) i LinkedIn — a także zalecenia dotyczące tego, co dodać. Rejestracja nie jest wymagana. Poniżej znajdziesz wymagane tagi, wymagany rozmiar og:image oraz sposób aktualizacji „zawieszonego” podglądu.
Tworzę strony internetowe od 12 lat i częściej słyszę od klientów pytanie: „Dlaczego link Telegram nie ma obrazka?” niż pytania o rankingi. Zazwyczaj zajmuje to pięć minut – jeśli wiesz, gdzie szukać.
Co sprawdza Open Graph Debugger?
Po wstawieniu linku do posta lub wiadomości platforma przechodzi na stronę i szuka tagów Open Graph. Jeśli znajdzie, losuje odpowiednią kartę. Jeśli nie, pobiera znalezione dane lub wyświetla jedynie adres URL. Narzędzie sprawdza tylko to, co odczytają media społecznościowe.
| Co sprawdza? | Na co on patrzy? | Dlaczego biznes tego potrzebuje? |
|---|---|---|
| Wszystkie tagi og:* | og:tytuł, og:opis, og:obraz, og:url, og:typ, og:nazwa_witryny, og:locale | Na ich podstawie witryny zbierają tytuł, opis i obraz karty. |
| Karta Twittera | twitter:karta, twitter:tytuł, twitter:opis, twitter:obraz | X (Twitter) odczytuje swoje tagi i jeśli ich brakuje, częściowo og |
| Obraz OG | Czy jest zdjęcie i jaki jest jego rozmiar? | Mały obraz zmienia kartę w małą ikonkę z boku |
| Ocena kompletności | Ile zalecanych tagów jest wypełnionych? | Krótkie podsumowanie: czy wszystko jest na swoim miejscu? |
| Podglądy sieciowe | karty dla Facebook, X i LinkedIn | Możesz zobaczyć, jak będzie wyglądał post przed publikacją. |
| Zalecenia | Co powinienem dodać lub poprawić? | Gotowa lista zadań dla programisty lub dla Ciebie |
Jak sprawdzać strony Open Graph online?
- Otwórz Open Graph Debugger.
- Wprowadź adres URL strony, którą chcesz udostępnić: artykułu, produktu lub strony docelowej z reklamą. Kliknij „Sprawdź”.
- Przejrzyj listę tagów: które są ustawione, które puste, a także czy w og:url znajduje się adres obcy lub testowy.
- Sprawdź podgląd każdej sieci: czy tytuł jest ucięty, czy obraz jest widoczny i czy wokół krawędzi znajduje się ważny tekst.
- Proszę dodać brakujące tagi zgodnie z zaleceniami i ponownie sprawdzić stronę.
Strona narzędzi: pole adresu, przycisk „Sprawdź”, lista sprawdzeń i FAQ.
Narzędzie jest lekkie: dzienny limit wystarcza, aby gość mógł sprawdzić wszystkie szablony witryny – stronę główną, kategorię, produkt i artykuł. Po bezpłatnej rejestracji limit jest potrojony.
Jakie są najczęstsze błędy w Open Graph?
Oto, co znajduję na niemal każdej innej stronie i w jakiej kolejności to naprawiam.
- Brakuje elementu og:image lub jest on określony jako względny adres URL. Sieci społecznościowe nie zrozumieją
content="/img/cover.jpg"— wymagany jest pełny adres URL zaczynający się odhttps://. Bez obrazu zasięg posta znacznie spada. - Obraz jest za mały. Logo 200x200 zmienia wizytówkę w mały kwadrat z boku. Potrzebny jest obraz o wymiarach 1200x630.
- Jeden og:image dla całej witryny. Każdy artykuł i każdy produkt w mediach społecznościowych powinien wyglądać tak samo – z logo. W przypadku bloga i katalogu obraz powinien pochodzić z głównego zdjęcia strony.
- og:url prowadzi do innego adresu — strony głównej, domeny testowej lub wersji
http://. Platforma może skonsolidować wszystkie linki na jednej stronie. - Nie ma twitter:card. Bez niego X często wyświetla małą kartę. Aby uzyskać większy obraz, potrzebujesz
summary_large_image. - og:title duplikuje tytuł z „kup” i nazwą marki. W kanale mediów społecznościowych wygląda to jak reklama; żywy nagłówek, jak w poście, jest lepszy.
Minimalny poprawny zestaw wygląda następująco:
<meta property="og:title" content="Как выбрать кожаный рюкзак: 7 признаков качества"> <meta property="og:type" content="article"> <meta property="og:url" content=" https://example.com/blog/kozhanyj-ryukzak/"> <meta property="og:image" content=" https://example.com/img/og/kozhanyj-ryukzak.jpg"> <meta name="twitter:card" content="summary_large_image">Jak przygotować obraz dla og:image?
Obrazek to najbardziej rzucająca się w oczy część karty i to na nim ludzie często oszczędzają. Oto kilka zasad, których przestrzegam:
- Rozmiar zdjęcia to 1200×630, a orientacja jest pozioma. Portal społecznościowy przycina górną i dolną część kwadratowego zdjęcia produktu, co może spowodować, że w produkcie zabraknie głowy lub podeszwy.
- Ważne jest, aby znajdowało się w środku. Różne platformy przycinają krawędzie w różny sposób, a w kanale mobilnym karta jest jeszcze mniejsza. Zachowaj duży rozmiar tekstu i odsuń go od krawędzi.
- Minimalna ilość tekstu. Tytuł znajduje się już pod obrazem; pod samym obrazem nie potrzeba podpisów, wystarczy 3-6 słów lub nie trzeba ich wcale dodawać.
- Lekki plik. Pliki JPG lub PNG o rozsądnym rozmiarze załadują się szybko, a platforma nie będzie miała problemów z limitem czasu.
- Dedykowany obraz dla każdej kluczowej strony. W przypadku artykułów i produktów wygodnie jest utworzyć go automatycznie: okładkę artykułu lub główne zdjęcie produktu.
Dobrym testem jest otwarcie podglądu w debugerze na telefonie. Jeśli link nie jest wyraźny bez powiększenia, obraz wymaga przeróbki.
Jak zaktualizować starą wersję podglądu po zastosowaniu poprawki?
Typowy scenariusz: poprawiłeś tagi, ale portal społecznościowy uparcie wyświetla stary obraz. Przyczyną jest pamięć podręczna: platforma zapamiętała podgląd z pierwszego udostępnienia. Na Facebook pomocne jest ponowne zebranie danych w Sharing Debuggerze, na LinkedInie – w Post Inspector, a na Telegram – w bota @WebpageBot, do którego wysyłasz link. Jeśli wszystko inne zawiedzie, dodaj do adresu nieszkodliwy parametr, taki jak ?v=2: dla platformy jest to nowy link.
Porównanie: Open Graph Debugger i alternatywy
| Narzędzie | Co jest darmowe? | Ograniczenia | Dla kogo jest to odpowiednie? |
|---|---|---|---|
| PromoPilot – Debugger Open Graph | Wszystkie tagi og i Twitter, og:rozmiar obrazu, podglądy dla Facebook, X i LinkedIn, rekomendacje | Nie czyści pamięci podręcznej mediów społecznościowych | Sprawdź swoją stronę bezpośrednio przed jej opublikowaniem w mediach społecznościowych |
| Udostępnianie debugera (meta) | Podgląd Facebook i ponowne zbieranie danych | Tylko Facebook, wymagane logowanie do konta | Zresetuj stary podgląd na Facebook |
| Inspektor postów LinkedIn | Podgląd LinkedIn i odświeżanie pamięci podręcznej | Tylko LinkedIn, wymagane logowanie | Dla tych, którzy promują się na LinkedIn |
| @WebpageBot na Telegram | Aktualizacja podglądu linku w Telegram | Tylko Telegram, nie analizuje tagów | Dla właścicieli kanałów Telegram |
Wniosek: do czyszczenia pamięci podręcznej potrzebne są oficjalne debugery platform, ale każda platforma wyświetla tylko własną sieć. Aby zobaczyć wszystkie podglądy i listę brakujących tagów jednocześnie, wygodniejszy jest uniwersalny debuger.
A tak przy okazji, PromoPilot oferuje 87 darmowych narzędzi SEO. Jeśli jeszcze nie dodałeś tagów, mamy artykuł z naszej serii o generatorze meta tagów, który utworzy blok Open Graph z podglądem.
Czym Open Graph Debugger różni się od analizy meta tagów?
Analiza meta tagów analizuje stronę z punktu widzenia wyszukiwarki: tytuł, opis, tag kanoniczny, hreflang i Open Graph to tylko jedna grupa. Debuger koncentruje się na mediach społecznościowych: tworzy karty dla różnych platform, sprawdza rozmiar obrazów i generuje rekomendacje na podstawie podglądów. Jeśli linki do Twojej witryny są aktywnie udostępniane w mediach społecznościowych i komunikatorach, debugger jest bardziej przydatny.
Oba mają jedno ograniczenie: odczytują kod HTML zwrócony przez serwer. Jeśli tagi są wstawiane przez skrypt przeglądarki, wiele serwisów społecznościowych ich nie widzi – należy to naprawić po stronie witryny. Kolejny szczegół: debuger sprawdza tagi, ale nie samo udostępnianie. Jeśli strona jest zabezpieczona hasłem, ma blokadę geograficzną lub jest chroniona przed botami, serwis społecznościowy może nie mieć do niej dostępu, nawet jeśli wszystkie tagi są obecne.
Kiedy darmowe narzędzie nie wystarcza?
Debuger pokaże, że strona nie ma tagu og:image. Ale jeśli stron jest tysiące, ręczne wstawianie obrazów nie jest możliwe. Specjalista jest potrzebny, gdy:
- każdy produkt lub artykuł powinien mieć własny obraz podglądu, pobierany automatycznie;
- witryna zwraca tagi za pomocą skryptu, a sieci społecznościowe ich nie widzą;
- Uruchamiasz reklamy i mailingi, w których każdy podgląd wpływa na koszt kliknięcia;
- Potrzebujemy kombinacji „strony internetowej + kanału Telegram + automatycznej publikacji” z odpowiednimi kartami.
Co mogę zrobić dla Twojej strony internetowej?
Nazywam się Walerij Danyuk, jestem programistą i specjalistą SEO z 12-letnim doświadczeniem i ponad 200 klientami. Piękny podgląd linku to darmowy zasięg, który dostosowuję do każdego projektu.
SEO i promocja
- Kompleksowy audyt SEO witryny internetowej: sprawdzam wszystkie tagi szablonu, konfiguruję automatyczne podglądy obrazów i poprawiam kod.
Strony internetowe i sklepy internetowe
- Przenoszenie sklepu z Instagram na stronę internetową — produkty z odpowiednim podglądem umożliwiającym łatwe udostępnianie.
- Strona docelowa nowego produktu stworzona w jeden wieczór – studium przypadku NordHarvest z gotową kartą do mediów społecznościowych.
- Strona internetowa kliniki chirurgii plastycznej z wykorzystaniem sztucznej inteligencji i aplikacji dostępnych za pośrednictwem Telegram.
- Strona internetowa na 1001site: podglądy dla mediów społecznościowych i automatyczne publikowanie w Telegram są konfigurowane automatycznie.
Boty i automatyzacja
- Bot Telegram z AI dla sklepu internetowego z sosami.
- QuestFlow to oprogramowanie SaaS Telegram ze sztuczną inteligencją.
- Agenci e-commerce zamiast chatbotów.
Wyślij mi link, który źle wygląda w komunikatorze na Telegram, a powiem ci, którego tagu brakuje.
Wynik
- Kontroler Open Graph online pokazuje, jak link wygląda na Facebook, X i LinkedIn oraz jakich tagów brakuje.
- Wymagane minimum to og:title, og:type, og:image (1200×630, pełny adres) i og:url oraz twitter:card.
- Po naprawieniu zresetuj pamięć podręczną witryn: Sharing Debugger, Post Inspector, @WebpageBot.
- W przypadku katalogu i bloga obrazy podglądowe powinny być gromadzone automatycznie, tak jak na 1001site.
Sprawdź stronę, którą chcesz udostępnić, w bezpłatnym Open Graph Debugger zanim Twoi obserwatorzy zobaczą post.
Źródła
- Strona narzędzia Open Graph Debugger serwisu PromoPilot — lista sprawdzeń i FAQ.
- Open Graph Protocol (ogp.me) — właściwości obowiązkowe i opcjonalne.
- Oficjalnymi narzędziami platformy Meta są Sharing Debugger i LinkedIn Post Inspector.
