How to add Open Graph tags

Open Graph tags control how your pages look when shared on WhatsApp, LinkedIn, Facebook and Slack.

Why it matters

Links without Open Graph tags show up as a bare address or a random image. A proper title, description and picture gets far more clicks when people share you.

Steps

  1. Add og:title, og:description, og:image and og:url to the page head.
  2. Use an image about 1200 by 630 pixels.
  3. Test by pasting the link into a chat.

For your developer

<meta property="og:title" content="Page title">
<meta property="og:description" content="One-line summary">
<meta property="og:image" content="https://example.com/share.jpg">
<meta property="og:url" content="https://example.com/page">

Check it worked

Paste the link into a WhatsApp or Slack message to yourself. You should see your image, title and description. Some apps cache old previews for a day.

See all 24 fix guides

Not sure if this affects your site?

Run a free scan to see exactly which of these your website needs.