Open Graph-taggenerator

Vul de titel, beschrijving, canonieke (canonical) URL, voorbeeldafbeelding en og:type in, en deze generator schrijft de bijbehorende Open Graph-<meta>-tags, klaar om in de <head> van je pagina te plakken. Velden die je leeg laat, worden gewoon weggelaten, en aanhalingstekens en ampersands in je tekst worden ge-escaped zodat de mark-up geldig blijft. De generator schrijft alleen de vijf kern-og:-eigenschappen, geen Twitter Card- of artikeltags.

Hoe je je OG-tags genereert

  1. 1

    Kies og:type

    website voor homepagina's, article voor berichten, product voor winkelpagina's, video.other voor embeds. Dit veld is vrije tekst, dus elke geldige og:type-waarde werkt.

  2. 2

    Vul de kernvelden in

    Titel, beschrijving, canonieke URL en een absolute afbeeldings-URL. Elk veld dat je leeg laat, wordt uit de uitvoer weggelaten.

  3. 3

    Genereer de tags

    Aanhalingstekens en ampersands worden voor je ge-escaped, en je krijgt één meta-regel per veld dat je hebt ingevuld.

  4. 4

    Kopieer het blok naar de head

    Plak het in de `<head>` van je paginasjabloon, boven eventuele sociale tags die je al hebt.

De tags die deze generator maakt

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

Dat is de volledige uitvoer. og:type wordt altijd geschreven, terwijl og:title, og:description, og:url en og:image alleen worden toegevoegd wanneer je ze invult. Deze vijf eigenschappen zijn wat Facebook, LinkedIn, Slack, Discord, WhatsApp en X als eerste lezen, dus ze dekken het gangbare geval.

De generator schrijft geen twitter:-kaarttags, og:image:width / og:image:height, og:site_name, og:locale of article:-tags. Heb je die nodig, voeg ze dan met de hand toe naast het gegenereerde blok.

Belangrijke og:type-waarden

Type Wanneer te gebruiken
website Homepagina, landingspagina’s, statische content
article Blogberichten, nieuws, redactionele pagina’s
product Productdetailpagina’s voor e-commerce
video.other Video-content en embeds
profile Profielpagina’s van auteurs of gebruikers
music.song Pagina’s van afzonderlijke tracks

Tags die het waard zijn om met de hand toe te voegen

Tag Wat het doet Voorbeeldwaarde
og:site_name Naam van de hele site Example
og:locale Taal en regio van de pagina en_US
og:image:width Helpt scrapers de kaart sneller te plaatsen 1200
og:image:height Helpt scrapers de kaart sneller te plaatsen 630
twitter:card Kaartlay-out op X summary_large_image

X valt terug op de og:-tags wanneer er geen twitter:-tags zijn, dus een pagina met alleen de vijf gegenereerde eigenschappen wordt daar ook correct als voorbeeld weergegeven. Voeg twitter:-tags alleen toe wanneer je specifiek op X een andere titel, beschrijving of afbeelding wilt.

Veelvoorkomende fouten die deze generator helpt te voorkomen

  • name in plaats van property. Open Graph-eigenschappen horen in property="og:...". De generator schrijft altijd het juiste attribuut.
  • Niet-ge-escapete aanhalingstekens en ampersands. Een ruwe " of & in je titel breekt de tag. De generator escapet ze voor je.
  • Relatieve afbeeldings-URL’s. Sociale scrapers accepteren alleen absolute URL’s. Plak het volledige https://-adres van de afbeelding, want de generator voegt je domein niet toe.
  • Verkeerd afbeeldingsformaat. 1200 × 630 px is het universeel veilige formaat. Kleiner dan 200 × 200 px wordt de afbeelding meestal geweigerd.

Veelgestelde vragen

In de <head> van je HTML, hoog bovenin, het liefst dicht bij de <title>. Scrapers lezen de head en stoppen vaak vroeg, dus door de OG-tags bovenaan te houden voorkom je dat ze op zeer grote pagina’s worden gemist.

Nee. Het schrijft alleen de vijf kern-og:-eigenschappen. X valt terug op Open Graph wanneer er geen twitter:-tags zijn, dus je voorbeeldweergave blijft werken. Voeg twitter:-tags alleen met de hand toe wanneer je op X een andere titel, beschrijving of afbeelding wilt.

1200 × 630 px, JPG of PNG, is het universeel veilige formaat. Werkt op Facebook, LinkedIn, grote kaarten van X, Slack, Discord en iMessage. Alles kleiner dan 200 × 200 px loopt het risico volledig te worden geweigerd.

Geef elke taalversie een eigen pagina met eigen og:-tags en voeg og:locale (bijvoorbeeld en_US) plus og:locale:alternate voor de andere versies met de hand toe. Deze generator schrijft geen locale-tags voor je.

Gerelateerde tools

Tool beschikbaar in andere talen