Blog Siteor

Wiedza o CMS, stronach i dobrych praktykach.

Aktualności o Siteor CMS - nowe funkcje, porady dla redaktorów stron, SEO, wielojęzyczność i integracje z AI.

Wróć do listy

Open Graph i Twitter Cards - automatyczne social preview w CMS

2026-05-21 ·Zespół Intum
Open Graph i Twitter Cards - automatyczne social preview w CMS

Udostępniasz link do strony na Facebooku. Zamiast ładnego podglądu z tytułem, opisem i obrazkiem pojawia się goły URL albo losowy fragment tekstu ze strony. Brzmi znajomo?

To problem brakujących tagów Open Graph. Siteor CMS rozwiązuje go automatycznie.

Czym jest Open Graph

Open Graph (OG) to protokół stworzony przez Facebooka w 2010 roku. Definiuje zestaw tagów meta w sekcji <head> strony, które mówią serwisom społecznościowym jak wyświetlić podgląd udostępnionego linku.

Najważniejsze tagi:

  • og:title - tytuł widoczny w podglądzie
  • og:description - krótki opis pod tytułem
  • og:url - kanoniczny URL strony
  • og:type - typ treści (website dla stron, article dla artykułów)
  • og:site_name - nazwa witryny
  • og:image - miniaturka, najlepsza proporcja to 1200x630px

Te same tagi rozumieją Facebook, LinkedIn, Slack, Discord, Telegram i wiele innych serwisów.

Twitter Card

Twitter (X) używa własnego zestawu tagów, ale zasada jest ta sama. Siteor CMS generuje oba formaty jednocześnie:

  • twitter:card - typ karty (summary_large_image gdy jest obrazek, summary bez)
  • twitter:title - tytuł
  • twitter:description - opis
  • twitter:image - miniaturka

Jak to działa w Siteor CMS

Wszystkie tagi generują się automatycznie na podstawie danych ze strony lub artykułu. Nie musisz nic konfigurować - wystarczy że strona ma wypełnione pola SEO (tytuł i opis).

Dla artykułów blogowych system dodatkowo:

  • Ustawia og:type na article (zamiast website)
  • Buduje URL z bazowej strony bloga + ścieżki artykułu
  • Używa image_url artykułu jako og:image

Dzięki temu udostępnienie artykułu na Facebooku pokaże tytuł artykułu, jego streszczenie i miniaturkę - nie dane strony-rodzica /blog.

Wymagania w layoucie

Tagi OG i Twitter Card są częścią bloku SEO. Żeby działały, layout musi zawierać zmienną Liquid:
















w sekcji <head> strony. Ta jedna zmienna wstawia canonical, hreflang, Open Graph i Twitter Card naraz.

Sprawdzanie podglądu

Po opublikowaniu strony warto sprawdzić jak wygląda podgląd:

  1. Facebook Sharing Debugger - wklej URL, kliknij Debug
  2. Twitter Card Validator - analogicznie dla X
  3. Slack - wklej link w wiadomość, Slack pokaże podgląd na żywo

Jeżeli Facebook cache'uje stary podgląd, użyj przycisku "Scrape Again" w Debuggerze.

Podsumowanie

Wcześniej trzeba było ręcznie dodawać tagi Open Graph w każdym layoucie. Teraz CMS generuje je sam na podstawie pól SEO. Działa na stronach wielojęzycznych - każda wersja językowa dostaje własne tagi z poprawnymi danymi.

Najczęściej zadawane pytania

Czym jest Siteor CMS?+

Siteor CMS to moduł do zarządzania stronami internetowymi w platformie Intum. Pozwala tworzyć i edytować strony przez panel administracyjny lub REST API. Obsługuje wielojęzyczność, SEO (sitemap, robots.txt, hreflang, Open Graph), szablony Liquid, blog z artykułami i integracje z bazami wiedzy.

Czym jest plik llms.txt?+

Plik llms.txt to nowy standard (llmstxt.org) opisujący zawartość strony internetowej dla botów AI takich jak ChatGPT, Claude czy Perplexity. Siteor CMS generuje go automatycznie dla każdego site'a na podstawie stron i artykułów.

Czy Siteor CMS obsługuje wiele języków?+

Tak. Siteor CMS ma wbudowaną wielojęzyczność: strony master/slave z dziedziczeniem treści, osobne domeny per język z automatycznym hreflang, redirect 301 między wersjami językowymi i filtrowanie sitemapy po locale domeny. Obsługiwane języki: pl, en, fr, de, es, cs, sk, uk.

Czy CMS generuje sitemap.xml automatycznie?+

Tak. Sitemap.xml, robots.txt i llms.txt generują się automatycznie z szablonów Liquid. Sitemap zawiera strony, artykuły blogowe i wpisy bazy wiedzy. Szablony można nadpisać przez ustawienia site'a bez zmian w kodzie.

Jak działa Open Graph w Siteor CMS?+

Tagi Open Graph i Twitter Card generują się automatycznie na podstawie pól SEO strony lub artykułu. Wystarczy że layout zawiera zmienną Liquid seo_head w sekcji head. Artykuły blogowe dostają typ article z własnym tytułem, opisem i obrazkiem.