Skip to content

Generator Open Graph i meta tagów

Generuj tagi Open Graph, Twitter Card i SEO meta tagi z podglądem na żywo dla Google, Facebooka i X. 100% za darmo, w przeglądarce, bez rejestracji — skopiuj i wklej kod.

Bez śledzenia Działa w przeglądarce Bezpłatne
Wszystko działa w Twojej przeglądarce. Twoja treść i URL obrazu nigdy nie opuszczają tej strony — bez przesyłania, bez rejestracji.
Podstawowe SEO
Open Graph (Facebook, LinkedIn…)
X (Twitter) Card
Zaawansowane i ikony
Sprawdzenia
    Wygenerowane tagi <head> 
     
      
     Importuj z istniejącej sekcji <head> (przetwarzane lokalnie, nic nie jest przesyłane) 
       
     
      
     Zweryfikuj po wdrożeniu: Facebook LinkedIn Google Rich Results 
     
     
      
      
       Wygenerowane tagi i specyfikacje platform zweryfikowano względem protokołu Open Graph (ogp.me), Google Search Central oraz aktualnej dokumentacji udostępniania Facebooka, X, LinkedIn i Discorda. — Go Tools Team · Jul 15, 2026  
          
     
    Czym są meta tagi i Open Graph?
     
     
    Meta tagi to fragmenty kodu HTML w sekcji <head> strony, które opisują ją przeglądarkom, wyszukiwarkom i platformom społecznościowym. Klasyczne tagi SEO to <title>, meta description i link canonical. Tagi Open Graph (og:title, og:type, og:image, og:url i pokrewne) to protokół, pierwotnie stworzony przez Facebooka, który kontroluje tytuł, opis i obraz wyświetlane podczas udostępniania Twojego linku — i odczytuje je niemal każda platforma, w tym LinkedIn, Slack, Discord, WhatsApp, Pinterest i Telegram.
    Twitter/X używa własnych tagów twitter:card, ale w razie ich braku korzysta z Twoich tagów Open Graph, więc dobry zestaw tagów OG plus pojedyncza wartość twitter:card obsługuje każdą sieć. Ten generator zapisuje wszystkie te tagi, dodaje opcjonalne dane strukturalne JSON-LD i pokazuje wynik na żywo — dzięki czemu nigdy nie musisz pisać ich ręcznie ani zgadywać, jak będzie wyglądać udostępnienie.
     
      
      
     
    Specyfikacje obrazów i tagów według platformy
     
     
     
    Open Graph (Facebook i LinkedIn)
     
    Obie platformy odczytują og:title, og:description, og:image i og:url. Zalecany obraz 1200×630 (1,91:1). Facebook buforuje ~30 dni, LinkedIn ~7 dni — po wdrożeniu zeskanuj ponownie za pomocą ich debuggerów.
     
     
    X (Twitter) Card
     
    twitter:card jest wymagany (summary_large_image lub summary). W pozostałych przypadkach X korzysta z og:*. Pojedynczy obraz 1200×630 działa zarówno dla OG, jak i X; obrazy poniżej 300×157 obniżają dużą kartę do małej.
     
     
    Slack i Discord
     
    Slack odczytuje najpierw Twitter Card, potem Open Graph, i może pokazać dwa dodatkowe pola przez twitter:label/data. Discord odczytuje Open Graph i jako jedyny używa theme-color dla paska akcentu w osadzeniu.
     
     
    WhatsApp i Telegram
     
    WhatsApp wymaga og:title i og:image z metadanymi blisko początku kodu HTML; Telegram odczytuje Open Graph i renderuje niezawodnie tylko obrazy JPEG lub PNG.
     
     
    Pinterest Rich Pins
     
    Pinterest odczytuje Open Graph lub Schema.org. Article Rich Pin wymaga og:type=article oraz article:published_time i article:author — wszystko generowane tutaj, gdy wybierzesz typ article.
     
     
    Fragment wyniku wyszukiwania Google
     
    Podgląd SERP na żywo dla komputerów i urządzeń mobilnych mierzy Twój tytuł i opis w pikselach — nie tylko w znakach — więc widzisz ryzyko przycięcia, zanim zrobi to Google.
     
     
     
          
     
    Przykłady meta tagów
     
     
     
    Strona główna witryny
     
     
    Title: Acme — Ship faster
Description: The all-in-one platform for modern teams.
URL: https://acme.com
Image: https://acme.com/og/home.png (1200×630)
     
    <title>Acme — Ship faster</title>
<meta name="description" content="The all-in-one platform for modern teams.">
<link rel="canonical" href="https://acme.com">

<meta property="og:title" content="Acme — Ship faster">
<meta property="og:type" content="website">
<meta property="og:image" content="https://acme.com/og/home.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:url" content="https://acme.com">

<meta name="twitter:card" content="summary_large_image">
     
     
    Strona główna potrzebuje tylko czterech wymaganych tagów Open Graph oraz tytułu, opisu i tagu canonical. Ponieważ obraz ma 1200×630, szerokość i wysokość są uzupełniane automatycznie, więc już pierwsze udostępnienie na Facebooku renderuje się natychmiast, a nie jako puste.
     
     
    Artykuł na blogu (z article:* + JSON-LD)
     
     
    og:type: article
Title: The Complete Guide to Open Graph Tags
Author: Ada Lovelace
Published: 2026-07-15
     
    <meta property="og:title" content="The Complete Guide to Open Graph Tags">
<meta property="og:type" content="article">
<meta property="og:image" content="https://blog.example.com/og/guide.png">
<meta property="og:url" content="https://blog.example.com/open-graph-guide">
<meta property="article:published_time" content="2026-07-15T00:00:00Z">
<meta property="article:author" content="Ada Lovelace">

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

<script type="application/ld+json">{ "@type": "Article", "headline": "The Complete Guide to Open Graph Tags", "datePublished": "2026-07-15T00:00:00Z" }</script>
     
     
    Wybór typu article odblokowuje właściwości article:published_time i article:author oraz generuje pasujące dane JSON-LD typu Article, dzięki czemu wyszukiwarki i Pinterest Rich Pins otrzymują dane strukturalne za darmo.
     
     
    Twitter/X dziedziczy z Open Graph
     
     
    twitter:card: summary_large_image
Inherit title/description/image from OG: on
     
    <meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@acme">
     
     
    X odczytuje Twoje tagi Open Graph, gdy brakuje odpowiadającego tagu twitter:*, więc potrzebujesz tylko twitter:card. Generator nigdy nie tworzy pustego twitter:image, który zepsułby ten mechanizm rezerwowy.
     
     
     
          
     
    Jak dodać tagi Open Graph do swojej strony
     
       
    1.  1 
       
      Wpisz tytuł, opis i adres URL
       
      Wpisz tytuł strony, meta description i adres canonical. Miernik pikseli pokazuje, czy zmieszczą się w fragmencie wyniku wyszukiwania Google.
       
       
    2.  2 
       
      Dodaj og:image i wybierz typ
       
      Wklej URL obrazu 1200×630 i wybierz website, article, product lub profile — pasujące pola Open Graph i JSON-LD pojawią się automatycznie.
       
       
    3.  3 
       
      Sprawdź podglądy na żywo
       
      Przełączaj się między zakładkami Google, Facebook, X, LinkedIn, Slack i Discord, aby zobaczyć dokładnie, jak Twój link będzie wyglądał, zanim go opublikujesz.
       
       
    4.  4 
       
      Skopiuj do sekcji 
       
      Skopiuj cały blok tagów (lub jedną sekcję) i wklej go wewnątrz sekcji  swojego HTML. Po wdrożeniu zweryfikuj za pomocą debuggerów Facebooka i LinkedIn.
       
       
      5.  
     
      
     
    Częste błędy Open Graph
     
     
     
    Względna ścieżka og:image
     
    Ścieżka taka jak /cover.png działa w Twoim edytorze, ale jest pusta podczas udostępniania, ponieważ roboty potrzebują bezwzględnego adresu URL.
     
     
     ✗ Niepoprawne 
    <meta property="og:image" content="/cover.png">
     
     
     ✓ Poprawne 
    <meta property="og:image" content="https://example.com/cover.png">
     
     
     
     
    Brak og:url
     
    Bez kanonicznego og:url liczby udostępnień rozdzielają się między warianty adresu URL, a platformy mogą wybrać niewłaściwy adres.
     
     
     ✗ Niepoprawne 
    <!-- no og:url -->
     
     
     ✓ Poprawne 
    <meta property="og:url" content="https://example.com/page">
     
     
     
     
    Obraz za mały lub o błędnych proporcjach
     
    Facebook ignoruje obrazy poniżej 200×200 i przycina wszystko, co znacznie odbiega od 1,91:1.
     
     
     ✗ Niepoprawne 
    600×600 og:image
     
     
     ✓ Poprawne 
    1200×630 og:image (1.91:1)
     
     
     
     
    Pominięcie twitter:card
     
    Nawet przy pełnych tagach Open Graph X nie wyrenderuje karty, jeśli nie ustawiono twitter:card.
     
     
     ✗ Niepoprawne 
    <!-- OG only, no twitter:card -->
     
     
     ✓ Poprawne 
    <meta name="twitter:card" content="summary_large_image">
     
     
     
     
    Puste twitter:image psuje mechanizm rezerwowy
     
    Puste twitter:image uniemożliwia X skorzystanie z og:image — pomiń ten tag zamiast zostawiać go pustym.
     
     
     ✗ Niepoprawne 
    <meta name="twitter:image" content="">
     
     
     ✓ Poprawne 
    <!-- omit it; X uses og:image -->
     
     
     
     
    Zbyt późno umieszczony charset
     
    Deklaracja charset musi pojawić się w pierwszych 1024 bajtach dokumentu, inaczej zostanie zignorowana.
     
     
     ✗ Niepoprawne 
    <meta charset> after many tags
     
     
     ✓ Poprawne 
    <meta charset="utf-8"> first in <head>
     
     
     
     
     
      
     
    Częste zastosowania
     
     
     
    Uruchamianie strony docelowej
     
    Wygeneruj cały blok head dla nowej strony marketingowej, aby wyglądała profesjonalnie w chwili, gdy ktoś udostępni link na X, LinkedIn lub Slacku.
     
     
    Podglądy blogów i artykułów
     
    Dodaj article:published_time, article:author i JSON-LD typu Article, aby wpisy kwalifikowały się do Pinterest Rich Pins i bogatych kart społecznościowych.
     
     
    Naprawa uszkodzonego udostępnienia
     
    Zaimportuj swoje aktualne tagi, wypatrz brakujący og:image lub błędny wymiar w panelu sprawdzeń, popraw go i zeskanuj ponownie za pomocą linków do debuggerów.
     
     
    Fragmenty head dla frameworków
     
    Skopiuj czysty, poprawny zestaw tagów do wklejenia na statyczną stronę, do szablonu CMS lub do renderowanego po stronie serwera fragmentu head.
     
     
     
      
     
    Jak działa generator
     
     
     
    Podgląd na żywo w przeglądarce
     
    Każda karta jest renderowana z wpisywanych przez Ciebie wartości, nigdy przez pobieranie Twojego adresu URL. Dzięki temu podglądy są natychmiastowe i prywatne, a to jedyny uczciwy sposób na podgląd przed wdrożeniem strony.
     
     
    Miernik SERP z dokładnością do piksela
     
    Google przycina tytuły i opisy według szerokości w pikselach, a nie liczby znaków. Element canvas mierzy Twój tekst tą samą czcionką, więc miernik zmienia kolor na bursztynowy dokładnie wtedy, gdy fragment zostałby przycięty.
     
     
    Sprawdzanie obrazu po stronie klienta
     
    URL Twojego og:image jest wczytywany do obiektu Image w Twojej przeglądarce, aby odczytać jego rzeczywistą szerokość i wysokość, a następnie porównać z 1200×630 i proporcjami karty. Obrazy z innych domen również raportują swój rozmiar, więc sprawdzenie działa bez żadnego przesyłania.
     
     
    Kompletny, nowoczesny zestaw tagów
     
    Podstawowe SEO, Open Graph, Twitter Card i JSON-LD w jednym bloku, z deklaracją charset na początku, aby zmieściła się w pierwszych 1024 bajtach. Przestarzałe tagi, takie jak meta keywords, są domyślnie wyłączone.
     
     
     
      
     
    Najlepsze praktyki dla meta tagów
     
     
     
    Używaj bezwzględnych adresów HTTPS
     
    og:image i og:url muszą być pełnymi adresami https://… Ścieżki względne działają lokalnie, ale renderują się jako puste, gdy robot pobiera stronę na żywo.
     
     
    Zawsze ustawiaj og:image:width i height
     
    Zadeklarowanie wymiarów pozwala platformom natychmiast rozmieścić kartę, więc pierwsze udostępnienie nie jest puste, gdy asynchronicznie pobierają obraz.
     
     
    Trzymaj canonical i og:url takie same
     
    Kieruj oba na jeden adres canonical, aby liczby udostępnień i sygnały wyszukiwania nie rozdzielały się między warianty adresu URL.
     
     
    Pisz z myślą o budżecie pikseli
     
    Celuj w tytuł około 50–60 znaków i opis około 155 — ale zaufaj miernikowi pikseli, ponieważ Google mierzy szerokość, a nie liczbę znaków.
     
     
    Renderuj tagi po stronie serwera
     
    Roboty Facebooka, LinkedIn, WhatsAppa, Telegrama i Discorda nie uruchamiają JavaScriptu, więc tagi Open Graph muszą znajdować się w statycznym lub renderowanym po stronie serwera kodzie HTML.
     
     
     
      
     
    Najczęściej zadawane pytania
     
     
     Czym jest generator meta tagów? 
     Generator meta tagów tworzy tagi HTML, które umieszczasz wewnątrz sekcji <head> strony — <title>, meta description, link canonical, tagi Open Graph dla Facebooka i LinkedIn oraz tagi Twitter/X Card. To narzędzie generuje je wszystkie naraz, pokazuje podgląd na żywo tego, jak Twój link będzie wyglądał w Google, na Facebooku, X, LinkedIn, Slacku i Discordzie, i pozwala skopiować kod jednym kliknięciem. Wszystko działa w Twojej przeglądarce. 
     
     Jak dodać tagi Open Graph do swojej strony? 
     Wypełnij tytuł, opis, adres canonical oraz URL og:image, wybierz typ Open Graph, a następnie skopiuj wygenerowane tagi i wklej je wewnątrz sekcji <head> swojego kodu HTML. Ponieważ roboty Facebooka, LinkedIn, WhatsAppa i Telegrama nie uruchamiają JavaScriptu, tagi muszą znajdować się w statycznym lub renderowanym po stronie serwera kodzie HTML, a nie być wstrzykiwane przez skrypty po stronie klienta. 
     
     Jaki rozmiar powinien mieć obraz Open Graph? 
     Zalecany rozmiar og:image to 1200×630 pikseli, czyli proporcje 1,91:1, które spełniają też wymagania karty summary_large_image w X. Facebook ignoruje obrazy mniejsze niż 200×200 i pokazuje mały kwadrat dla wszystkiego poniżej 600×315. Zawsze podawaj og:image:width i og:image:height, aby pierwsze udostępnienie renderowało się natychmiast, i udostępniaj obraz przez HTTPS pod publicznym adresem URL, który nie jest blokowany przez robots.txt. 
     
     Czy tag twitter:card jest wymagany? 
     Tak — twitter:card to jedyny tag Twitter/X, który musisz uwzględnić, w przeciwnym razie X nie wyrenderuje karty, nawet gdy Twoje tagi Open Graph są obecne. Ustaw go na summary_large_image dla dużego obrazu lub summary dla małej kwadratowej miniatury. W przypadku pozostałych elementów (tytuł, opis, obraz) X korzysta z Twoich tagów og:*, więc to narzędzie domyślnie je pomija, aby kod pozostał czysty. 
     
     Czy meta tagi pomagają w SEO? 
     Tag <title> i canonical mają znaczenie dla SEO; meta description nie jest bezpośrednim czynnikiem rankingowym, ale wpływa na klikalność, kształtując fragment wyniku wyszukiwania. Tagi Open Graph i Twitter Card nie wpływają na pozycję w Google, ale kontrolują wygląd Twoich linków podczas udostępniania, co napędza ruch z social mediów. Google może przepisać Twój tytuł w wynikach, więc napisz go jasno i unikatowo, umieszczając najważniejsze słowa na początku. 
     
     Czy to narzędzie przesyła moją treść lub obrazy? 
     Nie. Wszystko jest generowane lokalnie w Twojej przeglądarce za pomocą JavaScriptu. Twój tytuł, opis i URL obrazu nigdy nie opuszczają strony — nie ma serwera, przesyłania ani konta. Obraz og:image jest wczytywany wyłącznie w Twojej własnej przeglądarce, aby go podejrzeć i odczytać jego wymiary. 
     
     Czy mogę zaimportować meta tagi, które już mam? 
     Tak. Otwórz panel importu, wklej swoje istniejące tagi <meta>, a narzędzie przetworzy je lokalnie za pomocą wbudowanego parsera HTML przeglądarki, aby wypełnić formularz — bez żadnego zapytania sieciowego, bez przesyłania czegokolwiek. To alternatywa stawiająca prywatność na pierwszym miejscu wobec narzędzi, które pobierają adres URL na żywo ze swojego serwera. 
     
     Dlaczego mój zaktualizowany podgląd wciąż pokazuje stary obraz na Facebooku lub LinkedIn? 
     Platformy buforują dane Open Graph: Facebook przez około 30 dni, LinkedIn przez około 7 dni. Po wdrożeniu ponownie zeskanuj stronę za pomocą Facebook Sharing Debugger lub LinkedIn Post Inspector, aby odświeżyć zbuforowany tytuł, opis i obraz. Linki do debuggerów znajdziesz pod wygenerowanym kodem. 
     
     
     
     
       
      
     
     
    Powiązane narzędzia
      Zobacz wszystkie narzędzia →
 
     
      
     
      
      
      
     
     
    Generator i konstruktor poleceń cURL
     
     
    Web & API
     
    Twórz polecenia curl w przeglądarce — ustaw metodę, nagłówki, autoryzację i treść, a gotowe polecenie pojawi się natychmiast. Presety dla Bearer, POST JSON i przesyłania plików. Bezpłatnie, prywatnie, bez rejestracji.
     
     
       
          
     
      
      
      
     
     
    Generator htpasswd — bcrypt, Apache MD5 (apr1) i Basic Auth
     
     
    Web & API
     
    Generuj wpisy htpasswd z bcrypt, Apache MD5 (apr1), SHA-1 i innymi algorytmami. Gotowe bloki konfiguracji dla Apache, nginx i Docker. 100% w Twojej przeglądarce — bez przesyłania danych.
     
     
       
          
     
      
      
      
     
     
    Konwerter systemów liczbowych — binary, hex, decimal i octal
     
     
    Narzędzia konwersji
     
    Konwertuj między systemami binarnym, szesnastkowym, dziesiętnym i ósemkowym (2–36) w czasie rzeczywistym. Bezpłatnie i prywatnie — w przeglądarce.
     
     
       
          
     
      
      
      
     
     
    Koder i dekoder Base64
     
     
    Kodowanie i formatowanie
     
    Zakoduj i zdekoduj Base64 online za darmo. Konwersja w czasie rzeczywistym z pełną obsługą UTF-8 i emoji. 100% w przeglądarce, bez rejestracji.
     
     
       
          
     
      
      
      
     
     
    Konwerter Base64 na obraz
     
     
    Kodowanie i formatowanie
     
    Zdekoduj ciąg Base64 lub data URI z powrotem na obraz w przeglądarce. Podejrzyj, odczytaj wymiary i MIME, a potem pobierz jako PNG, JPG, GIF, SVG. Bez przesyłania.
     
     
       
          
     
      
      
      
     
     
    Generator i weryfikator skrótów bcrypt
     
     
    Narzędzia bezpieczeństwa
     
    Generuj i weryfikuj skróty bcrypt haseł online — regulowany koszt, prefiksy $2b$/$2a$/$2y$. W 100% w przeglądarce; Twoje hasło nigdy nie jest wysyłane.