What are Open Graph tags?

Open Graph tags are HTML meta tags that tell social media platforms how to display your link when shared. They include og:title (the headline), og:description (the summary), og:image (the preview image), and og:url (the canonical URL).

Do I need Open Graph tags for my website?

If you share your website links on any social platform — X, LinkedIn, Slack, Discord, WhatsApp, or Reddit — you need Open Graph tags. Without them, platforms guess how to display your link, and they guess poorly.

Is Open Graph the same as Twitter Cards?

No. Open Graph was created by Facebook in 2010. Twitter Cards were created by Twitter separately. However, most platforms support both, and you should set both for maximum compatibility.

Hvad er Open Graph? En komplet begyndervejledning

Du deler et link på sociale medier. Previewet ser forfærdeligt ud. Her er hvorfor – og hvordan Open Graph tags løser det.

Vil du se, hvordan dine links rent faktisk ser ud?

Tjek dine Open Graph-tags gratis med Proovd — indsæt en URL og se forhåndsvisningen på X, LinkedIn, Slack, Discord, WhatsApp og Reddit, før du deler.

Hurtigt svar

Open Graph er et sæt HTML-metatags, der styrer, hvordan links ser ud på sociale medier
Kernetags: og:title, og:description, og:image, ⟧10⟧
Uden OG-tags gætter platforme - og de gætter dårligt
Indstil OG-tags + Twitter Card-tags for fuld dækning

Hvad Open Graph faktisk er

Open Graph er en protokol opfundet af Facebook i 2010. Før Open Graph, da nogen delte et link på Facebook, var forhåndsvisningen uforudsigelig. Facebook ville skrabe siden på udkig efter billeder og tekst, og resultatet var ofte tilfældigt - nogle gange et lille favicon, nogle gange et tilfældigt foto fra siden, nogle gange slet ingenting.

Det er ikke en teknologi, du installerer. It's just HTML meta tags in your page's section. Det er det.

The Core Open Graph-tags

<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="A compelling one-sentence summary." />
<meta property="og:image" content="https://yoursite.com/images/preview.jpg" />
<meta property="og:url" content="https://yoursite.com/your-page" />

Her er hvad hver enkelt gør:

og:title — The headline that appears in the preview card. Normalt sidetitlen eller artikeloverskriften.
og:image — Eksempelbilledet. Recommended size: 1200×630 pixels (1.91:1 ratio).
og:url — The canonical URL of the page. Hjælper platforme med at identificere den korrekte URL.

Sådan fungerer Open Graph - Trin for trin

Her er, hvad der sker, når nogen deler et link:

Nogen indsætter en URL i X, LinkedIn, Slack, Discord eller hvor som helst.
Platformens bot henter URL'en og læser HTML fra top til bund.
Den leder efter og: tags i sektionen.
Det bygger et forhåndsvisningskort ved hjælp af og:title, og:description og og:image værdierne.
Kortet vises til alle, der ser det delte link.

Hvis platformen ikke finder og:-tags, falder den tilbage til sin egen heuristik - at vælge tilfældige billeder, bruge </code>-tagget osv. Denne reserveadfærd er grunden til, at så mange delte links ser forfærdelige ud.</p> <h2 data-i18n="b.what-is-open-graph.31">Open Graph vs. Twitter Cards</h2> <p data-i18n="b.what-is-open-graph.32" data-i18n-html>Twitter oprettede sit eget tag-system kaldet "Twitter Cards", før Open Graph eksisterede. Twitter Cards brug <code>twitter:card</code>, <code>twitter:title</code>, <code>twitter:description</code> og <code>twitter:image i stedet for <code>twitter:image <code>og:</code> præfikser.</p> <p data-i18n="b.what-is-open-graph.33" data-i18n-html>I dag understøtter de fleste platforme begge dele. Men X/Twitter foretrækker stadig <code>twitter:card</code>-tags frem for OG-tags. Det er derfor den bedste praksis er at indstille <strong>begge</strong>:</p> <pre><code> <meta property="og:title" content="Your Title" /> <meta property="og:image" content="https://yoursite.com/image.jpg" />  <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="Your Title" /> <meta name="twitter:image" content="https://yoursite.com/image.jpg" /></code></pre> <h2 data-i18n="b.what-is-open-graph.34">Hvorfor dette er vigtigt for din hjemmeside</h2> <p data-i18n="b.what-is-open-graph.35">Hvis du deler dit indhold hvor som helst på sociale medier - hvilket du sandsynligvis gør, hvis du har et websted - er dine linkforhåndsvisninger dit første indtryk. En gennemarbejdet forhåndsvisning med en klar titel, overbevisende beskrivelse og et godt billede øger klikraterne dramatisk.</p> <p data-i18n="b.what-is-open-graph.36">En ødelagt forhåndsvisning – manglende billede, afkortet titel eller forvansket beskrivelse – får dit indhold til at se uprofessionelt ud. Folk ruller forbi det.</p> <p data-i18n="b.what-is-open-graph.37">Open Graph tags er forskellen mellem de to. De tager 5 minutter at konfigurere og har en uforholdsmæssig stor indflydelse på, hvordan dit indhold klarer sig på sociale medier.</p> <h2 data-i18n="b.what-is-open-graph.38">Hurtig tjekliste</h2> <div class="checklist"> <ol> <li data-i18n="b.what-is-open-graph.39" data-i18n-html>Tilføj <code>og:title</code>, <code>og:description</code>, <code>og:image</code> og <code>og:url</code> til hver side</li> <li data-i18n="b.what-is-open-graph.40" data-i18n-html>Tilføj <code>twitter:card</code> og <code>twitter:image</code> for X/Twitter-kompatibilitet</li> <li data-i18n="b.what-is-open-graph.41">Indstil billedstørrelsen til 1200×630 pixels</li> <li data-i18n="b.what-is-open-graph.42">Brug absolutte URL'er (https://...) for alle billedstier</li> <li data-i18n="b.what-is-open-graph.43" data-i18n-html>Test med <a href="https://proovd.in/da/">Proovd</a> for at se, hvordan din side ser ud på alle platforme</li> </ol> </div> <h2 data-i18n="b.what-is-open-graph.44">Ofte stillede spørgsmål</h2> <div class="faq-item"> <h3 data-i18n="b.what-is-open-graph.45">Har jeg brug for Open Graph tags, hvis jeg ikke deler på sociale medier?</h3> <p data-i18n="b.what-is-open-graph.46">Hvis du ikke deler links nogen steder, har du ikke brug for dem. Men hvis du har en hjemmeside og deler den én gang på sociale medier, er OG-tags afgørende.</p> </div> <div class="faq-item"> <h3 data-i18n="b.what-is-open-graph.47">Påvirker Open Graph tags Googles placeringer?</h3> <p data-i18n="b.what-is-open-graph.48">Ikke direkte. Google bruger ikke OG-tags som en rangeringsfaktor. Men de kan påvirke klikrater fra søgeresultater og sociale delinger, hvilket indirekte påvirker trafik og synlighed.</p> </div> <div class="faq-item"> <h3 data-i18n="b.what-is-open-graph.49">Kan jeg indstille forskellige OG-tags til forskellige sider?</h3> <p data-i18n="b.what-is-open-graph.50">Ja. Hver side skal have sine egne OG-tags, der matcher dens indhold. Et blogindlæg om hunde bør have anderledes og:title og og:image end en side om katte.</p> </div> <div class="internal-links"> <h3 data-i18n="b.what-is-open-graph.51">Relaterede artikler</h3> <ul style="margin:0; padding-left: 1.25rem;"><li data-i18n="b.what-is-open-graph.52" data-i18n-html><a href="/da/blog/discord-link-preview-not-working">Discord Forhåndsvisning af link Virker ikke? 7 rettelser at prøve (2026)</a></li> <li data-i18n="b.what-is-open-graph.53" data-i18n-html><a href="/da/blog/how-to-add-open-graph-tags">Sådan tilføjes Open Graph tags til enhver hjemmeside</a></li> <li data-i18n="b.what-is-open-graph.54" data-i18n-html><a href="/da/blog/open-graph-vs-twitter-card">Open Graph vs Twitter Card: Hvad er forskellen?</a></li> <li data-i18n="b.what-is-open-graph.55" data-i18n-html><a href="/da/blog/og-image-size-guide">Open Graph Billedstørrelse: Den komplette 2026-vejledning</a></li> </ul> </div> <div class="cta"> <p style="margin:0 0 0.5rem;" data-i18n="b.what-is-open-graph.56" data-i18n-html><strong>Tjek dine Open Graph tags på få sekunder</strong></p> <p style="margin:0;" data-i18n="b.what-is-open-graph.57" data-i18n-html>Tjek dine Open Graph-tags gratis med <a href="https://proovd.in/da/">Proovd</a> — indsæt en URL og se forhåndsvisningen på X, LinkedIn, Slack, Discord, WhatsApp og Reddit.</p> </div> </article> </div> <script src="/i18n/apply.js" defer></script> </body> </html>