{"id":820,"date":"2019-01-07T11:25:10","date_gmt":"2019-01-07T10:25:10","guid":{"rendered":"https:\/\/www.benjaminsimier.com\/?p=820"},"modified":"2019-11-07T11:32:57","modified_gmt":"2019-11-07T10:32:57","slug":"use-open-graph-og-on-your-sites","status":"publish","type":"post","link":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/","title":{"rendered":"Use Open Graph (OG) on your sites"},"content":{"rendered":"\n

Asked by a blog reader, I write this post for explain you, but more for share with you my experience with the Open Graph (or OG).<\/p>\n\n\n\n

Before I can explain you, I will make a definition.
Open Graph, or OG is a protocol make by Facebook in 2010. Then make the possibility for all page from website to become a rich object.
For example, on Facebook, if you past an URL from a website he use OG, you will can seen a title, a description, a image, \u2026<\/p>\n\n\n\n

For example, if I share the link of my blog post \u201chttps:\/\/www.benjaminsimier.com\/mes-extensions-google-chrome<\/a>\u201d on my Facebook page. The social network will propose me, image, a title, and even the description. All is automatically make by Open Graph.
Twitter use the Open Graph too for make links more \u201cdynamic\u201d and for make the link more visible.<\/p>\n\n\n\n

\"\"<\/a>
OpenGraph sur Facebook<\/figcaption><\/figure>\n\n\n\n

How it\u2019s work for the code ?<\/h3>\n\n\n\n

In the <head><\/em> of your website, you can add lines. For example, if you want add the post title : <meta property=\u201dog:title\u201d content=\u201dYour title\u201d \/><\/em><\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

The official website from Facebook group all propriety with explanation https:\/\/developers.facebook.com\/docs\/sharing\/webmasters<\/a><\/p>\n\n\n\n

Integrate OG for WordPress (or not) \u2013 For developper<\/h3>\n\n\n\n

For integrate OG in your WordPress website or not WordPress, you can use the developper method, so you cill enter in the source code from the website for add lines. For WordPress you will use PHP functions.
For example : <meta property=\u201dog:title\u201d content=\u201d<?php the_title() ?>\u201d \/><\/em><\/p>\n\n\n\n

Integrate OG with WordPress \u2013 plugin method<\/h3>\n\n\n\n

If you use WordPress, you will can use plugins for add Open Graph. For example, the plugin OG de Marcin Pietrzak<\/a> work well.<\/p>\n\n\n\n

Check your Open Graph<\/h3>\n\n\n\n

For check your Open Graph, Facebook made a online tool : https:\/\/developers.facebook.com\/tools\/debug<\/a>. This tool can check informations (image, description, title, \u2026)
The image is a example :<\/p>\n\n\n\n

\"\"<\/a>
Programme de debug du partage<\/figcaption><\/figure>\n\n\n\n

Conclusion<\/h3>\n\n\n\n

For conclusion, using Open Graph is very important for share your web page on social network. I think you have to use.<\/p>\n","protected":false},"excerpt":{"rendered":"

Asked by a blog reader, I write this post for explain you, but more for share with you my experience with the Open Graph (or OG). Before I can explain you, I will make a definition.Open Graph, or OG is a protocol make by Facebook in 2010. Then make the possibility for all page from […]<\/p>\n","protected":false},"author":1,"featured_media":613,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[48],"tags":[72,73],"class_list":["post-820","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-digital-trends","tag-seo-2","tag-web-2"],"acf":[],"yoast_head":"\nUse Open Graph (OG) on your sites - Benjamin Simier<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Use Open Graph (OG) on your sites\" \/>\n<meta property=\"og:description\" content=\"Asked by a blog reader, I write this post for explain you, but more for share with you my experience with the Open Graph (or OG). Before I can explain you, I will make a definition.Open Graph, or OG is a protocol make by Facebook in 2010. Then make the possibility for all page from […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/\" \/>\n<meta property=\"og:site_name\" content=\"Benjamin Simier\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/BSimierWeb\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/BSimierWeb\" \/>\n<meta property=\"article:published_time\" content=\"2019-01-07T10:25:10+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-11-07T10:32:57+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2019\/11\/OG.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"751\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Benjamin Simier\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Benjamin Simier\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/\"},\"author\":{\"name\":\"Benjamin Simier\",\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/#\\\/schema\\\/person\\\/9791a71b2543b7cd272bf22c3edd1fd5\"},\"headline\":\"Use Open Graph (OG) on your sites\",\"datePublished\":\"2019-01-07T10:25:10+00:00\",\"dateModified\":\"2019-11-07T10:32:57+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/\"},\"wordCount\":367,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/#\\\/schema\\\/person\\\/9791a71b2543b7cd272bf22c3edd1fd5\"},\"image\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2019\\\/11\\\/OG.jpg\",\"keywords\":[\"seo\",\"web\"],\"articleSection\":[\"Digital trends\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/\",\"url\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/\",\"name\":\"Use Open Graph (OG) on your sites - Benjamin Simier\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2019\\\/11\\\/OG.jpg\",\"datePublished\":\"2019-01-07T10:25:10+00:00\",\"dateModified\":\"2019-11-07T10:32:57+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2019\\\/11\\\/OG.jpg\",\"contentUrl\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2019\\\/11\\\/OG.jpg\",\"width\":1200,\"height\":751},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/use-open-graph-og-on-your-sites\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/home\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Use Open Graph (OG) on your sites\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/#website\",\"url\":\"https:\\\/\\\/www.benjaminsimier.com\\\/\",\"name\":\"Benjamin Simier\",\"description\":\"UI\\\/UX designer & d\u00e9veloppeur front-end\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/#\\\/schema\\\/person\\\/9791a71b2543b7cd272bf22c3edd1fd5\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.benjaminsimier.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/#\\\/schema\\\/person\\\/9791a71b2543b7cd272bf22c3edd1fd5\",\"name\":\"Benjamin Simier\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/Perso_4.jpeg\",\"url\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/Perso_4.jpeg\",\"contentUrl\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/Perso_4.jpeg\",\"width\":872,\"height\":1200,\"caption\":\"Benjamin Simier\"},\"logo\":{\"@id\":\"https:\\\/\\\/www.benjaminsimier.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/Perso_4.jpeg\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/BSimierWeb\",\"https:\\\/\\\/www.instagram.com\\\/benjamin_simier\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/benjaminsimier\\\/\"],\"url\":\"https:\\\/\\\/www.benjaminsimier.com\\\/en\\\/author\\\/admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Use Open Graph (OG) on your sites - Benjamin Simier","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/","og_locale":"en_US","og_type":"article","og_title":"Use Open Graph (OG) on your sites","og_description":"Asked by a blog reader, I write this post for explain you, but more for share with you my experience with the Open Graph (or OG). Before I can explain you, I will make a definition.Open Graph, or OG is a protocol make by Facebook in 2010. Then make the possibility for all page from […]","og_url":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/","og_site_name":"Benjamin Simier","article_publisher":"https:\/\/www.facebook.com\/BSimierWeb","article_author":"https:\/\/www.facebook.com\/BSimierWeb","article_published_time":"2019-01-07T10:25:10+00:00","article_modified_time":"2019-11-07T10:32:57+00:00","og_image":[{"width":1200,"height":751,"url":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2019\/11\/OG.jpg","type":"image\/jpeg"}],"author":"Benjamin Simier","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Benjamin Simier","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#article","isPartOf":{"@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/"},"author":{"name":"Benjamin Simier","@id":"https:\/\/www.benjaminsimier.com\/#\/schema\/person\/9791a71b2543b7cd272bf22c3edd1fd5"},"headline":"Use Open Graph (OG) on your sites","datePublished":"2019-01-07T10:25:10+00:00","dateModified":"2019-11-07T10:32:57+00:00","mainEntityOfPage":{"@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/"},"wordCount":367,"commentCount":0,"publisher":{"@id":"https:\/\/www.benjaminsimier.com\/#\/schema\/person\/9791a71b2543b7cd272bf22c3edd1fd5"},"image":{"@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#primaryimage"},"thumbnailUrl":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2019\/11\/OG.jpg","keywords":["seo","web"],"articleSection":["Digital trends"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/","url":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/","name":"Use Open Graph (OG) on your sites - Benjamin Simier","isPartOf":{"@id":"https:\/\/www.benjaminsimier.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#primaryimage"},"image":{"@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#primaryimage"},"thumbnailUrl":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2019\/11\/OG.jpg","datePublished":"2019-01-07T10:25:10+00:00","dateModified":"2019-11-07T10:32:57+00:00","breadcrumb":{"@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#primaryimage","url":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2019\/11\/OG.jpg","contentUrl":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2019\/11\/OG.jpg","width":1200,"height":751},{"@type":"BreadcrumbList","@id":"https:\/\/www.benjaminsimier.com\/en\/use-open-graph-og-on-your-sites\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/www.benjaminsimier.com\/en\/home\/"},{"@type":"ListItem","position":2,"name":"Use Open Graph (OG) on your sites"}]},{"@type":"WebSite","@id":"https:\/\/www.benjaminsimier.com\/#website","url":"https:\/\/www.benjaminsimier.com\/","name":"Benjamin Simier","description":"UI\/UX designer & d\u00e9veloppeur front-end","publisher":{"@id":"https:\/\/www.benjaminsimier.com\/#\/schema\/person\/9791a71b2543b7cd272bf22c3edd1fd5"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.benjaminsimier.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/www.benjaminsimier.com\/#\/schema\/person\/9791a71b2543b7cd272bf22c3edd1fd5","name":"Benjamin Simier","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2022\/05\/Perso_4.jpeg","url":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2022\/05\/Perso_4.jpeg","contentUrl":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2022\/05\/Perso_4.jpeg","width":872,"height":1200,"caption":"Benjamin Simier"},"logo":{"@id":"https:\/\/www.benjaminsimier.com\/wp-content\/uploads\/2022\/05\/Perso_4.jpeg"},"sameAs":["https:\/\/www.facebook.com\/BSimierWeb","https:\/\/www.instagram.com\/benjamin_simier\/","https:\/\/www.linkedin.com\/in\/benjaminsimier\/"],"url":"https:\/\/www.benjaminsimier.com\/en\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/posts\/820","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/comments?post=820"}],"version-history":[{"count":2,"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/posts\/820\/revisions"}],"predecessor-version":[{"id":823,"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/posts\/820\/revisions\/823"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/media\/613"}],"wp:attachment":[{"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/media?parent=820"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/categories?post=820"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.benjaminsimier.com\/en\/wp-json\/wp\/v2\/tags?post=820"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}