Introduction
Open Graph Title & Description tags help you control how your content is displayed when shared on social platforms like Facebook, LinkedIn, and WhatsApp. These tags improve click-through rates and engagement.
Open Graph Example Code
<head>
<meta property="og:title" content="Bootstrap 5 Examples — QuickDevTips" />
<meta property="og:description" content="Discover quick and responsive Bootstrap 5 snippets for developers." />
</head>
How It Works
The og:title
and og:description
meta tags are part of the Open Graph protocol. Social platforms read these values to generate previews with consistent text when someone shares your link.
Why Use This?
Without Open Graph tags, platforms may randomly pull text from your page, leading to messy or irrelevant previews. With them, you ensure a clean, professional appearance.
Common Mistake
Using the same Open Graph description for every page can harm engagement. Customize tags per page to maximize social visibility.
Pro Tip
Combine Open Graph tags with proper images (og:image
) to create rich social previews. Always test with Facebook’s Sharing Debugger.