iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more
To show the intended product image when someone shares a store link in WhatsApp, put product-specific Open Graph tags in that product page’s HTML <head>. Use an absolute, publicly fetchable image URL and test the exact URL you plan to share. This improves the chance of a correct preview, but cannot guarantee WhatsApp will show a preview card for every message. The technical guidance available does not establish a separate India-only rule, so verify the live product URL and image on your store’s public domain.
How WhatsApp gets a product preview
For an ordinary website link, WhatsApp can use metadata in the page HTML to build a preview. The Open Graph protocol defines og:title, og:type, og:image and og:url as required properties for a page object; it describes og:description as optional but generally recommended. Meta-attributed WhatsApp guidance also calls for nonempty title, description and canonical URL values, as well as an absolute image URL. See the Open Graph protocol and the WhatsApp preview guidance reproduced by ChatArchitect.
Set the tags separately for each product page. A store-wide image repeated on every product URL can produce the wrong preview even if the tags themselves are present. The preview metadata describes the page; it does not necessarily expose price, stock or every catalog detail.
Add product-specific Open Graph tags
Place tags in the product page’s HTML head. Replace the sample values with the canonical product URL, a short accurate description, and a share image that represents that item.
<head>
<meta property="og:title" content="Product name and useful identifying detail">
<meta property="og:description" content="A short, accurate product description">
<meta property="og:url" content="https://shop.example.in/products/product-slug">
<meta property="og:image" content="https://shop.example.in/path/to/product-share-image.jpg">
<meta property="og:image:alt" content="Description of the product shown">
</head>The Open Graph standard also defines optional image metadata such as secure URL, MIME type, width and height. Add those when they accurately describe the image; they do not replace og:image. Check your ecommerce theme and SEO tooling before adding another plugin, since either may already emit these tags. If a plugin is needed, verify its current compatibility with your platform and that it supports product-level metadata.
Make the image fetchable and preview-friendly
- Use an absolute URL. Set
og:imageto a complete address such ashttps://shop.example.in/images/item.jpg, not a relative path such as/images/item.jpg. - Allow public access. The product page and image should load without a sign-in. Check image protection, access restrictions and redirects if the image cannot be opened directly.
- Meet the cited image guidance. The Meta-attributed guidance reproduced by ChatArchitect specifies an image under 600 KB, at least 300 pixels wide, with a width-to-height ratio no greater than 4:1. Treat these as that documentation’s guidance, not a promise of identical rendering in every WhatsApp client.
- Keep metadata early in the response. The same guidance says the metadata should appear within the first 300 KB of HTML.
- Match the product and canonical URL. Confirm that the tags returned for the exact shared URL describe that product, rather than the homepage or another item.
Test the exact product URL
- Open the public product URL and inspect its returned HTML head. Confirm the title, description, canonical page URL and image are the intended product’s values.
- Copy the exact
og:imageaddress into a browser where you are not signed in. Confirm it loads and depicts the product. - Paste the exact product URL into the WhatsApp chat where you intend to share it. Check the resulting card rather than assuming that correct tags guarantee one.
- If a CRM or business tool sends the message, test through that tool as well. A manually pasted text URL and a URL button in a template are different sending paths; preview behavior can differ.
A crawler fetching the page to generate a preview is not evidence that a recipient clicked the link or bought the product.
Troubleshoot a missing, cropped or outdated image
No preview appears
Check that the exact product page returns nonempty metadata, that og:image is absolute, and that both page and image are publicly accessible. A correctly prepared page still may not produce a card in every message.
The wrong product image appears
Inspect the HTML returned for the shared URL, not just the store’s homepage or a preview of a different product. Check for generic theme tags, incorrect canonical URLs, or product metadata that was not rendered for this page.
The image looks cropped
Review the source image’s dimensions and ratio against the cited guidance, then test a suitable product image. The guidance’s maximum ratio is 4:1, but it does not promise a particular crop or rendering across clients.
A corrected image does not appear yet
WhatsApp may cache preview information. Secondary guides suggest trying a fresh share or changing/versioning the image URL, but the cited material does not establish an official cache lifetime or guaranteed clearing method. Avoid promising customers a specific refresh time. See OpenGraph Check’s troubleshooting guide and Share Preview’s guide.
Website preview or WhatsApp Business catalog?
| Route | Use it when | What it controls |
|---|---|---|
| Product-page Open Graph metadata | You want to share the store’s own website URL. | The page metadata WhatsApp may use for an external link preview. |
| WhatsApp Business catalog sharing | You want to share catalog products within WhatsApp. | A separate in-app product-sharing flow; it does not configure the Open Graph preview for an ordinary website URL. |
WhatsApp Help Center material describes sharing products and catalog links. See its guides for sharing a product and sharing a catalog link.
Quick wins for a faster PC:
Scan for outdated or missing drivers - takes under a minuteDriver Scan →Repair Windows errors before they cause bigger problemsFix Now →Or skip the browser setup
For a direct screenshot of the rendered product page, ScreenshotNeo offers a website screenshot API and MCP server. It can help you inspect what a page actually renders, but it does not change the Open Graph metadata or guarantee WhatsApp’s preview. Its clean-shot options remove cookie banners, newsletter popups and chat widgets before capture; bot checks, blank pages and failed loads are never billed. AI agents can take screenshots through its MCP server. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000. See ScreenshotNeo and the API documentation.
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://shop.example.in/products/product-slug -o shot.webpSign up for 1,000 free screenshots a month, with no card required.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
