What are Open Graph Meta Tags?
Open graph meta tags are snippets of code that are used to determine how a website is displayed when links are shared on social media and instant messaging apps. It was first developed by Facebook in 2010 and has since been adopted by other social networks like Twitter, Pinterest, LinkedIn, WhatsApp and more.
The Open Graph internet protocol was developed with the goal to simplify how a website’s URL was shared and displayed, making them more visually appealing. Here’s what out website looks like when shared on Facebook:
Facebook’s documentation provides a wide range of Open Graph meta tags, but there are five key tags that are essential for all types of content to ensure your page is displayed correctly when shared:
- og:title This is the title of the page being shared. I
- og:type Defines the type of content you are sharing, such as an article, book, or video.
- og:url The canonical URL of the page
- og:image The image that will appear alongside the shared content, making the post more visually appealing.
- og:description A brief description, typically two to four sentences, giving an overview of the page’s content and encourages users to click through.
Why Are Open Graph Tags Important?
Open Graph meta tags are particularly important for driving engagement and increasing visibility on social media. They allow you control how your webpage appears when someone shares it—such as the title, description, image, and other elements. Not only does this ensure that your content looks polished and inviting when it’s shared but it can improve the chances that people will click through to your site.
If these tags are not implemented, they will be automatically generated based on the page’s URL, title, and meta description.
How To Set Open Graph Meta Tags?
Setting open graph meta tags will differ based on the website platform you are using.
For WordPress, one of the most popular Content Management Systems (CMS), the process can be simplified by using SEO plugins like Yoast SEO or Rank Math. These plugins provide easy-to-use interfaces that allow you to add Open Graph meta tags without needing to edit your website’s code directly.
If you’re not using WordPress, you’ll need to manually add the meta tags to your website’s HTML header. This involves inserting the appropriate Open Graph tags (e.g., og:title, og:image, etc.) between the <head> tags in your website’s code.
You can check if they are working as needed with Facebook’s Sharing Debugger.