Open Graph Tag – What is it and why is it worth using in your website?
Posted: Sun Dec 22, 2024 7:17 am
Combining the power of Facebook and Twitter with a website can provide an even greater increase in traffic and profits. Open Graph tags can be such a bond between them. Thanks to them, you gain free email lists uk over what links shared on social media look like, regarding your website or online store. So check out how to implement Open Graph protocols on your website in a few steps.
The article answers the questions:
What are Open Graph tags and why should you implement them?
How to implement Open Graph markup on your website?
How to test implemented Open Graph markup using tester?
Contents:
Open Graph – what is it?
Open Graph Protocols in Practice
Open Graph Tags
Additional Open Graph Tags
How to add Open Graph tags in WordPress?
Open Graph on Twitter
Why is it worth implementing Open Graph on your website?
Open Graph Tester – Check if you are implementing meta tags correctly
Open Graph – what is it?
Open Graph are meta tags developed in 2010 by Facebook. They are currently used not only for Facebook but also for other social media. Their task is to integrate between a website and social media. Open Graph tags give you control over the appearance of links that are displayed on social media. You can choose the exact title, description and image that will be displayed next to the link, which is to encourage more users to go to your website.
Open Graph Protocols in Practice
Now let’s move on to the practical part, to learn how to implement Open Graph protocols . When you want to reap the benefits of using these meta tags, you need to make a few changes to your site’s code. Don’t worry, the whole process is really very easy. If you have a WordPress site, you can use the Yoast SEO plugin for this purpose.
Without a plugin, you just need to go to your site's source code and to the section to add a meta tag, which will look like this:
< meta property = "og:title" content = "page title" / >
The og:title tag is just an example of a display title, below you will find other types of tags and tips on how to change the code depending on what tags you want to add or change.
Open Graph Tags
Among the basic Open Graph tags we can distinguish:
og:title – the tag refers to the title of the page where the link leads. You can identify it somewhat with the meta title (displayed in the search engine), because in both cases they encourage clicking the link and cannot be too long. It is best for the og:title to be no longer than 40-60 characters with spaces (for mobile devices it is better to stick to the 40-character limit) and strictly related to the content of the page.
The article answers the questions:
What are Open Graph tags and why should you implement them?
How to implement Open Graph markup on your website?
How to test implemented Open Graph markup using tester?
Contents:
Open Graph – what is it?
Open Graph Protocols in Practice
Open Graph Tags
Additional Open Graph Tags
How to add Open Graph tags in WordPress?
Open Graph on Twitter
Why is it worth implementing Open Graph on your website?
Open Graph Tester – Check if you are implementing meta tags correctly
Open Graph – what is it?
Open Graph are meta tags developed in 2010 by Facebook. They are currently used not only for Facebook but also for other social media. Their task is to integrate between a website and social media. Open Graph tags give you control over the appearance of links that are displayed on social media. You can choose the exact title, description and image that will be displayed next to the link, which is to encourage more users to go to your website.
Open Graph Protocols in Practice
Now let’s move on to the practical part, to learn how to implement Open Graph protocols . When you want to reap the benefits of using these meta tags, you need to make a few changes to your site’s code. Don’t worry, the whole process is really very easy. If you have a WordPress site, you can use the Yoast SEO plugin for this purpose.
Without a plugin, you just need to go to your site's source code and to the section to add a meta tag, which will look like this:
< meta property = "og:title" content = "page title" / >
The og:title tag is just an example of a display title, below you will find other types of tags and tips on how to change the code depending on what tags you want to add or change.
Open Graph Tags
Among the basic Open Graph tags we can distinguish:
og:title – the tag refers to the title of the page where the link leads. You can identify it somewhat with the meta title (displayed in the search engine), because in both cases they encourage clicking the link and cannot be too long. It is best for the og:title to be no longer than 40-60 characters with spaces (for mobile devices it is better to stick to the 40-character limit) and strictly related to the content of the page.