{"id":25972,"date":"2024-10-22T16:28:30","date_gmt":"2024-10-22T06:28:30","guid":{"rendered":"https:\/\/digitalnomadshq.com.au\/?post_type=glossary&amp;p=25972"},"modified":"2024-10-22T16:28:30","modified_gmt":"2024-10-22T06:28:30","slug":"open-graph-meta-tags","status":"publish","type":"glossary","link":"https:\/\/digitalnomadshq.com.au\/glossary\/open-graph-meta-tags\/","title":{"rendered":"Open Graph Meta Tags"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">What are Open Graph Meta Tags?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">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.&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The Open Graph internet protocol was developed with the goal to simplify how a website\u2019s URL was shared and displayed, making them more visually appealing. Here\u2019s what out website looks like when shared on Facebook:&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><img decoding=\"async\" src=\"blob:https:\/\/digitalnomadshq.com.au\/54f63f0b-4aeb-41b0-b788-40482c90ccfd\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Facebook\u2019s 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:&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>og:title<\/strong> This is the title of the page being shared. I\u00a0<\/li>\n\n\n\n<li><strong>og:type<\/strong> Defines the type of content you are sharing, such as an article, book, or video.\u00a0<\/li>\n\n\n\n<li><strong>og:url<\/strong> The canonical URL of the page\u00a0<\/li>\n\n\n\n<li><strong>og:image<\/strong> The image that will appear alongside the shared content, making the post more visually appealing.\u00a0<\/li>\n\n\n\n<li><strong>og:description<\/strong> A brief description, typically two to four sentences, giving an overview of the page&#8217;s content and encourages users to click through.\u00a0<\/li>\n<\/ul>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Why Are Open Graph Tags Important?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">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\u2014such as the title, description, image, and other elements. Not only does this ensure that your content looks polished and inviting when it&#8217;s shared but it can improve the chances that people will click through to your site.&nbsp;&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If these tags are not implemented, they will be automatically generated based on the <a href=\"https:\/\/digitalnomadshq.com.au\/glossary\/url-slug\/\" target=\"_blank\" rel=\"noreferrer noopener\">page\u2019s URL<\/a>, title, and <a href=\"https:\/\/digitalnomadshq.com.au\/glossary\/meta-description\/\" target=\"_blank\" rel=\"noreferrer noopener\">meta description<\/a>.&nbsp;&nbsp;<\/p>\n\n\n\n<div style=\"height:0px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">How To Set Open Graph Meta Tags?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Setting open graph meta tags will differ based on the website platform you are using.&nbsp;&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">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&#8217;s code directly.&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If you&#8217;re not using WordPress, you&#8217;ll need to manually add the meta tags to your website&#8217;s HTML header. This involves inserting the appropriate Open Graph tags (e.g., og:title, og:image, etc.) between the &lt;head&gt; tags in your website&#8217;s code.&nbsp;&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can check if they are working as needed with Facebook\u2019s <a href=\"https:\/\/developers.facebook.com\/tools\/debug\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Sharing Debugger<\/a>.&nbsp;&nbsp;<\/p>\n","protected":false},"featured_media":0,"parent":0,"template":"","meta":{"_acf_changed":false,"content-type":""},"class_list":["post-25972","glossary","type-glossary","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/digitalnomadshq.com.au\/wp-json\/wp\/v2\/glossary\/25972","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitalnomadshq.com.au\/wp-json\/wp\/v2\/glossary"}],"about":[{"href":"https:\/\/digitalnomadshq.com.au\/wp-json\/wp\/v2\/types\/glossary"}],"wp:attachment":[{"href":"https:\/\/digitalnomadshq.com.au\/wp-json\/wp\/v2\/media?parent=25972"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}