Facebook and Twitter Open Graph tags help your website show up in the social media feeds. It is essential as it gives users reasons to click on your site and visit it. You can use these tags for various purposes, such as:
— To promote an event or sale
— To provide information about products or services
— To share pictures from your business’s location.
It will go over different types of open graph meta tags that are available.
Types Of Open Graph Meta Tags
There are four different types of open graph meta tags: images (ofimage:), videos (og:video), titles (og:title) and descriptions (og:description). Each type has its purpose. For instance, og:-image: is used to preview an image, and og:-video: provides video previews.
Images (ofimage:)
The ofimage: tag supports the following types of images — jpg, jpeg, gif, or png. You can add multiple tags for different sizes by adding ‘s’ after the style; this specifies that it should be scaled down when posted on Facebook according to its pixel size in pixels per inch ratio concerning the screen resolution.
Videos (og:video)
The og: video tag is used to share a preview of your videos on social media, and it supports MPV or WebM formats. You can specify both width and height parameters for the preview image shown by adding “w” or “h,” respectively; this corresponds to maximum dimensions of what should appear within the feed when someone clicks on it.
Titles & Descriptions (og:titledescription)
Both titles and descriptions are important because they provide more information about your site and help people decide whether they should click on it. You can write either one or both of these tags, but the content in each tag should be different.
Facebook Open Graph Meta Tags
The Facebook Open Graph protocol has five types of open graph meta tags that are used for various purposes: og:-image, og:-video, ogsitelink, oglocale, and ogres-. The following information will discuss how these are typically used.
— To promote an event or sale: For this type of meta tag, you would include the event name and date in your Title and Description tags so that people will know when it is happening.
— To provide information about products or services: For this type of open graph meta tag, be sure to use keywords such as product names and related features.
— To share pictures from your business’s location: To transfer photos from your business’s location on Facebook (or Instagram.), insert an og:locale=”en_US” with a link to the image in your description.
— To share videos and pictures from other websites: If you want to share content found on another website, it’s essential for people who view your site to know where those images or clips originated.
— To share blog post content on Facebook: Make sure you have an og: title that specifies your article’s headline followed by a description establishing more context about what it’s all about. Include ‘ogp:’ before the URL if you want images from other websites or videos embedded within the said article; otherwise, include -open graph-markup=false, which will not embed them but instead provide links back from where they are.
For Twitter, og: image and onsite link are the two types you need to put into open graph meta tags for Twitter feeds. As with Facebook, if there are any links embedded within a said image, such as Twitter handles (@username), then include -oghrefs-incontent=true or ‘ogp:’ before the URL that it embeds them instead of just providing a link back to its original website. Lastly, add an ‘image parameter with the URL and size parameters specified as part of the URL, found in the OpenGraph protocol. The final thing you should do is change the ‘og:’ to “Twitter.”
In Conclusion
This post discussed how to use Facebook and Twitter meta tags for social media posts. Open graph meta tags are a powerful way of providing context around what you’re sharing, along with helpful additional information in determining whether or not they want to engage further.