Why your link preview shows no picture (iMessage, Slack, Facebook, LinkedIn)
Apps build a link preview from Open Graph tags in your page's HTML, and the picture comes from the og:image tag. If that tag is missing, points to a relative or http address, or the app has cached an older version, you get a bare link with no image.
Where the preview comes from
When you paste a link into iMessage, Slack, WhatsApp, Facebook or LinkedIn, the app quickly fetches your page and reads a few hidden lines in its HTML to decide what to show. These lines are called Open Graph tags, a convention Facebook introduced that most apps now follow. The main ones are:
- og:title: the headline in the preview.
- og:description: the line or two of text under it.
- og:image: the picture.
- og:url: the page's preferred address.
In the page source, they look like this:
<meta property="og:title" content="Linen Throw Blanket" />
<meta property="og:description" content="Stonewashed linen, made to soften with every wash." />
<meta property="og:image" content="https://example.com/images/linen-throw-1200x630.jpg" />
<meta property="og:url" content="https://example.com/products/linen-throw" />If there is no og:image, some apps try to guess an image from the page and others show nothing. Guessing often picks a logo or an icon, so it is better to set the tag yourself.
The most common reasons the image is missing
- No og:image tag at all, often on pages added by an app or a custom template.
- A relative address such as /images/photo.jpg. Preview tools need the full address, starting with https:// and including your domain.
- An http address instead of https. Many apps won't load images from insecure addresses.
- The image can't be fetched: it was deleted, sits behind a password page, is blocked by robots.txt, or the file is very large.
- The tags are added by JavaScript. Most preview fetchers read the raw HTML and don't run scripts, so tags injected after the page loads are never seen.
- An unusual image format. JPG and PNG work almost everywhere. Newer formats are not supported by every app.
What size the image should be
A common recommendation is 1200 × 630 pixels, a wide shape that fits Facebook, LinkedIn and most messaging apps. Keep the important part of the image near the middle, because some apps crop to a square or a narrower shape. Very small images may be shown as a small thumbnail beside the text instead of a large picture.
X (formerly Twitter) reads Open Graph tags too, but it uses its own twitter:card tag to decide on the layout. Setting twitter:card to summary_large_image asks for the large-picture version.
Fixed it but the old preview still shows
Apps save a copy of each preview so they don't fetch your page every time it is shared. After you fix the tags, the old version can keep appearing for a while. Some platforms let you force a refresh:
- Facebook: paste the URL into the Sharing Debugger at developers.facebook.com/tools/debug/ and choose to scrape it again.
- LinkedIn: paste the URL into the Post Inspector at www.linkedin.com/post-inspector/, which fetches a fresh copy.
- iMessage, Slack and others: there is usually no public refresh tool. The cache clears over time, and testing with a slightly different URL, such as one with ?v=2 on the end, shows you the new preview straight away.
A refresh tool only helps once the tags themselves are right. Check the tags first, then refresh.
On Shopify
Most Shopify themes output Open Graph tags automatically. Product pages normally use the product's main image, so a product with no images gives a preview with no picture. For your home page and other pages without their own image, look in your online store preferences or theme settings for a social sharing image and upload one there.
If a page still has no image after that, the theme or an app may be overriding the tags. Viewing the page source and searching for og:image shows what is actually being sent. Our link preview tool does this for you and shows what each app is likely to display.