OG Tag Previewer Fields Guide: Five Inputs, Two Limits, One Silent Failure

We audited our OG tag previewer field by field before documenting it, because the tool makes choices a user cannot see. It always appends an og:type line to the copied tags. It drops the preview image without a warning when the URL fails to load. It clamps text by line count, and the counts differ per platform. This guide covers what each field does, the two limits that catch truncation early, and the failure that shows no error.

What each of the five fields controls

The tool has five inputs and one fixed line.

og:title sets the headline on the preview card. og:description sets the body text under it. og:image sets the picture the card loads. og:url sets the canonical URL, and the tool derives the displayed domain from it with the browser URL parser. og:site_name sets the site label, which appears in the LinkedIn footer line and as the small label above the Discord card.

The fixed line is og:type with the value website. The copy button includes it even when every other field is empty. For article pages the correct value is article, so edit that line after pasting when you ship a post rather than a landing page.

The two counters that catch truncation first

The title counter caps at 60 characters and the description counter caps at 200. Below the cap the counter reads gray. Past the cap it turns amber and an icon appears.

These are internal thresholds, and platforms do not publish matching hard limits. Treat them as tripwires. When the counter turns amber, the card text is long enough that some surface will cut it, and you should move the important words to the front before shortening anything.

Note one gap. The counters measure characters, while the visual previews clamp lines. A 55 character title can still wrap to two lines on Facebook and get cut in one line on Discord. Length safety and layout safety are separate checks, and the tool shows both.

Field order in the copied block

The copy button emits one meta line per filled field, then the og:type line. With every field filled the block reads as follows.


<meta property="og:title" content="Guide to crawl budgets" />
<meta property="og:description" content="How we measured crawl waste on 400 pages." />
<meta property="og:image" content="https://example.com/og.png" />
<meta property="og:url" content="https://example.com/crawl-budget" />
<meta property="og:site_name" content="Example" />
<meta property="og:type" content="website" />

Empty fields are omitted from the copy even though the preview card shows placeholder text in their place. That is the trap to know. The preview never looks empty, so a card can look finished while the copied block is missing the image or the description. Read the copied block, not only the card, before you paste it into a page.

What each platform tab cuts

The three tabs apply different clamps, and the numbers come from the preview code itself.

Facebook clamps the title to 2 lines and the description to 2 lines, and shows the domain above the title. LinkedIn clamps the title and description to 2 lines each and shows the domain and site name below the description. Discord clamps the title to 1 line, clamps the description to 3 lines, renders the title in a link color, and places the image under the text instead of above it.

One consequence follows. A title that survives Facebook intact can lose its second line on Discord, because Discord allows one line. If your distribution includes chat apps, keep the front of the title self sufficient. Put the brand or qualifier at the end where the cut happens.

The image field fails silently

The preview loads the image URL in the card itself. If the server returns an error, blocks hotlinking, or redirects to HTML, the card removes the image and shows a no image message. There is no status code and no explanation.

This makes the image field the one input you must verify against a live URL, not against a local path. Test these three conditions in order.

1. Open the image URL directly in a browser and confirm it renders.

2. Paste the full absolute URL, including protocol, into the tool. Relative paths fail here.

3. Switch through all three tabs after entering the URL, since one tab is enough to confirm the load succeeded.

Steps to build a share card you can trust

1. Fill og:title first and keep it under the 60 character amber threshold.

2. Fill og:description and keep it under 200 characters.

3. Paste an absolute image URL you have opened in a browser within the last minute.

4. Fill og:url and og:site_name so the domain line and the footer label render.

5. Check all three tabs and read every clamped line.

6. Copy the meta tags, change og:type to article when the page is an article, and paste the block into your page head.

Checklist before the link goes out

1. The copied block contains all six lines you expect.

2. og:type says article if the page is one.

3. The image loads from the absolute URL in a fresh tab.

4. The title reads complete within one line, since Discord cuts to one.

5. The first 40 characters of the title carry the main message.

6. The domain shown on the card matches the production domain.

Run your next share through the [OG tag previewer](https://webrecast.com/en/og-tag-previewer) and check the copied block before the card goes out. If a platform cut your card at a length the counters approved, send us the case. We track real truncation reports against these thresholds.