ToolboxHub

👁️Open Graph Preview

Preview how your website looks when shared on social media.

Share:
0/60
0/160

Facebook / LinkedIn Preview

example.com

Page Title

A description of the page content goes here.

Twitter Large Card Preview

Page Title

A description of the page content goes here.

example.com

Twitter Summary Card Preview

example.com

Page Title

A description of the page content goes here.

About Open Graph Preview

Open Graph Preview renders a realistic mockup of how your page will appear when shared as a link card on Facebook, LinkedIn, Slack, and other platforms that read Open Graph meta tags. Test and refine your og:title, og:description, og:image, and og:url before publishing.

How to Use Open Graph Preview

  1. 1

    Enter your OG tag values

    Fill in your og:title, og:description, og:image URL, and og:url in the input fields.

  2. 2

    Preview the link card

    See a live mockup of how your page will appear as a shared link card on Facebook, LinkedIn, and other platforms.

  3. 3

    Adjust and finalize

    Edit any fields that look off in the preview, then copy the generated HTML meta tags to paste into your site's <head> section.

Common Use Cases

  • Content marketers ensuring their articles display compelling previews when shared
  • Developers testing Open Graph implementation before deploying to production
  • E-commerce teams optimizing product page social sharing previews
  • Blog owners verifying that featured images appear correctly in link cards

Frequently Asked Questions

What are Open Graph meta tags?
Open Graph tags are HTML meta elements (og:title, og:description, og:image, og:url) that control how your page looks when shared as a link preview on social media platforms and messaging apps.
How do I add Open Graph tags to my website?
Add <meta property="og:title" content="...">, <meta property="og:description" content="...">, and <meta property="og:image" content="..."> tags inside your page's <head> section. The preview tool shows how they will render.
What is the ideal og:image size?
The recommended Open Graph image size is 1200×630 pixels at a minimum. Images smaller than 200×200 pixels may not display in all contexts.

Related Articles

Related Tools