Open Graph-taggenerator

Fyll i titel, beskrivning, kanonisk (canonical) URL, förhandsbild och og:type, så skriver den här generatorn de matchande Open Graph-taggarna <meta>, redo att klistra in i <head> på din sida. Fält som du lämnar tomma utelämnas helt enkelt, och citattecken och et-tecken i din text escapas så att markupen förblir giltig. Generatorn skriver bara de fem centrala og:-egenskaperna, inte Twitter Card- eller artikeltaggar.

Så skapar du dina OG-taggar

  1. 1

    Välj og:type

    website för startsidor, article för inlägg, product för butikssidor, video.other för inbäddningar. Fältet är fritext, så vilket giltigt og:type-värde som helst fungerar.

  2. 2

    Fyll i de centrala fälten

    Titel, beskrivning, kanonisk URL och en absolut bild-URL. Varje fält du lämnar tomt utelämnas från resultatet.

  3. 3

    Generera taggarna

    Citattecken och et-tecken escapas åt dig, och du får en meta-rad per fält du fyllt i.

  4. 4

    Kopiera blocket till head

    Klistra in det i `<head>` i din sidmall, ovanför eventuella sociala taggar du redan har.

Taggarna som denna generator skapar

<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">

Det är hela utdatan. og:type skrivs alltid, medan og:title, og:description, og:url och og:image läggs till bara när du fyller i dem. Dessa fem egenskaper är det första som Facebook, LinkedIn, Slack, Discord, WhatsApp och X läser, så de täcker det vanliga fallet.

Generatorn skriver inte twitter:-kortstaggar, og:image:width / og:image:height, og:site_name, og:locale eller article:-taggar. Om du behöver dem lägger du till dem för hand bredvid det genererade blocket.

Viktiga og:type-värden

Typ När den används
website Startsida, landningssidor, statiskt innehåll
article Blogginlägg, nyheter, redaktionella sidor
product Produktsidor för e-handel
video.other Videoinnehåll och inbäddningar
profile Profilsidor för författare eller användare
music.song Sidor för enskilda spår

Taggar värda att lägga till för hand

Tagg Vad den gör Exempelvärde
og:site_name Namnet på hela webbplatsen Example
og:locale Sidans språk och region en_US
og:image:width Hjälper skrapare att placera kortet snabbare 1200
og:image:height Hjälper skrapare att placera kortet snabbare 630
twitter:card Kortlayout på X summary_large_image

X faller tillbaka på og:-taggarna när inga twitter:-taggar finns, så en sida som bara bär de fem genererade egenskaperna förhandsvisas korrekt även där. Lägg bara till twitter:-taggar när du vill ha en annan titel, beskrivning eller bild specifikt på X.

Vanliga misstag som denna generator hjälper dig att undvika

  • name i stället för property. Open Graph-egenskaper hör hemma i property="og:...". Generatorn skriver alltid rätt attribut.
  • Oescapade citattecken och et-tecken. Ett rått " eller & i din titel förstör taggen. Generatorn escapar dem åt dig.
  • Relativa bild-URL:er. Sociala skrapare accepterar bara absoluta URL:er. Klistra in bildens fullständiga https://-adress, eftersom generatorn inte lägger till din domän.
  • Fel bildstorlek. 1200 × 630 pixlar är den universellt säkra storleken. Under 200 × 200 pixlar avvisas bilden oftast.

Vanliga frågor

I <head> i din HTML, högt upp, helst nära <title>. Skrapare läser head och stannar ofta tidigt, så att hålla OG-taggarna nära toppen förhindrar att de missas på mycket stora sidor.

Nej. Den skriver bara de fem centrala og:-egenskaperna. X faller tillbaka på Open Graph när twitter:-taggar saknas, så din förhandsvisning fungerar ändå. Lägg bara till twitter:-taggar för hand när du vill ha en annan titel, beskrivning eller bild på X.

1200 × 630 pixlar, JPG eller PNG, är den universellt säkra storleken. Fungerar på Facebook, LinkedIn, X stora kort, Slack, Discord och iMessage. Allt mindre än 200 × 200 pixlar riskerar att avvisas helt.

Ge varje språkversion en egen sida med egna og:-taggar och lägg till og:locale (till exempel en_US) plus og:locale:alternate för de andra versionerna för hand. Den här generatorn skriver inte locale-taggar åt dig.

Relaterade verktyg

Verktyget finns på andra språk