A shared link with no Open Graph tags leaves Facebook, LinkedIn, Slack and WhatsApp to guess the title, description and image. The guess is often a cropped logo or a truncated heading. The Kwebby Open Graph Generator builds the tags for you: fill in a short form, check the preview and copy the HTML into your page head.
You will learn what each tag does, which four tags the Open Graph protocol requires and how to publish the markup without the usual mistakes.
Key Takeaways
- The Open Graph protocol requires four properties: og:title, og:type, og:image and og:url.
- Kwebby's Open Graph Generator turns nine form fields into a complete block of og: and twitter: meta tags that you copy in one click.
- Use a 1200 by 630 pixel image with an absolute URL, and add og:image:width, og:image:height and og:image:alt by hand.
- Social platforms cache images by URL, so a changed image needs a new file name to show up.
- Match og:url to your canonical URL and write a social title that differs from your search title when it helps clicks.
- Test every published page with the Open Graph Checker before you share it.
What Is the Kwebby Open Graph Generator?
Kwebby's Open Graph Generator is a free web form that creates Open Graph and Twitter Card meta tags for a page. You enter a title, description, URL and image, choose a content type, and the tool prints ready-to-paste HTML. No account is required.
Open Graph is a metadata standard from ogp.me that tells a platform how to describe your page as a rich object when someone shares its link.
Key Features and How It Works
The generator is a single form with a live preview beside it. Each field maps to one tag in the output, so you can see the effect of every change.
The Form Fields
The form has six text inputs (Title, Description, Page URL, Image URL, Site Name and Twitter Handle) and three drop-downs (OG Type, Locale and Twitter Card). Counters beside Title (95) and Description (200) show how much text you have used. They are guides, not hard limits. Empty fields are left out of the output, quotes and ampersands are escaped, a Twitter Handle typed without @ gets one, and a red note appears if the Page URL or Image URL is not a full https address.
OG Type and Locale Options
OG Type offers website, article, book, music.song, video.movie and profile. Pick article for blog posts and news so you can add article-specific tags later. Locale offers en_US, en_GB, fr_FR, de_DE, es_ES, it_IT, pt_BR, ja_JP and zh_CN.
Twitter Card Options
The Twitter Card selector offers summary and summary_large_image. For most pages, summary_large_image gives the biggest image and matches the default Kwebby uses on its own pages.
Generated HTML and Copy
The output panel prints og:type, og:url, og:title, og:description, og:image, og:site_name and og:locale, followed by twitter:card, twitter:site, twitter:title, twitter:description and twitter:image. Press Copy and paste the block inside the head element of your page.
Why Open Graph Tags Matter
Open Graph tags decide what a shared link looks like, and a good card earns more clicks than a bare URL. The tags do not raise search rankings on their own, but they shape the first impression on every platform that reads them.
The protocol names four required properties: og:title, og:type, og:image and og:url. It also lists og:description, which it defines as a one to two sentence summary, and og:site_name and og:locale as optional extras.
Meta's own guidance adds a practical point. Facebook caches images by URL and does not refresh them unless the URL changes, according to Meta's sharing documentation. A wrong image shipped once can stay on shared posts until you rename the file.
How to Use the Open Graph Generator
Follow these steps to build a tag block for one page.
- Enter the Title. Write the headline you want on the share card. It can differ from your HTML title tag, so use a plainer, more clickable version.
- Write the Description. Add one or two sentences that say what the reader gets. Stay well under the 200 character counter.
- Paste the Page URL. Use the full canonical address, including https://, so every share counts toward one URL.
- Paste the Image URL. Use the absolute address of a 1200 by 630 pixel image on your own domain.
- Add the Site Name and Twitter Handle. Type your brand name and your handle, for example @kwebby.
- Choose OG Type, Locale and Twitter Card. Select article for posts, website for most other pages, then pick the locale and card style.
- Check the preview and copy. Read the preview card, fix any truncated text, press Copy and paste the block into your head element.
- Test the live page. Publish, then run the URL through the Open Graph Checker and Meta's Sharing Debugger.
Best Practices for Open Graph Tags
Good Open Graph markup is short, consistent with the rest of the page and tested after publishing. These practices prevent most broken previews.
Match og:url to the Canonical URL
Set og:url to the same address as your canonical link. If the two disagree, platforms may split likes and shares across URL variants, and the preview can show the wrong page. Common mistake: copying the staging address into the Page URL field.
Use an Absolute 1200 by 630 Image
Use a full https address, not a relative path such as /images/card.jpg. A 1200 by 630 pixel image (a 1.91 to 1 ratio) is the common size for large cards on Facebook, LinkedIn and X. Keep the file under a few hundred kilobytes so the crawler fetches it quickly.
Add Image Width, Height and Alt Text
The generator does not print og:image:width, og:image:height or og:image:alt. Add them by hand under the og:image line. The Open Graph protocol supports all three, and Meta says dimension tags let its crawler render the image right away instead of downloading it first.
Choose the Right OG Type
Use article for blog posts and news, website for the home page and tool pages, and profile for people pages. Meta states that og:type defaults to website when you leave it out, so a post marked as website loses its article meaning.
Write for the Share, Not for the Search Result
A social title can run longer and speak more directly than a search title. Put the distinctive words first, because platforms truncate long lines. Common mistake: pasting your title tag unchanged when it ends in a brand suffix that the card does not need.
Refresh the Cache After a Change
If you swap an image, upload it under a new file name and update the Image URL. Then run the page through the Sharing Debugger, which Meta describes as a way to trigger a fresh scrape.
Common Use Cases
People reach for an Open Graph generator at a few predictable moments.
- Blog launches. Generate a block for each new post with OG Type set to article before you announce it.
- Landing pages. Give every campaign page its own title and image so paid and organic shares look intentional.
- Product and tool pages. Set a clear image and a one-sentence description so the card explains the page without a click.
- Client handoffs. Agencies paste the output into a CMS template and then audit the finished site with the Meta Tags Analyzer.
- Site migrations. After a redesign, regenerate tags for key pages and compare them with what is live.
Related Kwebby Tools
These tools cover the next steps after you copy your tags. Browse more in the SEO Tools hub.
- Open Graph Checker fetches a live URL, lists the OG tags it finds and flags missing required ones. Use it right after you publish.
- Twitter Card Generator builds Twitter-specific card tags when you want control beyond the basic card type.
- Meta Tag Generator writes the title, description and robots tags that sit beside your social tags.
- Schema Markup Generator creates the structured data that search engines read, a separate job from social previews.
- Meta Tags Analyzer reviews the meta tags already on a page, so you can spot gaps before you generate new ones.
Frequently Asked Questions (FAQs)
What are Open Graph tags?
Open Graph tags are meta tags in a page's head that control how the page looks when someone shares it on Facebook, LinkedIn, WhatsApp and similar platforms. They define the title, description, image and URL of the share card.
Which Open Graph tags are required?
The Open Graph protocol requires four properties: og:title, og:type, og:image and og:url. Adding og:description is strongly recommended, because it supplies the text under the title.
What image size should I use for og:image?
Use 1200 by 630 pixels, a 1.91 to 1 ratio, as a safe default for large share cards. Host it on your own domain with an absolute https URL. Smaller images may be shrunk or shown as small thumbnails.
How do I add Open Graph tags to my website?
Generate the tags, then paste them inside the head element of the page's HTML. In a CMS or SEO plugin, enter the same values in its social fields. Publish the page and test it with the Open Graph Checker.
Do Open Graph tags affect SEO?
Open Graph tags are not a direct ranking factor. They influence how often people click and share your links, which can bring traffic and mentions that help your site indirectly.
Is the Kwebby Open Graph Generator free?
Yes. The Open Graph Generator is free to use and needs no account.
Final Thoughts
Open Graph tags are short to write and control the first impression of every link you share. Fill in the form once per page, add image width, height and alt text, and keep og:url equal to your canonical address.
Generate your first block now, publish it and verify it with the Open Graph Checker. If you need a site that ships with this metadata built in, see Kwebby's development services.