Przejdź do treści

Podgląd tagów Open Graph i meta

Zobacz, jak link wygląda w Google, Facebooku, X, LinkedIn, Slacku, Discordzie i iMessage. Nasz serwer pobiera publiczną stronę, by odczytać jej tagi, albo napisz nowe tagi w przeglądarce.

Serwer pobiera stronę jednorazowo, aby odczytać jej tagi; nic nie jest zapisywane.

Przetwarzane na naszym serwerze · adres URL jest pobierany na żądanie i nic nie jest zapisywaneJak to działa

Jak korzystać: Podgląd Open Graph i tagów meta

  1. 1

    Wklej link

    Wpisz adres publicznej strony i kliknij Podgląd linku, aby odczytać jej tytuł, opis oraz tagi Open Graph i karty X.

  2. 2

    Sprawdź karty

    Porównaj wynik w Google oraz karty w stylu Facebooka, X, LinkedIna, Slacka, Discorda i iMessage, a potem przejrzyj listę brakujących lub słabych tagów.

  3. 3

    Edytuj tagi

    Kliknij Edytuj te tagi lub otwórz Napisz tagi, aby zmienić tytuł, opis i obraz. Wszystkie podglądy odświeżają się na bieżąco, w trakcie pisania.

  4. 4

    Skopiuj na stronę

    Skopiuj wygenerowane tagi meta do sekcji head swojej strony, opublikuj ją i sprawdź ponownie działający adres URL.

Limity i Pro

Za darmo: 20 podglądów adresów URL na minutę, strony do 3 MB kodu HTML z limitem czasu 12 sekund, 7 podglądów platform dla każdego linku i nielimitowana edycja tagów.

O narzędziu: Podgląd Open Graph i tagów meta

Podgląd tagów meta pokazuje, jak będzie wyglądać link, zanim go udostępnisz. Odczytuje tagi, z których powstają podglądy linków: tytuł HTML i opis meta, tagi Open Graph, takie jak og:title, og:description, og:image i og:site_name, tagi karty X, np. twitter:card, oraz kolor motywu, którego Discord używa na pasku osadzenia. Następnie rysuje siedem podglądów: wynik wyszukiwania Google, posty z linkiem na Facebooku i LinkedInie, kartę X w formacie z dużym obrazem lub w formacie podsumowania, rozwinięcie linku w Slacku, osadzenie w Discordzie oraz dymek w stylu iMessage.

Gdy jakiegoś pola brakuje, podglądy korzystają z zamienników, tak jak robi to większość platform, na przykład zamiast og:title biorą tytuł strony, a w ostrzeżeniach zaznaczamy źródło. Sprawdzamy też obraz: jego rozmiar w pikselach i typ odczytujemy z nagłówka pliku, więc dowiesz się, czy jest mniejszy niż minimum Facebooka (200 × 200), większy niż limit X (5 MB), czy to nieobsługiwany plik SVG albo czy ma złe proporcje dla dużej karty 2:1.

Zakładka Napisz tagi działa bez pobierania czegokolwiek i tworzy gotowy blok tagów meta. Podglądy są przybliżone: platformy zmieniają wygląd kart, przechowują je w pamięci podręcznej przez kilka dni, a niektóre pokazują zalogowanym osobom inny tekst. Aby odświeżyć kartę, która została już udostępniona, po publikacji użyj narzędzia diagnostycznego danej platformy.

Prywatność

W trybie Sprawdź adres URL adres trafia na nasz serwer, który jednorazowo pobiera stronę oraz pierwsze bajty obrazu og:image, aby odczytać tagi i rozmiar obrazu. Nic nie jest zapisywane ani logowane. Obrazy w podglądach wczytuje Twoja przeglądarka, prosto z serwisu, który je udostępnia. Napisz tagi działa wyłącznie w przeglądarce.

Funkcje

Siedem podglądów

Karty Google, Facebooka, X, LinkedIna, Slacka, Discorda i w stylu iMessage obok siebie.

Kontrola og:image

Rozmiar w pikselach, typ i wielkość pliku odczytane z samego obrazu, wraz z minimami platform.

Generator tagów

Wpisz tytuł, opis i obraz, a potem skopiuj gotowy blok tagów Open Graph i karty X.

Podgląd Open Graph i tagów meta: najczęstsze pytania

Które tagi decydują o wyglądzie udostępnianego linku?
Większość aplikacji czyta tagi Open Graph: og:title, og:description, og:image, og:url i og:site_name. X używa twitter:card do wyboru małej lub dużej karty, a resztę bierze z Open Graph. Wyszukiwarka Google korzysta natomiast z tytułu HTML i opisu meta. Ustaw wszystkie. To narzędzie generuje pełny zestaw w zakładce Napisz tagi.
Jaki rozmiar powinien mieć og:image?
Użyj obrazu 1200 × 630 pikseli, o proporcjach 1,91:1, w formacie PNG, JPEG lub WebP, do 5 MB. Wypełni on duże karty na Facebooku, LinkedInie, Slacku i Discordzie. X lekko przycina go do 2:1 w kartach z dużym obrazem, więc trzymaj tekst z dala od krawędzi. Obrazy węższe niż 600 pikseli mogą wyglądać jak małe miniatury, a pliki SVG nie są obsługiwane.
Dlaczego Facebook lub LinkedIn nadal pokazuje stary podgląd?
Platformy zapisują podglądy linków w pamięci podręcznej, często na kilka dni, gdy ktoś po raz pierwszy udostępni dany adres. Po zmianie tagów poproś platformę o ponowne pobranie strony w narzędziu Sharing Debugger Facebooka lub Post Inspector LinkedIna. Slack, Discord i iMessage też zapamiętują podglądy i zwykle odświeżają je po czasie albo gdy zmieni się adres, na przykład przez dodanie parametru zapytania.
Czy coś jest zapisywane, gdy sprawdzam adres URL?
Nie. Przeglądarka wysyła adres na nasz serwer, który pobiera stronę i pierwsze 256 KB obrazu og:image wyłącznie po to, by odczytać tagi i rozmiar obrazu, a potem zwraca wynik. Nic nie jest zapisywane ani logowane. Obrazy w podglądach wczytuje Twoja przeglądarka, bezpośrednio z witryny, tak samo jak działałoby to w prawdziwych aplikacjach.
Dlaczego podgląd nie może odczytać mojej strony?
Strona musi być publicznie dostępna przez http lub https. Ze względów bezpieczeństwa odrzucamy adresy prywatne i z sieci lokalnej. Strony wymagające logowania lub blokujące boty zwracają stronę logowania albo weryfikacji. Tagi dodawane później przez JavaScript nie są widoczne, bo serwer czyta surowy kod HTML, jak większość robotów serwisów społecznościowych. Umieść tagi w HTML generowanym na serwerze.