How do I change the social sharing image?
Last checked 31 Aug 2026
Short answer
Ask Lovable to update the Open Graph image, or edit the og:image meta tag in your page head and upload the image asset — this controls the preview card shown when your link is shared on social platforms.
What this image is
When someone pastes your site's link into Slack, WhatsApp, X, LinkedIn or Facebook, those platforms read Open Graph meta tags to build a preview card — an image, title and description. The image comes from the og:image (and often twitter:image) meta tag.
How to set it in Lovable
Set the social sharing image (Open Graph image) to this file [attach image], sized around 1200x630px, and make sure it applies to og:image and twitter:image.
Or manually:
- Prepare an image roughly 1200x630px (the standard OG ratio) — square-ish crops from other aspect ratios often get cropped badly on some platforms.
- Upload it as a project asset (e.g. in
public/). - In
index.html(or wherever your<head>metadata is managed), set:
<meta property="og:image" content="https://yourdomain.com/social-image.png" />
- Use an absolute URL (including
https://yourdomain.com/...), not a relative path — most social crawlers won't resolve relative image paths correctly. - Publish, then re-scrape the link with a debugging tool (see below) since platforms cache old previews aggressively.
What usually goes wrong
- Old image keeps showing after you change it — this is a platform-side cache, not a Lovable bug. Use Facebook's Sharing Debugger or LinkedIn's Post Inspector to force a re-scrape.
- Relative image path —
content="/social-image.png"often fails silently on crawlers that don't resolve it against your domain; always use the fullhttps://URL. - Wrong dimensions — very tall or very wide images get cropped unpredictably; stick close to 1200x630.
Related
This sits alongside the rest of your page metadata — see how do I add Open Graph metadata and how do I change meta titles.
Sources
Was this answer helpful?
Related questions
- AnswerHow do I publish a Lovable website?Click Publish in the top-right of the Lovable editor; it deploys your current version to a live `*.lovable.app` URL (or your connected custom domain) in under a minute.
- AnswerHow do I change the favicon?Ask Lovable in chat to update the favicon, and upload or link the image you want — Lovable will swap the icon file and reference it in the page head for you.
- AnswerHow do I connect my own domain to Lovable?In Project settings, go to Domains, add your domain, and create the DNS records Lovable gives you (usually an A record or CNAME) at your domain registrar or DNS host — then wait for verification, which can take anywhere from minutes to a few hours.
- AnswerWhat DNS records does Lovable need?Lovable shows the exact records to add when you connect a domain — typically an A record for the root/apex domain and a CNAME for `www` (or a subdomain), plus any verification record it asks for.
