Free tool
Open Graph Tag Generator
Enter your page title, description, URL and image. Get Open Graph and Twitter card tags as one HTML snippet.
Inputs
Live GeneratorGenerated output
When someone shares your link in a chat or a feed, the preview card is built from Open Graph tags. Without them, platforms guess, and the guess is often a logo crop and the wrong headline.
How to get a clean link preview
Paste the Full HTML tab inside the page’s <head>. If your site builder has social sharing fields, use those instead so you don’t output two sets of tags.
The four tags every preview needs
The Open Graph protocol requires four properties on every page:
og:title: the headline on the card. It can be shorter and plainer than your SEO title.og:type: what the page is.websitecovers most pages.og:image: the picture on the card, as a full https:// URL.og:url: the canonical URL, so every share of the page counts as the same object.
The generator also adds og:description, trimmed to 200 characters, and og:site_name.
Get the image right
Facebook’s image guidelines recommend at least 1200 x 630 pixels at roughly a 1.91:1 ratio. Keep text and faces away from the edges, where some apps crop. Make one image per important page rather than reusing the logo everywhere.
Check before you share
- Open the image URL in a private browser window. If it needs a login, platforms can’t fetch it either.
- Run the page through Facebook’s Sharing Debugger to see the card and refresh a cached version.
- Send the link to yourself in Slack or WhatsApp and look at the card on your phone.
Common mistakes
- Relative image paths like
/images/card.jpg. Use the full URL. - The same og:title and og:image on every page.
- An og:url pointing to the homepage on every page, which makes every share look like a homepage share.
Need the title tag and meta description too? The meta tag generator writes those in the same format.
FAQ
Frequently asked questions
Straight answers about using this tool and its output.
What does this Open Graph generator create?
Six Open Graph tags (og:title, og:description, og:url, og:image, og:type and og:site_name) and five Twitter card tags, including summary_large_image for a full-width preview. The Full HTML tab combines them into one snippet for your page’s <head>.
Which Open Graph tags are required?
The Open Graph protocol lists four: og:title, og:type, og:image and og:url. og:description and og:site_name are optional but worth adding, since most previews show a description line.
What size should my og:image be?
Facebook recommends at least 1200 x 630 pixels and an aspect ratio close to 1.91:1 so the image isn’t cropped. Images smaller than 600 x 315 still show, but much smaller. Always use an absolute https:// URL.
Do I need Twitter card tags as well?
They’re cheap insurance. The twitter: tags control how links look on X, including the large image card, and the generator writes them from the same inputs, so there’s nothing extra to fill in.
Do Open Graph tags help Google rankings?
Google doesn’t describe them as a ranking signal. They shape how your links look when shared, and Google lists og:title as one of the sources it can use when it builds a title link.
Why does the old preview still show after I update my tags?
Platforms cache link previews. Facebook’s Sharing Debugger re-fetches a URL so you can check and refresh the preview. Other platforms refresh on their own schedule.
Let ZynfoAI take the first reply.
Answers on your website and WhatsApp from your own content, with your team one click away. Free for 7 days, then $99/month.