Skip to content
Get a free quoteGet a quote
Published
Byline
GoHighLevel Partners Editorial

Often the only part of the page a person sees before deciding whether to click — and the part most pages leave to a guess.

Open Graph image on a page: what shows when someone shares it

When a link to a client’s page is pasted into a chat, a message or a social post, the platform fetches the page and builds a preview from a small set of tags in its head. The image in that preview is the Open Graph image, and it is frequently the only part of the page a person sees before deciding whether to click.

Most pages get this wrong by omission. With no image specified, the platform guesses — often picking the first thing it finds, which might be a logo, an icon or nothing at all — and the link appears as a bare grey box next to a title.

The tags that produce the preview

Tag What it controls What happens without it
og:image The picture in the preview The platform guesses, usually badly
og:title The headline of the preview Falls back to the page title, which may be truncated oddly
og:description The line beneath it Falls back to the meta description, or to nothing
og:url The canonical address being shared Tracking parameters can fragment how a link is counted
og:type What kind of thing the page is Usually harmless, occasionally changes the layout
og:image:alt A description of the image Nothing for anyone using a screen reader

All of them live in the head of the document, which is why this is often a question about code in the page header rather than about the page’s content. Two copies of the same tag — one emitted by the builder, one pasted in by hand — is the most common cause of a preview that ignores what you set.

The practical rules for the image itself

  • Use a wide landscape image. Preview cards are wide, and a square or portrait image is cropped, usually through the middle of whatever mattered.
  • Keep the important content central. Different platforms crop differently, so anything near an edge may not survive.
  • Give it an absolute URL over HTTPS. A relative path or an insecure one is a common reason an image silently fails to appear — and an insecure reference can also contribute to a not-secure warning.
  • Keep the file reasonable. Very large images are sometimes skipped by the fetching platform, and they cost the page nothing to serve only because nobody visits the image directly.
  • Do not reuse the hero image thoughtlessly. A photograph that works as a full-width background often reads as a meaningless texture at preview size.

The reliable approach is a purpose-made image per important page: one that makes sense at a small size, is legible in a crowded feed, and says something about the page. Where a site has many pages, one good default plus overrides on the pages that matter is a reasonable compromise — the pages that matter being those anyone actually shares, usually the offer pages and the articles.

Caching is why your change did not appear

Platforms cache what they fetch, sometimes for a long time. Changing the tag does not change the preview for a link that has already been shared and scraped, which produces the familiar complaint that the fix did not work.

Two things resolve it. Most major platforms provide a debugging tool that re-fetches a URL on demand and shows what they parsed — using it is faster than guessing, and it tells you whether the tag is even being seen. And where the preview must change urgently, a fresh URL is scraped fresh.

The same caching explains inconsistency between apps: one chat client shows the new image while another shows the old one, because they cached at different times. That is not a misconfiguration and it resolves on its own.

Where it commonly breaks on agency sites

The tag points at a page, not an image. A URL that returns HTML rather than an image file produces no preview at all.

The image is behind a redirect or a login. The fetching platform is not the visitor and has no session; anything it cannot retrieve anonymously does not exist as far as the preview is concerned.

The domain moved. After a change of the kind pointing the apex at a host describes, absolute image URLs pointing at the old host quietly stop resolving, and the preview breaks while the page looks fine.

The page was cloned. Duplicated pages inherit the original’s image, so a whole set of client pages ends up sharing one preview — an instance of the general problem in what moves and what breaks on import.

The blog uses one image for everything. Category and archive pages typically inherit a site-wide default, which is fine, but individual articles deserve their own; the structure for that is part of blog category setup on a client site.

What to do on the pages that matter

On a product detail page structure, the preview image should show the product, not the brand — the person seeing the link is deciding whether the thing is interesting, not whether the company exists. On a what an offer page has to answer, an image that states the subject does more work than one showing an abstract scene.

On pages nobody shares deliberately — a checkout, the thank-you step — a sensible default is enough, and these pages generally should not be indexed or shared anyway.

Finally, remember that a shared link often carries UTM parameters appended by whoever shared it, and that a preview is generated per URL. If your tracking produces many variants of one page, they are scraped separately, which is one more reason to set og:url to the canonical address. Then check the result at small size on a phone — the same discipline as how a phone stacks your columns — since that is where most previews are seen, and confirm the image is not so large that it works against what a page speed score measures for anyone who does load the page.

Frequently Asked Questions

What is an Open Graph image?

The picture that appears when a link to the page is shared in a chat, a message or a social post. The platform fetches the page and builds a preview from tags in its head; without one specified, it guesses, often picking a logo, an icon or nothing at all.

What shape should the image be?

Wide and landscape, with anything important kept central. Preview cards are wide, so square or portrait images get cropped through the middle of whatever mattered, and different platforms crop differently, so content near an edge may not survive.

Why did the preview not update after I changed the tag?

Because platforms cache what they fetched, sometimes for a long time. A link already shared and scraped keeps its old preview. Most major platforms provide a debugging tool that re-fetches on demand and shows what they parsed, which is faster than guessing.

Why do different apps show different previews for the same link?

Because they cached at different times. One client shows the new image while another still shows the old one. That is not a misconfiguration and it resolves on its own as the caches expire.

Why does no image appear at all?

Common causes are a tag pointing at a page rather than an image file, a relative or insecure URL where an absolute HTTPS one is needed, an image behind a redirect or a login the fetching platform cannot pass, or a file large enough to be skipped.

Do all pages need their own Open Graph image?

No. One good site-wide default plus overrides on the pages people actually share — usually offer pages and articles — is a reasonable compromise. Pages nobody shares deliberately, such as a checkout or a thank-you page, need only the default.

We build your GoHighLevel account for you

CRM, pipelines, funnels, SMS and automation — configured for your business, not left for you to figure out.

  • Setup (one-time)$850
  • Ongoing (per month)$38.80
Get my free setup quote

No obligation quote · reply within 1 business day

This site is independently operated and is not officially affiliated with, endorsed by, or sponsored by HighLevel LLC. We do not receive referral commissions — this is our own flat-fee implementation service.

Leave a Reply

Your email address will not be published. Required fields are marked *

$850 setup, $38.80/mo ongoingGet a quote