iMessage Link Preview Not Working? Fixing Previews
When you send a link in Messages on an iPhone, iPad or Mac, the app turns it into a rich link: a large image with the page title and domain underneath, or a small icon beside the title.
When the message shows only a plain link, a tiny icon instead of a picture, or "Tap to Load Preview", the cause is almost always one of five things: missing Open Graph tags, an image Apple will not use, a missing site icon, a page that is slow or blocked, or the way Messages treats links from unknown senders. This guide covers each one, how to tell which you have, and how to fix it.
If your iMessage link preview is not working, check the og tags first.
How Messages builds a rich link
Messages builds link previews on the sender's device, not on Apple's servers. When a link is typed or pasted into a message, the iPhone, iPad or Mac fetches the page, reads the tags in the head, downloads the image or icon, and sends the finished preview with the message. The person receiving it sees what the sender's device fetched.
Several things follow from that:
- Requests come from ordinary devices. The request arrives from the sender's own connection.
Its user agent looks like a desktop Safari browser but also contains
facebookexternalhitandTwitterbot, so rules written for those crawlers affect iMessage too. - There is no central cache to clear. Each send builds a new preview, although a device may reuse one it built recently. There is no debugger or refresh tool, and none is needed.
- Speed matters. The preview has to be ready while the message is being written or sent. A slow page produces a plain link.
- No JavaScript. Messages reads the HTML your server sends. Tags added by a script after the page loads are invisible to it.
Messages shows the title and the domain. It usually does not show og:description at all,
which surprises people used to Facebook and LinkedIn cards. The image and the title carry the whole preview.
The tags Messages reads
| Tag | What Messages uses it for | Notes |
|---|---|---|
og:title | The title under the image. | Falls back to <title>.
Long titles are cut after about two lines. |
og:image | The large picture. | A full https address. Without it, Messages shows an icon instead. |
og:url | The address of the page. | Keep it identical to the canonical URL. |
og:site_name | The source name. | Messages usually shows the domain instead. |
link rel="apple-touch-icon" | The icon used when there is no suitable image. | A square PNG of at least 180 x 180 pixels. |
link rel="icon" | A fallback icon. | Used if there is no Apple touch icon; often too small to look good. |
og:video | A video that can play in the preview. | Optional. Needs a direct https address to a video file. |
A correct set you can copy
<head>
<meta charset="UTF-8">
<title>Spring bulb planting guide | Hilltop Garden Centre</title>
<link rel="canonical" href="https://example.com/guides/spring-bulbs">
<link rel="apple-touch-icon" href="https://example.com/apple-touch-icon-180.png">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Hilltop Garden Centre">
<meta property="og:url" content="https://example.com/guides/spring-bulbs">
<meta property="og:title" content="When and how to plant spring bulbs for colour from March">
<meta property="og:description" content="Planting depths, spacing and the best bulbs for pots, borders and lawns.">
<meta property="og:image" content="https://example.com/images/spring-bulbs-1200x630.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
</head>Keep og:description for the other platforms even though Messages rarely shows it. Put
these tags near the top of the head, before large inline scripts and styles, because Messages reads only
as much of the page as it needs.
Images and icons Messages will show
Messages chooses between two layouts. With a good og:image it shows a large picture across
the bubble with the title underneath. Without one, or when the image is unsuitable, it shows a small
icon beside the title. A tiny icon where you expected a picture is an image problem.
| Requirement | What works | What fails |
|---|---|---|
| Image width | At least about 900 pixels wide; 1200 x 630 is ideal | Small images are treated as icons, not pictures. |
| File size | Well under 1 MB | Large files may not download in time, leaving an icon or plain link. |
| Format | JPG or PNG | SVG is not used for the preview picture. |
| Address | Full https URL returning 200 | Relative paths, http addresses, redirects to a login page. |
| Icon | A square apple-touch-icon PNG of 180 x 180 or larger | A 16 x 16 favicon, which looks blurred when enlarged. |
Apple advises against images that are mostly text, because the picture is shown at different sizes on iPhone, iPad and Mac and small text becomes unreadable. Use a clear photograph or illustration, and let the title carry the words. The same 1200 x 630 image used for Facebook, LinkedIn and X works in Messages.
spring-bulbs-v2.jpg.When Messages cannot fetch the page
If the message shows only a plain blue link, the sender's device probably did not get the page in time, or got a page with no tags.
- Rules aimed at other crawlers. Because the Messages user agent contains
facebookexternalhitandTwitterbot, a firewall or robots.txt rule that blocks either of those also blocks iMessage previews. - Bot protection. Cloudflare Bot Fight Mode, Wordfence, ModSecurity rules and hosting "anti-bot" settings can challenge the request. A challenge page has no tags, so no preview appears.
- Login walls and cookie gates. The device fetches the page with no cookies. If a visitor with no cookies is sent to a login, age check or consent page, that is the page the preview is built from.
- Country and network blocking. The request comes from wherever the sender is. Blocking countries or networks blocks previews for people there.
- Slow responses and redirects. Messages waits only briefly. A slow page or a long redirect chain produces a plain link. Share the final address and keep redirects to a single hop.
Your server's access log shows whether the request arrived. Send the link to yourself, then search the log for requests whose user agent contains both Safari and facebookexternalhit. No line means it was blocked before it reached the site; a 403, 429 or 503 means the site refused it; a 200 means the problem is in the tags or the image.
sudo grep -i "facebookexternalhit" /var/log/nginx/access.log | grep -i "safari" | tail -5"Tap to Load Preview" and unknown senders
Sometimes the page is fine and Messages is choosing not to show the preview straight away.
- Unknown senders. For messages from people who are not in the recipient's contacts, Messages does not load previews automatically. The recipient sees "Tap to Load Preview" instead, as a safety measure. This is not a fault in your page, and nothing on the website can change it.
- Preview not built before sending. If the sender's device could not build the preview in time, the recipient may see a plain link or be offered the chance to load the preview themselves.
- Low Data Mode and poor signal. On a slow or restricted connection, the device may skip the image and show only the title and domain.
- SMS and green bubbles. Links sent as SMS rather than iMessage are not turned into rich links in the same way. Test with a blue-bubble conversation.
Because every send builds a fresh preview, fixing the page takes effect on the next message. Messages that were already sent keep the preview, or plain link, they were sent with.
The fix, step by step
Step 1
Check what Messages can see
Run the page through the Social Preview checker, which shows the Open Graph tags and icons the way Messages reads them, together with the image address, width and file size. Then send the link to yourself in Messages from an iPhone or a Mac, in a blue-bubble conversation, and note what appears: a large picture, a small icon, a plain link or Tap to Load Preview.
Step 2
Add the tags Messages reads
View
the page source, not the browser element inspector, and check that og:title, og:image
and og:url are in the head once each, near the top, with full https addresses. Keep og:description
for other platforms. Make the title clear and under about 70 characters, because Messages shows the title
and domain but usually not the description. Remove duplicate tags added by a second plugin or the theme.
Step 3
Use an image Messages will show large
Open the og:image address in a private browser window. It should load straight away as a JPG or PNG at least about 900 pixels wide, ideally 1200 by 630, and well under 1 MB. Avoid images that are mostly text. If the image redirects, needs a login or is small, replace it and give the new file a new name.
Step 4
Add an Apple touch icon
Add
a link rel="apple-touch-icon" tag pointing to a square PNG of at least 180 by 180 pixels,
with a full https address. Messages uses it whenever there is no suitable image, so pages without a featured
picture still get a sharp, recognisable icon beside the title instead of a blurred favicon or a blank
space. Use the same icon file on every page of the site.
Step 5
Let the request through quickly
Send the link to yourself and search the access log for requests containing both Safari and facebookexternalhit. No line means it was blocked; a 403, 429 or 503 means the site refused it. Remove any firewall or robots.txt rule that blocks facebookexternalhit or Twitterbot, allow the request through bot protection, and make sure the page responds quickly without a long redirect chain.
Step 6
Send the link again and check
Purge any CDN or page cache for the address so the device is served the fixed page, then send the link to yourself again in a blue-bubble conversation. Check the picture, the title and the domain on both an iPhone and a Mac if you can. If a recipient sees Tap to Load Preview, check whether you are in their contacts before changing anything else.
Stopping it from coming back
- Tags in the template. Generate Open Graph tags on the server for every page from the page's own title and featured image, so no page goes out without them.
- A site-wide icon. Keep a 180 x 180
apple-touch-iconin the head of every page, so pages without a featured image still look finished. - A default image. Set a site-wide 1200 x 630 fallback image, well under 1 MB, for pages with no featured image.
- Careful crawler rules. Remember that blocking facebookexternalhit or Twitterbot also blocks iMessage previews. Keep them, and LinkedInBot, Slackbot, Discordbot and WhatsApp, on the firewall's allow list.
- Test before sending widely. Send important links to yourself first, because the preview is fixed once the message is sent.
1. Why does my link show as a plain link in iMessage?
Usually because the sender's device could not fetch the page in time, or fetched a page with no tags. Messages builds the preview on the sender's iPhone, iPad or Mac, so a slow page, a firewall rule, bot protection or a login or consent page all produce a plain link. Check the page source for og:title and og:image, search your access log for the request, and send the link to yourself again.
2. Why does iMessage show a small icon instead of a picture?
Because the page has no og:image, or the image is too small for Messages to treat as a picture. Messages shows a large picture only for images at least about 900 pixels wide, and otherwise falls back to the site icon beside the title. Add an og:image of 1200 by 630 pixels with a full https address, keep it well under 1 MB, and send the link to yourself again to check.
3. What does Tap to Load Preview mean in iMessage?
It means Messages chose not to load the preview automatically. This happens mainly for messages from people who are not in the recipient's contacts, as a safety measure, and sometimes when the sender's device could not build the preview in time. Nothing on the website can change the contacts rule. If the sender is a contact and the message still shows it, check that the page loads quickly and is not blocked.
4. Does iMessage show the og:description?
Usually not. Messages shows the image, the title and the domain, and in most cases leaves the description out. That means the title and the picture have to do all the work in Messages, so make the og:title clear and specific and the og:image a strong, uncluttered picture. Keep og:description on the page anyway, because Facebook, LinkedIn, Slack and WhatsApp all use it in their own previews of the same link.
5. How do I refresh an iMessage link preview?
There is nothing to refresh on Apple's side. Messages builds the preview on the sender's device each time a link is sent, so once the page is fixed and any CDN or page cache is purged, the next message shows the new preview. A device may reuse a preview it built very recently, so wait a few minutes or send the link with a harmless query string such as ?v=2 when testing.
6. Can blocking Facebook's crawler break iMessage previews?
Yes. The user agent Messages sends when it builds a preview includes facebookexternalhit and Twitterbot, so any firewall rule, bot protection setting or robots.txt entry that blocks either of those also blocks iMessage previews. If you block those crawlers deliberately, you lose rich links in Messages as well as on Facebook and X. Search your access log after sending a test link to confirm exactly what the request received from your server.
7. What size should an Apple touch icon be for iMessage?
A square PNG of at least 180 by 180 pixels, linked from the head with a link rel of apple-touch-icon and a full https address. Messages uses it when a page has no suitable og:image, showing it beside the title. A small favicon of 16 or 32 pixels looks blurred when Messages enlarges it, so a proper touch icon makes pages without a featured image look far more professional in every conversation.
The Social Preview checker fetches your page and shows how it is likely to look in iMessage, WhatsApp, Facebook, LinkedIn, X, Slack and Discord, lists every tag, checks the image size and address, and shows each card side by side.
Open Social Preview Fixes →