ProMapRanker
🛠 Scheduled maintenance: We're performing scheduled maintenance on our scanning engine. New scans, audits and lookups are temporarily paused and will resume in approximately 12 hours. Your existing reports and dashboards remain fully available.
Free tools · Meta & SERP Tools

Open Graph Generator

Build Open Graph meta tags so your pages share with the right title, image, and description on Facebook and LinkedIn. Live card preview included.

Live preview

No image set


What is an open graph generator?

An open graph generator is a free tool that builds the open graph meta tags a web page needs so it shows a clean, branded preview when someone shares its link on Facebook, LinkedIn, Slack, iMessage, or WhatsApp. You paste in a page title, a description, an image, and a URL, and the tool returns ready-to-copy open graph tags that you drop into the head section of your HTML. Instead of hand-typing property attributes and guessing the right values, you get a correct block in seconds.

In plain terms, it converts your page details into the exact og tags that social platforms read. Those tags control the headline, the summary line, and the thumbnail on the social share preview, so the difference between a blank grey box and a polished card usually comes down to whether your open graph meta tags were written correctly in the first place.

The Open Graph protocol was created by Facebook and is now supported by nearly every major platform, from LinkedIn and Pinterest to messaging apps like WhatsApp, Slack, Discord, and iMessage. Because they all read the same set of og tags, one correct block of markup produces a consistent preview everywhere your link travels. That universality is exactly why a small tool that writes the markup for you saves so much time: you author the details once and every platform benefits.

Open graph generator building og tags for a social share preview

How do you use the Open Graph Generator?

Using the Open Graph Generator takes under a minute. You fill in a few fields that describe your page, preview how the card will look, then copy the generated open graph tags into your site. There is nothing to install and no account required to build a tag block. The tool handles the fiddly parts for you, wrapping each value in the correct property and content attributes and escaping characters that would otherwise break the markup.

  1. Enter your page URL so the tool can set og:url to the canonical, absolute address.
  2. Type your og:title, keeping it near 60 characters so it does not get cut off.
  3. Write your og:description, aiming for around 110 characters that sell the click.
  4. Add your og:image URL, ideally a 1200x630 pixel image for a crisp social share preview.
  5. Pick the og:type, which is usually "website" for a page or "article" for a blog post.
  6. Copy the ready-to-paste OG meta tags from the output box into the head of your page.

After you paste the tags, it pays to confirm they render the way you expect. Share the URL privately into a Slack direct message to yourself, or run it through Facebook's Sharing Debugger, and check that the image, title, and description all appear. If a platform still shows an old preview, that is caching, not a broken tag, and a quick re-scrape usually clears it. Once the card looks right in one place, it will look right across the others because they read the same og tags.

Why do open graph tags matter for local SEO and social sharing?

Open graph tags matter because they decide how your page looks the moment it gets shared, and a strong card earns far more clicks than a broken one. When a customer posts your local business page in a neighborhood Facebook group or a colleague drops it into a Slack channel, the platform pulls your og tags to build the card. Good open graph meta tags mean a real photo, a clear headline, and a tempting description, which pulls people back to your site.

For a local business, that click-through is money. A plumber, dentist, or restaurant shared on LinkedIn or WhatsApp with a sharp social share preview looks trustworthy and established. The same link with a missing og:image shows a plain text stub that almost nobody taps. Since social referrals often land on the exact service page you want ranking, the extra visits and engagement can reinforce the signals that help that page perform in local search.

It is worth being precise here: open graph tags do not directly change your Google rankings. What they change is behavior. Better previews lift share rates and click-through, which drives traffic, brand searches, and links, and those are the things that genuinely move local visibility over time. Getting your og tags right is cheap insurance that every share of your page works as hard as it can.

Understanding the open graph tags this tool builds

This section breaks down the anatomy of the open graph tags the generator writes for you. Each tag is a single line in your page head that uses a property attribute and a content attribute. The four required properties are og:title, og:type, og:image, and og:url, and together they are enough for most platforms to render a complete social share preview.

How an open graph generator turns a page URL into open graph tags and a social share preview A left to right flow: a web page URL feeds into the Open Graph Generator, which outputs og:title, og:image and og:url meta tags, producing a social share card with an image, title and description. From page URL to social share preview Web page your-site.com Open Graph Generator OG meta tags og:title og:image og:url image Title description your-site.com Paste the generated open graph tags into your page head og:title | og:type | og:image | og:url

og:title

The og:title sets the bold headline of your social share preview, and it does not have to match your page title tag. Keep it close to 60 characters so platforms do not truncate it. Write it to earn the click, leading with the benefit or the location for a local page rather than a bare brand name.

og:description

The og:description is the short summary line under the title on the card. Aim for around 110 characters of clear, specific copy. This is one of the most valuable open graph meta tags for click-through because it is your one sentence of persuasion. Avoid keyword stuffing and write it like ad copy that tells a person exactly what they will get.

og:image

The og:image is the single most eye-catching part of any social share preview, so treat it with care. Use an absolute URL and a 1200x630 pixel image at the 1.91:1 ratio recommended for large cards. One clear image per page beats a cluttered one, and a strong og:image is often the difference between a share people notice and one they scroll straight past. Keep important detail away from the outer edges, since some platforms crop the image slightly, and avoid tiny text that turns to mush at thumbnail size. For a local business, a real photo of the storefront, team, or a finished job tends to outperform a generic stock graphic because it feels authentic and specific to your area.

og:url

The og:url tells platforms the canonical, absolute address of the page. It should point to the clean version of the URL without tracking parameters, so all shares and engagement consolidate onto one address. Getting og:url right keeps your open graph tags consistent no matter which link variant someone happened to share. Think of it as the social equivalent of a canonical tag: if you run the same page under http and https, or with and without a trailing slash, og:url is how you tell every platform which single version is the real one to attribute the share to.

og:type

The og:type describes what the page is. Use "website" for a homepage or standard landing page and "article" for a blog post or news item. It is one of the four required og tags, and while it rarely changes the visible card, setting it correctly keeps your open graph meta tags valid and predictable across platforms.

Best practices and common mistakes

Most broken previews come from a handful of avoidable errors. The rules below keep your open graph tags clean and your social share preview reliable across every platform that reads them.

  • Size your og:image at 1200x630 pixels (1.91:1). Anything much smaller can render as a tiny thumbnail or get cropped awkwardly.
  • Always use absolute URLs for og:image and og:url. Relative paths like /photo.jpg fail because the crawler has no domain to resolve them against.
  • Use exactly one og:image per page. Multiple image tags confuse some platforms and can surface the wrong picture on your card.
  • Respect character limits. Keep og:title near 60 characters and og:description near 110 so nothing gets cut off mid-word.
  • Escape special characters. Ampersands, quotes, and angle brackets in your title or description should be encoded so the tag stays valid HTML.
  • Host og:image on HTTPS. Mixed content or an image behind a login will show up blank in the social share preview.
  • Do not skip og:description. It is optional in the spec, but leaving it out means platforms guess your summary from page text, which often reads awkwardly.
  • Add og:site_name so your brand appears alongside the card, which reinforces recognition every time the link is shared.

A final habit worth building: re-check your tags whenever you redesign a page or change its main image. It is easy to update a hero photo in your CMS and forget that the og:image still points at the old file, which then keeps appearing on every share. Treat the og tags as part of the page, not a set-and-forget afterthought, and your previews stay accurate as the site evolves.

When should you use an open graph generator?

You should use an open graph generator any time a page will be shared and you want that share to look intentional. It is the fastest way to guarantee correct og tags without memorizing the syntax, and it is useful whether you manage one site or dozens.

  • Launching a new landing page. Set the og tags before you promote it so the very first shares on social already show a polished card.
  • Fixing a local business homepage. If your site currently shares as a blank box, generate proper open graph meta tags to make every referral look credible.
  • Publishing a blog post. Give each article its own og:title, og:description, and og:image so it stands out when readers share it around.
  • Running client sites at an agency. Produce consistent open graph tags across many pages quickly, then hand a clean tag block to each site owner.
  • Refreshing an older site. If your pages were built before social sharing mattered, they may have no og tags at all, and adding them is a fast, high-visibility win.

The common thread is intent. If a page has any chance of being shared by a customer, a partner, or your own marketing team, it deserves proper open graph meta tags. The cost of adding them is a couple of minutes, and the payoff is every future share looking deliberate instead of accidental. Pages you never link publicly, like an internal thank-you screen, do not need the same attention, so you can focus your effort where sharing actually happens.

Frequently asked questions

Is this open graph generator really free?

Yes. This tool is completely free to use, with no signup and no limit on how many tag blocks you build. You paste in your page details, copy the generated open graph tags, and add them to your site. There is nothing to install and nothing to pay, so you can generate as many pages as you need.

What are the four required open graph tags?

The four required properties defined by the protocol are og:title, og:type, og:image, and og:url. Together they give platforms everything needed to build a basic card. You can add optional tags like og:description and og:site_name to enrich the social share preview, but those four are the core.

What image size should I use for og:image?

Use 1200x630 pixels, which matches the 1.91:1 ratio platforms recommend for large link cards. Keep the file on an absolute HTTPS URL and under a few hundred kilobytes. A correctly sized og:image renders sharp on both desktop and mobile instead of appearing tiny or cropped.

Why is my social share preview not updating?

Platforms cache your og tags, so old previews can linger after you change them. Facebook offers a Sharing Debugger that re-scrapes your page and refreshes the cache on demand. Run your URL through it after editing your open graph meta tags and the new card should appear.

Do open graph tags help SEO?

Not directly. Open graph tags do not change how search engines rank a page, but they lift click-through and share rates, which drives more traffic and engagement. Those downstream effects can support your visibility, so treating og tags as part of your SEO hygiene is smart.

Where do I put the generated open graph tags?

Paste them inside the head section of your HTML, alongside your title and meta description tags. They must live in the head, not the body, so crawlers can read them before rendering the page. Most site builders and CMS platforms have a custom head or SEO field for this.

See where your pages actually rank

Clean open graph tags win the click, but you still need to know whether those pages show up when local customers search. ProMapRanker tracks your Google Map Pack and local rankings across a real geographic grid, so you can see exactly where you stand and where to improve. start free with 150 credits and turn better previews into measurable local visibility.

Related tools

To go deeper on the standard itself, the official Open Graph protocol documentation lists every property, and Facebook's sharing guide for webmasters covers debugging and best practices for the social share preview.

Related tools

Track your real Google Maps rankings

These free tools get you set up - ProMapRanker shows where you actually rank across your whole service area on a geo-grid.

Start free - 150 credits