Generator tagów Open Graph
Wypełnij tytuł, opis, kanoniczny (canonical) URL, obraz podglądu i og:type, a ten generator zapisze odpowiednie tagi <meta> Open Graph, gotowe do wklejenia w sekcji <head> Twojej strony. Pola pozostawione puste są po prostu pomijane, a cudzysłowy i znaki & w Twoim tekście są escapowane, aby znaczniki pozostały poprawne. Generator zapisuje tylko pięć podstawowych właściwości og:, a nie tagi Twitter Card ani tagi artykułu.
Jak utworzyć swoje tagi OG
-
1
Wybierz og:type
website dla stron głównych, article dla wpisów, product dla stron sklepu, video.other dla osadzeń. To pole jest tekstem swobodnym, więc zadziała dowolna poprawna wartość og:type.
-
2
Wypełnij kluczowe pola
Tytuł, opis, kanoniczny URL i bezwzględny URL obrazu. Każde pole pozostawione puste jest pomijane w wyniku.
-
3
Wygeneruj tagi
Cudzysłowy i znaki & są escapowane za Ciebie, a dla każdego wypełnionego pola otrzymujesz jeden wiersz meta.
-
4
Skopiuj blok do sekcji head
Wklej go do `<head>` szablonu Twojej strony, powyżej wszelkich istniejących tagów społecznościowych.
Tagi generowane przez ten generator
<meta property="og:type" content="article">
<meta property="og:title" content="Your page title">
<meta property="og:description" content="A one-line description.">
<meta property="og:url" content="https://example.com/post/123">
<meta property="og:image" content="https://example.com/og-image.jpg">
To cały wynik. og:type jest zapisywany zawsze, a og:title, og:description, og:url i og:image są dodawane tylko wtedy, gdy je wypełnisz. Tych pięć właściwości Facebook, LinkedIn, Slack, Discord, WhatsApp i X czytają jako pierwsze, więc pokrywają najczęstszy przypadek.
Generator nie zapisuje tagów kart twitter:, og:image:width / og:image:height, og:site_name, og:locale ani tagów article:. Jeśli ich potrzebujesz, dodaj je ręcznie obok wygenerowanego bloku.
Ważne wartości og:type
| Typ | Kiedy używać |
|---|---|
| website | Strona główna, strony docelowe, treść statyczna |
| article | Wpisy na blogu, wiadomości, strony redakcyjne |
| product | Strony szczegółów produktu w e-commerce |
| video.other | Treści wideo i osadzenia |
| profile | Strony profili autorów lub użytkowników |
| music.song | Strony pojedynczych utworów |
Tagi, które warto dodać ręcznie
| Tag | Do czego służy | Przykładowa wartość |
|---|---|---|
og:site_name |
Nazwa całej witryny | Example |
og:locale |
Język i region strony | en_US |
og:image:width |
Pomaga scraperom szybciej rozmieścić kartę | 1200 |
og:image:height |
Pomaga scraperom szybciej rozmieścić kartę | 630 |
twitter:card |
Układ karty na X | summary_large_image |
X wraca do tagów og:, gdy nie ma tagów twitter:, więc strona zawierająca tylko pięć wygenerowanych właściwości nadal poprawnie wyświetla podgląd również tam. Dodawaj tagi twitter: tylko wtedy, gdy chcesz innego tytułu, opisu lub obrazu konkretnie na X.
Częste błędy, których pomaga uniknąć ten generator
namezamiastproperty. Właściwości Open Graph należą doproperty="og:...". Generator zawsze zapisuje poprawny atrybut.- Nieescapowane cudzysłowy i znaki &. Surowy znak
"lub&w Twoim tytule psuje tag. Generator escapuje je za Ciebie. - Względne adresy URL obrazów. Scrapery społecznościowe przyjmują tylko bezwzględne adresy URL. Wklej pełny adres
https://obrazu, ponieważ generator nie dodaje Twojej domeny. - Nieprawidłowy rozmiar obrazu. 1200 × 630 pikseli to uniwersalnie bezpieczny rozmiar. Poniżej 200 × 200 pikseli obraz jest zwykle odrzucany.
Najczęściej zadawane pytania
W sekcji <head> Twojego HTML, wysoko, najlepiej w pobliżu <title>. Scrapery czytają head i często zatrzymują się wcześnie, więc trzymanie tagów OG blisko góry zapobiega ich pominięciu na bardzo dużych stronach.
Nie. Zapisuje tylko pięć podstawowych właściwości og:. X wraca do Open Graph, gdy brakuje tagów twitter:, więc Twój podgląd nadal działa. Dodawaj tagi twitter: ręcznie tylko wtedy, gdy chcesz innego tytułu, opisu lub obrazu na X.
1200 × 630 pikseli, JPG lub PNG, to uniwersalnie bezpieczny rozmiar. Działa na Facebooku, LinkedIn, dużych kartach X, Slacku, Discordzie i iMessage. Cokolwiek mniejszego niż 200 × 200 pikseli ryzykuje całkowite odrzucenie.
Nadaj każdej wersji językowej własną stronę z własnymi tagami og: i dodaj og:locale (na przykład en_US) oraz og:locale:alternate dla innych wersji ręcznie. Ten generator nie zapisuje za Ciebie tagów locale.
Powiązane narzędzia
Sprawdzanie długości meta opisu
Zmierz meta opis w znakach i szacowanych pikselach, porównaj wskazówki redakcyjne i przejrzyj makiety na komputer i telefon.
Sprawdzacz indeksowalności
Sprawdź, czy adres URL może zostać indeksowany: plik robots.txt, metaparametry robots, tag X-Robots, sygnały kanoniczne oraz stan HTTP.
Ekstraktor linków zewnętrznych
Wklej surowy kod HTML, opcjonalnie podaj adres URL podstawowy i otrzymaj czystą, bez duplikatów listę wszystkich zewnętrznych linków http/https w kodzie, na potrzeby audytów linków i analiz SEO.
Tester nagłówków bezpieczeństwa HTTP
Wklej nagłówki odpowiedzi HTTP i lokalnie sprawdź HSTS, CSP, ochronę ramek, MIME, referrer oraz zasady cross-origin.
Symulator wyników Google
Wyświetl przybliżony snippet w stylu Google z limitami znaków dla telefonu i komputera. Szkic pozostaje w tej sesji przeglądarki.
Sprawdzanie URL canonical
Wklej HTML strony i sprawdź jej tag rel=canonical: czy jest obecny, czy jest poprawnym absolutnym URL-em, czy zgadza się z URL-em strony?
Narzędzie jest dostępne w innych językach
- مولّد وسوم Open Graph [AR]
- Générateur de balises Open Graph [FR]
- Open Graph-taggenerator [SV]
- Open-Graph-Tags-Generator [DE]
- เครื่องมือสร้างแท็ก Open Graph [TH]
- Generator Tag Open Graph [ID]
- Open Graph タグジェネレーター [JA]
- Open Graph 태그 생성기 [KO]
- Open Graph-taggenerator [NL]
- Trình tạo thẻ Open Graph [VI]
- Generador de etiquetas Open Graph [ES]
- Gerador de tags Open Graph [PT]
- Open Graph Tags Generator [EN]
- Generatore di tag Open Graph [IT]
- Генератор тегов Open Graph [RU]
- Open Graph Etiketleri Oluşturucu [TR]
- Open Graph 标签生成器 [ZH]