CINXE.COM
How to Add Open Graph Tags to Your Blogger Website | AddThis Academy
<!DOCTYPE html> <html lang="en-US" prefix="og: http://ogp.me/ns#"> <head><script type="text/javascript" src="https://web-static.archive.org/_static/js/bundle-playback.js?v=7YQSqjSh" charset="utf-8"></script> <script type="text/javascript" src="https://web-static.archive.org/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="https://web-static.archive.org/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/","20211025152319","https://web.archive.org/","web","https://web-static.archive.org/_static/", "1635175399"); </script> <link rel="stylesheet" type="text/css" href="https://web-static.archive.org/_static/css/banner-styles.css?v=p7PEIJWi" /> <link rel="stylesheet" type="text/css" href="https://web-static.archive.org/_static/css/iconochive.css?v=3PDvdIFv" /> <!-- End Wayback Rewrite JS Include --> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> <title>How to Add Open Graph Tags to Your Blogger Website | AddThis Academy</title> <link rel="profile" href="http://gmpg.org/xfn/11"> <link rel="pingback" href="https://www.addthis.com/academy/xmlrpc.php"/> <link rel="dns-prefetch" href="//web.archive.org/web/20211025152319/https://fonts.googleapis.com/"> <link href="//web.archive.org/web/20211025152319cs_/https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700&lang=en" rel="stylesheet"> <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1"/> <!-- This site is optimized with the Yoast SEO plugin v16.2 - https://yoast.com/wordpress/plugins/seo/ --> <meta name="description" content="In this article, we will go over how to install Open Graph meta tags on your Blogger website to instruct Facebook and other share services what to content to preview for your webpages."/> <link rel="canonical" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/"/> <meta property="og:locale" content="en_US"/> <meta property="og:type" content="article"/> <meta property="og:title" content="How to Add Open Graph Tags to Your Blogger Website | AddThis Academy"/> <meta property="og:description" content="In this article, we will go over how to install Open Graph meta tags on your Blogger website to instruct Facebook and other share services what to content to preview for your webpages."/> <meta property="og:url" content="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/"/> <meta property="og:site_name" content="AddThis Academy"/> <meta property="article:published_time" content="2019-06-04T21:53:47+00:00"/> <meta property="article:modified_time" content="2019-06-05T17:41:06+00:00"/> <meta property="og:image" content="https://web.archive.org/web/20211025152319im_/https://blog.addthiscdn.com/wp-content/uploads/2015/11/blogger.png"/> <meta property="og:image:width" content="500"/> <meta property="og:image:height" content="500"/> <meta name="twitter:card" content="summary_large_image"/> <meta name="twitter:label1" content="Written by"> <meta name="twitter:data1" content="Kristin Schallhorn"> <meta name="twitter:label2" content="Est. reading time"> <meta name="twitter:data2" content="2 minutes"> <script type="application/ld+json" class="yoast-schema-graph">{"@context":"https://web.archive.org/web/20211025152319/https://schema.org","@graph":[{"@type":"WebSite","@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/#website","url":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/","name":"AddThis Academy","description":"Become a Better Online Marketer","potentialAction":[{"@type":"SearchAction","target":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/?s={search_term_string}","query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/#primaryimage","inLanguage":"en-US","url":"https://web.archive.org/web/20211025152319/https://blog.addthiscdn.com/wp-content/uploads/2015/11/blogger.png","contentUrl":"https://web.archive.org/web/20211025152319/https://blog.addthiscdn.com/wp-content/uploads/2015/11/blogger.png","width":500,"height":500},{"@type":"WebPage","@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/#webpage","url":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/","name":"How to Add Open Graph Tags to Your Blogger Website | AddThis Academy","isPartOf":{"@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/#website"},"primaryImageOfPage":{"@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/#primaryimage"},"datePublished":"2019-06-04T21:53:47+00:00","dateModified":"2019-06-05T17:41:06+00:00","author":{"@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/#/schema/person/4236ea1a19da790823e3631c643ea51c"},"description":"In this article, we will go over how to install Open Graph meta tags on your Blogger website to instruct Facebook and other share services what to content to preview for your webpages.","breadcrumb":{"@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/"]}]},{"@type":"BreadcrumbList","@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"item":{"@type":"WebPage","@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/","url":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/","name":"Home"}},{"@type":"ListItem","position":2,"item":{"@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/#webpage"}}]},{"@type":"Person","@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/#/schema/person/4236ea1a19da790823e3631c643ea51c","name":"Kristin Schallhorn","image":{"@type":"ImageObject","@id":"https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/#personlogo","inLanguage":"en-US","url":"https://web.archive.org/web/20211025152319/https://secure.gravatar.com/avatar/218c94e73adc87987a798b9fa42955e9?s=96&d=mm&r=g","contentUrl":"https://web.archive.org/web/20211025152319/https://secure.gravatar.com/avatar/218c94e73adc87987a798b9fa42955e9?s=96&d=mm&r=g","caption":"Kristin Schallhorn"}}]}</script> <!-- / Yoast SEO plugin. --> <link rel="dns-prefetch" href="//web.archive.org/web/20211025152319/https://consent.truste.com/"/> <link rel="dns-prefetch" href="//web.archive.org/web/20211025152319/https://www.addthis.com/"/> <link rel="dns-prefetch" href="//web.archive.org/web/20211025152319/https://s7.addthis.com/"/> <link rel="dns-prefetch" href="//web.archive.org/web/20211025152319/https://www.oracle.com/"/> <link rel="dns-prefetch" href="//web.archive.org/web/20211025152319/https://fonts.googleapis.com/"/> <link rel="dns-prefetch" href="//web.archive.org/web/20211025152319/https://s.w.org/"/> <link href="https://web.archive.org/web/20211025152319/https://fonts.gstatic.com/" crossorigin rel="preconnect"/> <link rel="alternate" type="application/rss+xml" title="AddThis Academy » Feed" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/feed/"/> <link rel="alternate" type="application/rss+xml" title="AddThis Academy » Comments Feed" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/comments/feed/"/> <link rel="alternate" type="application/rss+xml" title="AddThis Academy » How to Add Open Graph Tags to Your Blogger Website Comments Feed" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/feed/"/> <script> window._wpemojiSettings = {"baseUrl":"https:\/\/web.archive.org\/web\/20211025152319\/https:\/\/s.w.org\/images\/core\/emoji\/13.0.1\/72x72\/","ext":".png","svgUrl":"https:\/\/web.archive.org\/web\/20211025152319\/https:\/\/s.w.org\/images\/core\/emoji\/13.0.1\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/web.archive.org\/web\/20211025152319\/https:\/\/www.addthis.com\/academy\/wp-includes\/js\/wp-emoji-release.min.js?ver=5.7.1"}}; !function(e,a,t){var n,r,o,i=a.createElement("canvas"),p=i.getContext&&i.getContext("2d");function s(e,t){var a=String.fromCharCode;p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,e),0,0);e=i.toDataURL();return p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,t),0,0),e===i.toDataURL()}function c(e){var t=a.createElement("script");t.src=e,t.defer=t.type="text/javascript",a.getElementsByTagName("head")[0].appendChild(t)}for(o=Array("flag","emoji"),t.supports={everything:!0,everythingExceptFlag:!0},r=0;r<o.length;r++)t.supports[o[r]]=function(e){if(!p||!p.fillText)return!1;switch(p.textBaseline="top",p.font="600 32px Arial",e){case"flag":return s([127987,65039,8205,9895,65039],[127987,65039,8203,9895,65039])?!1:!s([55356,56826,55356,56819],[55356,56826,8203,55356,56819])&&!s([55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]);case"emoji":return!s([55357,56424,8205,55356,57212],[55357,56424,8203,55356,57212])}return!1}(o[r]),t.supports.everything=t.supports.everything&&t.supports[o[r]],"flag"!==o[r]&&(t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&t.supports[o[r]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOMReady=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(n=function(){t.readyCallback()},a.addEventListener?(a.addEventListener("DOMContentLoaded",n,!1),e.addEventListener("load",n,!1)):(e.attachEvent("onload",n),a.attachEvent("onreadystatechange",function(){"complete"===a.readyState&&t.readyCallback()})),(n=t.source||{}).concatemoji?c(n.concatemoji):n.wpemoji&&n.twemoji&&(c(n.twemoji),c(n.wpemoji)))}(window,document,window._wpemojiSettings); </script> <style> img.wp-smiley, img.emoji { display: inline !important; border: none !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 .07em !important; vertical-align: -0.1em !important; background: none !important; padding: 0 !important; } </style> <link rel="stylesheet" id="wp-block-library-css" href="https://web.archive.org/web/20211025152319cs_/https://www.addthis.com/academy/wp-includes/css/dist/block-library/style.min.css?ver=5.7.1" media="all"/> <link rel="stylesheet" id="wp-block-library-theme-css" href="https://web.archive.org/web/20211025152319cs_/https://www.addthis.com/academy/wp-includes/css/dist/block-library/theme.min.css?ver=5.7.1" media="all"/> <link rel="stylesheet" id="atcm-style-main-css" href="https://web.archive.org/web/20211025152319cs_/https://www.addthis.com/academy/wp-content/plugins/addthis-consent-manager/assets/css/main.css?ver=5.7.1" media="all"/> <link rel="stylesheet" id="boostrap-style-css" href="https://web.archive.org/web/20211025152319cs_/https://www.addthis.com/academy/wp-content/themes/academy-v3/css/bootstrap.min.css?ver=5.7.1" media="all"/> <link crossorigin="anonymous" rel="stylesheet" id="twentyfourteen-lato-css" href="https://web.archive.org/web/20211025152319cs_/https://fonts.googleapis.com/css?family=Lato%3A300%2C400%2C700%2C900%2C300italic%2C400italic%2C700italic&subset=latin%2Clatin-ext&display=fallback" media="all"/> <link rel="stylesheet" id="genericons-css" href="https://web.archive.org/web/20211025152319cs_/https://www.addthis.com/academy/wp-content/themes/twentyfourteen/genericons/genericons.css?ver=3.0.3" media="all"/> <link rel="stylesheet" id="twentyfourteen-style-css" href="https://web.archive.org/web/20211025152319cs_/https://www.addthis.com/academy/wp-content/themes/academy-v3/style.css?ver=20190507" media="all"/> <link rel="stylesheet" id="twentyfourteen-block-style-css" href="https://web.archive.org/web/20211025152319cs_/https://www.addthis.com/academy/wp-content/themes/twentyfourteen/css/blocks.css?ver=20190102" media="all"/> <!--[if lt IE 9]> <link rel='stylesheet' id='twentyfourteen-ie-css' href='https://www.addthis.com/academy/wp-content/themes/twentyfourteen/css/ie.css?ver=20140701' media='all' /> <![endif]--> <script src="https://web.archive.org/web/20211025152319js_/https://www.addthis.com/academy/wp-content/plugins/addthis-consent-manager/assets/js/ConsentManager.js?ver=5.7.1" id="atcm-consentmanager-js" class="trustecm_done" trackertype="required"></script> <script src="https://web.archive.org/web/20211025152319js_/https://www.addthis.com/academy/wp-content/plugins/addthis-consent-manager/assets/js/js.cookie-2.2.0.min.js?ver=5.7.1" id="js-cookie-js" class="trustecm_done" trackertype="required"></script> <script id="atcm-main-js-before" class="trustecm_done" trackertype="required"> var _at_consentmanager_cfg = {"debug":false,"domain":".addthis.com"}; </script> <script src="https://web.archive.org/web/20211025152319js_/https://www.addthis.com/academy/wp-content/plugins/addthis-consent-manager/assets/js/main.js?ver=5.7.1" id="atcm-main-js" class="trustecm_done" trackertype="required"></script> <script id="jquery-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-content/themes/academy-v3/js/jquery.1.9.1.min.js?ver=5.7.1"></script> <script id="bootstrap-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-content/themes/academy-v3/js/bootstrap.min.js?ver%5B0%5D=jquery"></script> <script id="atacademy-scripts-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-content/themes/academy-v3/js/scripts.js?ver=5.7.1"></script> <link rel="https://api.w.org/" href="https://www.addthis.com/academy/wp-json/"/><link rel="alternate" type="application/json" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/wp-json/wp/v2/posts/1371"/><link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://www.addthis.com/academy/xmlrpc.php?rsd"/> <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://www.addthis.com/academy/wp-includes/wlwmanifest.xml"/> <meta name="generator" content="WordPress 5.7.1"/> <link rel="shortlink" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/?p=1371"/> <link rel="alternate" type="application/json+oembed" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.addthis.com%2Facademy%2Fhow-to-add-open-graph-tags-using-blogger%2F"/> <link rel="alternate" type="text/xml+oembed" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.addthis.com%2Facademy%2Fhow-to-add-open-graph-tags-using-blogger%2F&format=xml"/> <meta property="og:title" content="How to Add Open Graph Tags to Your Blogger Website"/> <meta property="og:type" content="blog"/> <meta property="og:image" content="https://web.archive.org/web/20211025152319im_/https://blog.addthiscdn.com/wp-content/uploads/2015/11/blogger-500x372.png"/> <meta property="og:url" content="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/"/> <meta property="og:site_name" content="AddThis Academy"/> <meta property="og:description" content="Become a Better Online Marketer"/> <link rel="amphtml" href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/how-to-add-open-graph-tags-using-blogger/amp/"> <script class="trustecm" trackertype="functional" type="text/plain"> // MOAT (function(){function t(){for(var a=[8],e=1;2>=e;e++)a.push(8+e),a.push(8-e);a=a[Math.floor(Math.random()*a.length)];return{b:a,a:0==Math.floor(Math.random()*a)}}function g(a){var e=a=a.replace(":","");try{for(var b=0;100>b&&(a=decodeURIComponent(a),e!=a)&&!a.match(/^http(s)?\:/);b++)e=a}catch(c){}return a.replace(/(^\s+|\s+$)/g,"")}try{if(!location||!location.hostname||!location.pathname)return!1;var c=document.location.hostname.replace(/^www\./,""),u=function(){for(var a,b=document.getElementsByTagName("meta"), c,d=0,f=b.length;d<f;d++)if(c=b[d],"og:title"===c.getAttribute("property")){a=c.getAttribute("content");break}a||(a=document.title||"Untitled");return a}(),b={},b=function(a,b,c){a.l1=b;a.l2=c;a.l3="__page__";a.l4="-";return a}(b,c,u),h=(new Date).getTime(),k=Math.floor(Math.random()*Math.pow(10,12)),l,d;d=t();l=d.a?d.b:0;b.zmoatab_cm=l;b.t=h;b.de=k;b.zMoatAB_SNPT=!0;var m;m=l?l:1;var n;n=d?d.a?!0:!1:!0;var c=[],v=(new Date).getTime().toString(35),p=[g(b.l1),g(b.l2),g(b.l3),g(b.l4)].join(":"),w="https://web.archive.org/web/20211025152319/https://fyagpgvkzhaz-a.akamaihd.net/"+ v+".gif?e=17&d="+encodeURIComponent(p)+"&de="+k+"&t="+h+"&i=ADDTHIS_CONTENT1&cm="+m+"&mp=1&ac=1&pl=1&bq=10&vc=2&cs=0",x="https://web.archive.org/web/20211025152319/https://px.moatads.com/pixel.gif?e=17&d="+encodeURIComponent(p)+"&de="+k+"&t="+h+"&i=ADDTHIS_CONTENT1&cm="+m+"&mp=0&ac=1&pl=1&bq=10&ad_type=img&vc=2&cs=0",y="https://web.archive.org/web/20211025152319/https://px.moatads.com/pixel.gif?e=17&d="+encodeURIComponent(p)+"&de="+k+"&t="+h+"&i=ADDTHIS_CONTENT1&cm="+m+"&ku=1&ac=1&pl=1&bq=10&ad_type=img&vc=2&cs=0";n&&((new Image).src=w,(new Image).src=x);for(var q in b)c.push(q+"="+ encodeURIComponent(b[q]));var c=c.join("&"),c=c+"&vc=2",f=document.createElement("script");f.type="text/javascript";f.async=!0;n&&(f.onerror=function(){(new Image).src=y});var r=document.getElementsByTagName("script")[0];r.parentNode.insertBefore(f,r);f.src="https://web.archive.org/web/20211025152319/https://z.moatads.com/addthis094032898332/moatcontent.js#"+c}catch(a){try{var z="//web.archive.org/web/20211025152319/https://pixel.moatads.com/pixel.gif?e=24&d=data%3Adata%3Adata%3Adata&i=MOATCONTENTABSNIPPET1&vc=2&ac=1&k="+encodeURIComponent(a)+"&j="+encodeURIComponent(document.referrer)+ "&cs="+(new Date).getTime();(new Image).src=z}catch(e){}}})(); </script> <!-- Begin BlueKai Tag --> <iframe name="__bkframe" height="0" width="0" frameborder="0" style="display:none;position:absolute;clip:rect(0px 0px 0px 0px)" src="about:blank"></iframe> <script class="trustecm" trackertype="advertising" type="text/plain" active-src="https://tags.bkrtx.com/js/bk-coretag.js"></script> <script class="trustecm" trackertype="advertising" type="text/plain"> bk_doJSTag(62583, 1); </script> <!-- End BlueKai Tag --> </head> <body class="post-template-default single single-post postid-1371 single-format-standard wp-embed-responsive group-blog masthead-fixed full-width singular"> <!-- Start of DoubleClick Floodlight Tag --> <script class="trustecm" trackertype="functional" type="text/plain"> var axel = Math.random() + ""; var a = axel * 10000000000000; document.getElementsByTagName('body')[0].insertAdjacentHTML('beforeend', '<iframe src="https://web.archive.org/web/20211025152319/https://3573281.fls.doubleclick.net/activityi;src=3573281;type=fy18o00;cat=fy18o005;dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=' + a + '?" width="1" height="1" frameborder="0" style="display:none"></iframe>'); </script> <!-- End of DoubleClick Floodlight Tag --> <div class="sitenav"> <div class="sitenav__container"> <div class="sitenav__content"> <a class="sitenav__logo" href="/web/20211025152319/https://www.addthis.com/">AddThis</a> <nav class="sitenav__menu"> <a class="sitenav__menu-link" href="/web/20211025152319/https://www.addthis.com/get" title="Tools">Tools</a> <a class="sitenav__menu-link" href="/web/20211025152319/https://www.addthis.com/academy" title="Academy">Academy</a> <a class="sitenav__menu-link" href="/web/20211025152319/https://www.addthis.com/blog" title="Blog">Blog</a> <a class="sitenav__menu-link" href="/web/20211025152319/https://www.addthis.com/academy/help" title="Help">Help</a> </nav> <a class="sitenav__button" href="/web/20211025152319/https://www.addthis.com/dashboard" title="Dashboard">Dashboard</a> <button class="sitenav__toggle" aria-controls="primary-menu" aria-expanded="true"> <span class="sitenav__toggle-burger"></span> <span class="sitenav__toggle-text">Menu</span> </button> </div> </div> </div> <header class="hero"> <div class="hero__container"> <h2 class="hero__title"><a href="/web/20211025152319/https://www.addthis.com/academy" class="hero__title-link">AddThis Academy</a></h2> <p class="hero__text">An ever-growing library of resources to help you become a better online marketer.</p> <form class="hero__search" role="search" method="get" action="/web/20211025152319/https://www.addthis.com/academy/"> <input class="hero__search-field" type="search" value="" name="s" value=""> <input class="hero__search-submit" type="submit" value="Search"> </form> </div> </header> <svg class="topLeftRounded" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewbox="50 20 50 80" preserveaspectratio="none"> <path d="M0,100 C15,100 35,50 50,50 L50,50 C65,50 85,100 100,100 Z"></path> </svg> <div id="primary" class="main-content single-page" role="main"> <div class="container"> <div class="content-left"> <article id="post-1371" class="blog-post regular-post post-detail post-1371 post type-post status-publish format-standard has-post-thumbnail hentry category-developer-documentation category-faq tag-blogger tag-intermediate tag-open-graph"> <div class="inner"> <h1 class="entry-title"> How to Add Open Graph Tags to Your Blogger Website </h1> <div class="entry-info"> <ul> <li><span class="icon-calendar"></span> June 4, 2019</li> <li><span class="icon-user"></span> <a href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/author/kristin-schallhorn/" title="Posts by Kristin Schallhorn" rel="author">Kristin Schallhorn</a></li> <li><span class="icon-tag"></span> <a href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/category/developer-documentation/" title="View all posts in Developer Documentation">Developer Documentation</a>, <a href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/category/faq/" title="View all posts in Frequently Asked Questions">Frequently Asked Questions</a> </li> </ul> </div> <div class="entry-share"> <div class="addthis_responsive_sharing"></div> </div> <div class="entry-content"> <p>To instruct Facebook and other sharing services what to show when a page of your website is shared, you will need to specify Open Graph meta tags. If Open Graph tags are not present on a page when sharing, the sharing service will try to guess the title, image, and description for the page – and might guess wrong.</p> <p><img loading="lazy" class="alignnone size-full wp-image-6917" src="https://web.archive.org/web/20211025152319im_/https://blog.addthiscdn.com/wp-content/uploads/sites/3/2015/10/08135734/Facebook-Open-Graph.jpg" alt="" width="670" height="335"/></p> <p><em>Note: The AddThis Related Posts Tool also uses Open Graph tags to determine what content to display for each page. If you are not seeing the correct content appear for your pages, make sure your pages have Open Graph tags set. </em></p> <p>To add Open Graph tags to your Blogger website pages, you will need to be comfortable with editing your Blogger Template. <strong>We also recommended that you create a backup of your template before making any changes.</strong></p> <p>To get started, click <strong>Theme</strong>, then <strong>Edit HTML</strong> in the Blogger menu.</p> <p><img loading="lazy" class="alignnone size-full wp-image-7257" src="https://web.archive.org/web/20211025152319im_/https://blog.addthiscdn.com/wp-content/uploads/sites/3/2015/10/05133519/Edit-HTML-Blogger.jpg" alt="Edit HTML in Blogger" width="898" height="514"/></p> <p>From there, you will need to add Facebook’s XML namespace to your page’s initial HTML tag. By default, there will be other namespaces already included, so you will just need to add <code>xmlns:og='http://ogp.me/ns#'</code> to the end. Here’s an example of how the HTML tag may look after you’re finished:</p> <pre class="prettyprint"><html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:og='http://ogp.me/ns#'></pre> <p>After the namespace has been added, the actual Open Graph meta tags will need to be added to the template. To do this, search for “</head>” within your theme. From there, it’s just a matter of copying the following snippet of code just <strong>before</strong> the </head> tag.</p> <pre class="prettyprint"><!-- Open Graph Meta Tags BEGIN --> <meta expr:content='data:blog.pageName' property='og:title'/> <b:if cond='data:blog.postImageThumbnailUrl'> <meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/> </b:if> <meta expr:content='data:blog.title' property='og:title'/> <meta expr:content='data:blog.canonicalUrl' property='og:url'/> <b:if cond='data:blog.metaDescription'> <meta expr:content='data:blog.metaDescription' property='og:description'/> </b:if> <!-- Open Graph Meta Tags END --> </pre> <p>This will generate Open Graph meta tags for title, description, URL, and image (if one exists in the post).</p> <p>If additional Open Graph tags are needed, we recommend that you take a look at the <a href="https://web.archive.org/web/20211025152319/http://ogp.me/">Open Graph Protocol</a> page for more information.</p> <p>If you have any questions about installing Open Graph tags on your Blogger site, please <a href="https://web.archive.org/web/20211025152319/https://www.addthis.com/support/">contact our dedicated support team</a>. We are happy to help!</p> <p></p> <div class="article-tags"> <span><i></i>Tags: </span><a href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/tag/blogger/" rel="tag">blogger</a> <a href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/tag/intermediate/" rel="tag">Intermediate</a> <a href="https://web.archive.org/web/20211025152319/https://www.addthis.com/academy/tag/open-graph/" rel="tag">open graph</a></span><span> </div> <div class="entry-modified"> </div> </div> </div> </article> <div class="post-nav"> <div class="post-nav-left"> </div> <div class="post-nav-right"> </div> </div> </div> <div class="content-right"> <div class="side-block cat"> <h3>Marketing Lessons</h3> <ul class="side-categories"> <li class="side-increasetraffic"><a href="/web/20211025152319/https://www.addthis.com/academy/category/increase-traffic/">Increase Traffic to Your Site</a></li> <li class="side-increaseaudience"><a href="/web/20211025152319/https://www.addthis.com/academy/category/increase-audience-engagement/">Increase Audience Engagement</a></li> <li class="side-increaseconversions"><a href="/web/20211025152319/https://www.addthis.com/academy/category/increase-visitor-conversions/">Increase Visitor Conversions</a></li> <li class="side-emailmarketing"><a href="/web/20211025152319/https://www.addthis.com/academy/category/email-and-content-marketing/">Email & Content Marketing</a></li> <li class="side-socialmarketing"><a href="/web/20211025152319/https://www.addthis.com/academy/category/social-media-marketing/">Social Media Marketing</a></li> <li class="side-userexperience"><a href="/web/20211025152319/https://www.addthis.com/academy/category/user-experience/">Importance of User Experience</a></li> <li class="side-buildingcommunity"><a href="/web/20211025152319/https://www.addthis.com/academy/category/building-online-community/">Building an Online Community</a></li> <li class="side-webinars"><a href="/web/20211025152319/https://www.addthis.com/academy/category/events/">Webinars / Events</a></li> </ul> </div> <div class="side-block"> <h3>Help Center</h3> <p>Need help with AddThis Tools?</p> <div class="side-cta"> <a href="/web/20211025152319/https://www.addthis.com/academy/help" class="btn">Visit AddThis Help</a> </div> </div> <div class="side-block"> <h3>Follow Us</h3> <div class="addthis_horizontal_follow_toolbox"></div> </div> <div class="side-block"> <h3>Support</h3> <p>Need further assistance?</p> <div class="side-cta"> <a href="/web/20211025152319/https://www.addthis.com/support" class="btn">Contact Us</a> </div> </div> </div> <div class="clearfix"></div> </div> </div> <svg class="bottomRightRounded" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewbox="0 20 50 80" preserveaspectratio="none"> <path d="M0,100 C15,100 35,50 50,50 L50,50 C65,50 85,100 100,100 Z"></path> </svg> <div class="footer-atLogo"> <svg id="emblem" width="120px" height="120px" viewbox="0 0 120 120"> <defs> <lineargradient x1="0%" y1="0%" x2="100%" y2="100%" id="emblem-grad"> <stop stop-color="#FF6E41" offset="0%"></stop> <stop stop-color="#F86955" offset="100%"></stop> </lineargradient> </defs> <circle fill="url(#emblem-grad)" cx="60" cy="60" r="60"></circle> <g transform="translate(12 12)"> <g transform="translate(48 48) scale(1.2 1.2) scale(1 1)"> <path d="M47.5,88 L47.5,73.5 M27.5669873,82.3910162 L34.8169873,69.8336478 M13.1089838,67.5669873 L25.6663522,60.3169873 M8,47.5 L22.5,47.5 M13.6089838,27.5669873 L26.1663522,34.8169873 M28.4330127,13.1089838 L35.6830127,25.6663522 M48.5,8 L48.5,22.5 M68.4330127,13.6089838 L61.1830127,26.1663522 M82.8910162,28.4330127 L70.3336478,35.6830127 M88,48.5 L73.5,48.5 M82.3910162,68.4330127 L69.8336478,61.1830127 M67.5669873,82.8910162 L60.3169873,70.3336478" id="rays" stroke="#FFFFFF" stroke-width="2" stroke-linecap="round" stroke-dasharray="6,5,4,7" opacity="0" transform="translate(-48 -48) rotate(49.3514 48 48)"> <animatetransform attributename="transform" attributetype="XML" type="rotate" from="0 48 48" to="360 48 48" additive="sum" dur="10s" repeatcount="indefinite"></animatetransform> <animate attributename="stroke-dashoffset" attributetype="XML" from="0" to="200" dur="10s" repeatcount="indefinite"></animate> <animate attributename="opacity" attributetype="XML" from="0" to="1" dur="0.15s" begin="emblem.mouseenter" repeatcount="1" restart="whenNotActive" fill="freeze"></animate> <animate attributename="opacity" attributetype="XML" from="1" to="0" dur="0.5s" begin="emblem.mouseleave" repeatcount="1" restart="whenNotActive" fill="freeze"></animate> </path> <animatetransform attributename="transform" attributetype="XML" type="scale" from="0 0" to="1 1" additive="sum" dur="0.5s" repeatcount="1" restart="whenNotActive" fill="freeze" begin="emblem.mouseenter"></animatetransform> </g> <path d="M36,32 L60,32 C62.209139,32 64,33.790861 64,36 L64,60 C64,62.209139 62.209139,64 60,64 L36,64 C33.790861,64 32,62.209139 32,60 L32,36 C32,33.790861 33.790861,32 36,32 Z M50,46 L50,40 L46,40 L46,46 L40,46 L40,50 L46,50 L46,56 L50,56 L50,50 L56,50 L56,46 L50,46 Z" fill="#FFFFFF" transform="translate(0 -8)"> <animatetransform attributename="transform" attributetype="XML" type="translate" from="0 -8" to="0 0" dur="0.15s" repeatcount="1" restart="whenNotActive" fill="freeze" begin="emblem.mouseenter"></animatetransform> <animatetransform attributename="transform" attributetype="XML" type="translate" from="0 0" to="0 -8" dur="0.15s" repeatcount="1" restart="whenNotActive" fill="freeze" begin="emblem.mouseleave"></animatetransform> </path> <text font-size="12" font-weight="bold" fill="#FFFFFF"> <tspan x="48" y="72" text-anchor="middle">Now Free!</tspan> <animate attributename="opacity" attributetype="XML" from="0" to="1" dur="0.5s" begin="emblem.mouseleave" repeatcount="1" restart="whenNotActive" fill="freeze"></animate> <animate attributename="opacity" attributetype="XML" from="1" to="0" dur="0.15s" begin="emblem.mouseenter" repeatcount="1" restart="whenNotActive" fill="freeze"></animate> </text> </g> </svg> </div> <footer class="footer"> <div class="footer__container"> <div class="footer__column"> <h4 class="footer__title">Tools</h4> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/get/share" title="The world’s most popular share buttons">Share Buttons</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/get/follow" title=" Build your online following, one fan at a time">Follow Buttons</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/get/related-posts" title="Recommend content to your website visitors">Related Posts</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/get/list-building" title=" Grow your email subscriber list">List Building</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/get/link-promotion" title=" Promote the right page at the right time">Link Promotion</a> </div> <div class="footer__column"> <h4 class="footer__title">Plugins</h4> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/social-buttons" title="The world’s most popular social networks with native social buttons">Social Plugins</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/wordpress" title="Plugins for your WordPress site - Increase your website traffic and get more followers">WordPress Social Plugins</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/share-buttons-for-amp/" title="Share Buttons for AMP">Accelerated Mobile Pages (AMP)</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/plugins" title="AddThis plugins for Tumblr, Blogger, Magento, Shopify and more!">CMS Plugin</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/integration" title="Email integrations with Hubspot, AWeber, MailChimp, and more!">Email Integration</a> </div> <div class="footer__column"> <h4 class="footer__title">Learn</h4> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/free-website-tools" title="Free Website Tools">Why AddThis?</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/examples" title="See what AddThis will look like on your site">Examples</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/blog" title="News and updates from AddThis">Blog</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/academy" title="An ever-growing library of resources to help you become a better marketer online">Academy</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/support" title="Let us know how we can help">Support</a> </div> <div class="footer__column"> <h4 class="footer__title">About</h4> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/about" title="Learn more about who we are">About</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/careers" title="We're on a mission. Ready to join?">Careers</a> <a class="footer__link" href="/web/20211025152319/https://www.addthis.com/contact" title="Connect with us!">Contact Us</a> </div> </div> <div class="footer__copyright"> <p class="footer__copyright-p"> <a class="footer__copyright-link" href="https://web.archive.org/web/20211025152319/https://datacloudoptout.oracle.com/" target="_blank">Opt Out of Targeted Advertising</a> </p> <p class="footer__copyright-p"> <a class="footer__copyright-link" href="https://web.archive.org/web/20211025152319/http://www.oracle.com/legal/privacy/addthis-privacy-policy.html" target="_blank" title="Your privacy is important.">Privacy</a> <a class="footer__copyright-link" href="/web/20211025152319/https://www.addthis.com/privacy/terms-of-service" title="Terms of Service">Terms of Service</a> <div id="teconsent"></div> </p> <p class="footer__copyright-p"> <a class="footer__copyright-link" href="">Cookie Preferences</a> </p> <p class="footer__copyright-p"> <small class="footer__copyright-small">Copyright © 2021, Oracle and/or its affiliates. All rights reserved.<br> Oracle and Java are registered trademarks of Oracle and/or its affiliates.<br>Other names may be trademarks of their respective owners.</small> </p> </div> </footer> <script src="//web.archive.org/web/20211025152319js_/https://consent.truste.com/notice?domain=addthis.com&c=teconsent&text=true&js=bb&noticeType=bb&ver=5.7.1" id="trustecm-privacymanager-js" class="trustecm_done" trackertype="required"></script> <script id="atacademy-run_prettify-js" class="trustecm" trackertype="functional" type="text/plain" active-src="https://www.addthis.com/academy/wp-content/themes/academy-v3/js/run_prettify.js?ver=5.7.1"></script> <script id="eloqua-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-content/themes/academy-v3/js/eloqua.js?ver=5.7.1"></script> <script id="bluekai-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-content/themes/academy-v3/js/bluekai.js?ver=5.7.1"></script> <script id="addthis-widget-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://s7.addthis.com/js/300/addthis_widget.js?ver=5.7.1#pubid=atacademy"></script> <script id="sitecatalyst-js" class="trustecm" trackertype="functional" type="text/plain" active-src="https://www.oracle.com/us/assets/metrics/ora_addthis.js?ver=5.7.1"></script> <script id="comment-reply-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-includes/js/comment-reply.min.js?ver=5.7.1"></script> <script id="twentyfourteen-script-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-content/themes/twentyfourteen/js/functions.js?ver=20171218"></script> <script id="wp-embed-js" class="trustecm" trackertype="advertising" type="text/plain" active-src="https://www.addthis.com/academy/wp-includes/js/wp-embed.min.js?ver=5.7.1"></script> </body> </html> <!-- FILE ARCHIVED ON 15:23:19 Oct 25, 2021 AND RETRIEVED FROM THE INTERNET ARCHIVE ON 16:58:13 Feb 21, 2025. JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE. ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C. SECTION 108(a)(3)). --> <!-- playback timings (ms): captures_list: 0.908 exclusion.robots: 0.048 exclusion.robots.policy: 0.031 esindex: 0.015 cdx.remote: 66.672 LoadShardBlock: 294.783 (3) PetaboxLoader3.datanode: 226.365 (5) PetaboxLoader3.resolve: 107.111 (2) load_resource: 111.539 (2) -->