Podgląd Open Graph i karty społecznościowej

Zobacz podgląd tego, jak link rozwija się w kartę społecznościową na X, LinkedIn, Slacku, Discordzie i Facebooku na podstawie tytułu, opisu, adresu URL obrazu i adresu URL strony.

Ładowanie narzędzia…

Podgląd Open Graph i karty społecznościowejPodgląd Open Graph i karty społecznościowej pokazuje, jak będzie wyglądał Twój link po udostępnieniu na platformach społecznościowych. Wpisz tytuł, opis, adres URL obrazu i adres URL strony, a następnie przełączaj się między X, LinkedIn, Slackiem, Discordem i Facebookiem, aby zobaczyć na żywo makietę karty linku dla każdej z nich. Wszystko renderuje się w Twojej przeglądarce — Twój tekst nigdy nie jest przesyłany, a adres URL obrazu jest ładowany do podglądu bezpośrednio z jego hosta, a nie przez nasze serwery.

Czym jest Podgląd Open Graph i karty społecznościowej?

To wizualne narzędzie do podglądu kart Open Graph (OG) i społecznościowych. Metatagi Open Graph i Twitter Card mówią platformom, jaki tytuł, podsumowanie i obraz wyświetlić, gdy ktoś udostępnia Twój link, a to narzędzie odtwarza tę kartę linku, abyś mógł ją sprawdzić przed publikacją. Marketerzy, autorzy treści i deweloperzy używają go przy uruchamianiu wpisu na blogu, strony docelowej lub strony produktu, aby potwierdzić, że nagłówek nie jest ucięty, obraz wypełnia ramkę, a domena czyta się poprawnie. Wybierz platformę za pomocą kontrolki segmentowej, aby zobaczyć jej konkretny układ: X, Facebook i LinkedIn renderują duży obraz baneru z tytułem i opisem poniżej, podczas gdy Slack i Discord pokazują kompaktową kartę z paskiem akcentu, domeną i małą miniaturą. Wiersz domeny jest wyprowadzany automatycznie z adresu URL strony. Narzędzie tylko modeluje kartę na podstawie wprowadzonych wartości — nie indeksuje Twojej działającej strony ani nie odczytuje jej istniejących metatagów.

Jak używać Podgląd Open Graph i karty społecznościowej

  1. Wprowadź tytuł strony, który ma się pojawić jako nagłówek karty.
  2. Napisz opis (wiersz podsumowania wyświetlany pod tytułem).
  3. Wklej bezwzględny adres URL obrazu (najlepiej 1200×630), aby załadować obraz podglądu.
  4. Wprowadź adres URL strony — domena pokazywana na karcie jest z niego wyprowadzana.
  5. Przełączaj się między X, LinkedIn, Slackiem, Discordem i Facebookiem, aby porównać układ każdej platformy.
  6. Dostosowuj tytuł i opis, aż nic nie będzie ucięte, a karta będzie wyglądać dobrze.

Przykłady

Karta wpisu na blogu

Tytuł 'How to Bake Sourdough', krótki opis, obraz og.png oraz adres URL https://blog.example.com/sourdough renderują się na X jako duża karta banerowa z domeną blog.example.com nad nagłówkiem.

Rozwinięcie Slack/Discord

Po przełączeniu na Slacka te same wartości pokazują się jako kompaktowa karta z paskiem akcentu po lewej, domeną, tytułem i małą kwadratową miniaturą po prawej.

Brak obrazu

Pozostaw adres URL obrazu pusty, a podgląd pokaże ramkę zastępczą o właściwych proporcjach, abyś nadal mógł ocenić odstępy i układ tekstu.

Najczęściej zadawane pytania

Które platformy mogę podejrzeć?
Pięć: X (Twitter), LinkedIn, Slack, Discord i Facebook. X, Facebook i LinkedIn są rysowane jako karty banerowe z dużym obrazem, podczas gdy Slack i Discord używają kompaktowego stylu rozwinięcia z paskiem akcentu i małą miniaturą. Użyj przełącznika platformy, aby błyskawicznie się między nimi przełączać.
Czy odczytuje tagi Open Graph z mojej działającej strony?
Nie. Nie indeksuje ani nie pobiera Twojej strony i nie analizuje jej istniejących metatagów. Buduje kartę wyłącznie na podstawie tytułu, opisu, adresu URL obrazu i adresu URL strony, które wpisujesz, więc jest to podgląd typu „co by było, gdyby”, a nie walidator opublikowanej strony.
Skąd pochodzi obraz podglądu?
Obraz jest ładowany bezpośrednio przez Twoją przeglądarkę z wprowadzonego adresu URL obrazu — trafia z hosta samego obrazu do Twojej przeglądarki, a nie przez nasze serwery. Jeśli obraz się nie pojawia, sprawdź, czy adres URL jest bezwzględny (zaczyna się od https://) i publicznie dostępny.
Dlaczego mój tytuł lub opis jest ucięty na karcie?
Platformy społecznościowe skracają długie tytuły i opisy, a podgląd naśladuje to, ograniczając liczbę wierszy. Jeśli tekst jest ucięty tutaj, prawdopodobnie zostanie ucięty również przy udostępnianiu, więc skróć go, aż się zmieści.
Czy moje dane są wysyłane na serwer?
Nie. Tytuł, opis i adresy URL, które wpisujesz, pozostają w Twojej przeglądarce i nigdy nie są przez nas przesyłane, rejestrowane ani przechowywane. Jedynym żądaniem zewnętrznym jest pobranie przez Twoją przeglądarkę obrazu podglądu z podanego adresu URL, co jest normalnym zachowaniem przeglądarki.

Powiązane narzędzia