Open Graph Tag Generator with Social Preview
Marketers, bloggers, and developers use this free OG tag generator to control exactly how their pages look when shared on Facebook, Twitter/X, and LinkedIn. Fill in your details and watch three live social card previews update instantly. For a complete SEO setup, pair your Open Graph tags with well-crafted meta title and description tags and add a Twitter Card for full cross-platform coverage.
Page Details
Social Preview
Generated HTML
How to Use the OG Tag Generator
- Enter your page URL — this sets the domain shown in each social card preview.
- Write a title (aim for under 60 characters so it does not get truncated on any platform).
- Add a description that hooks the reader in two sentences or fewer.
- Paste your OG image URL — use a 1200 × 630 px image for the best display across all platforms.
- Select the page type; choosing "article" reveals additional fields like published date and author.
- Click Copy HTML and paste the snippet into your page's
<head>.
Key Features
- Three live social previews — see your content card on Facebook, Twitter/X, and LinkedIn before you publish.
- Article-specific fields — published time, author, and section tags unlock automatically when you select the "article" page type.
- Image size guidance — inline hints confirm whether your image URL meets each platform's recommended dimensions.
- Twitter Card output included — the generated HTML includes both OG and Twitter Card tags so you only need one copy-paste.
- Zero-dependency tool — runs entirely in your browser, no server requests, no data stored.
Use Cases
Add Open Graph tags to a blog post before publishing
Set the page type to "article", fill in your post title and a one-line summary, and upload a feature image to your CDN. Use this generator to craft the OG tags, then paste them into your CMS template so every post shares beautifully from day one.
Improve social sharing for a product or landing page
Product pages shared without OG tags often display random images or no image at all. Set og:type to "product", write a benefit-led title, and use a crisp product shot as your OG image. Better previews mean more clicks when customers share your products on social media. Use the social media image resizer to create a perfectly dimensioned OG image, and build a UTM campaign URL to track clicks from each sharing platform in Google Analytics.
Optimise LinkedIn previews for B2B content
LinkedIn truncates titles differently to Facebook. Use the LinkedIn tab in the preview panel to check that your title is not cut off, then adjust before you publish your whitepaper, case study, or thought-leadership article.
Generate OG tags for a multi-author publication
When article type is selected, the article:author field lets you attribute each piece to the right byline. This data is read by platforms like LinkedIn and can improve credibility and engagement when the author shares the piece from their own profile.
Frequently Asked Questions
The Open Graph protocol, created by Facebook, enables any web page to become a rich object in a social graph. By adding OG meta tags to your HTML head, you control what title, image, and description appear when your URL is shared on social media platforms.
The recommended OG image size is 1200 × 630 pixels with a 1.91:1 aspect ratio. The minimum is 600 × 315 pixels. Images smaller than this may not display on some platforms, or may appear cropped and low quality. Always use JPG or PNG for best compatibility.
Technically no, but every page that might be shared on social media should have OG tags. Without them, platforms guess which image and text to use — often with poor results that reduce engagement and click-through rates from social networks.
For article pages, set og:type to "article" and add: article:published_time (ISO 8601 date), article:author (author name or URL), and optionally article:section and article:tag for categorisation. These tags help platforms surface your content in news feeds.
OG tags do not directly affect Google rankings, but they help indirectly by increasing social sharing and click-through rates. Higher traffic and engagement signals can positively influence rankings over time — especially for content-heavy sites.
Use Facebook's Sharing Debugger, LinkedIn's Post Inspector, or Twitter's Card Validator. These tools read your live page URL and show exactly how the preview will appear. If you recently changed OG tags, use the "Scrape Again" option to force a cache refresh.
The HTML title tag is used by browsers and search engines. The og:title tag is used only by social platforms for link previews. They can be different — your og:title might be shorter and punchier, while your HTML title is optimised for search click-through.
Social media crawlers cannot access password-protected pages, so OG tags will not render for those URLs. Only publicly accessible pages can be previewed by social platforms. Consider using a public landing page that links through to the protected content instead.
Related Tools
Open Graph tags are the single most effective way to control your brand's appearance across social media. Every time someone shares a link to your page — whether it is a product, an article, or a landing page — the platform reads your OG tags to decide which image, title, and description to display. A generic or missing preview can cut your click-through rate in half. Toolaroid's Open Graph tag generator makes it easy to get this right: enter your details, check all three platform previews side by side, then copy your complete tag block in one click. No login, no limits, no cost.