Menu
I need to add Open Graph tags to a blog page. It seems from reading the spec (http://ogp.me/) using an og:type of article is the way to go. However, I find the spec unclear and I'm unsure how to implement the syntax correctly.
Two example websites implement this differently for example:
Example from GitHub: (https://github.com/niallkennedy/open-graph-protocol-examples/blob/master/article-utc.html)
<head prefix="og: http://ogp.me/ns# article: http://ogp.me/ns/article#"> <meta property="og:title" content="..."> <meta property="og:type" content="article"> <meta property="article:published_time" content="..."> Note the og and article namespaces are registered and that og and article are used as properties.
BBC News article
<head> <meta property="og:title" content="..."> <meta property="og:type" content="article"> <meta property="og:article:author" content="..."> Note no namespace registration and og and og:article are used as properties.
A variation I've seen in the wild of the above, registering only the og namespace and still referencing og:article as a property.
<head prefix="og: http://ogp.me/ns#"> <meta property="og:title" content="..."> <meta property="og:type" content="article"> <meta property="og:article:published_time" content=".."> Option 3 is what I used the first time I tried to implement this. When I ran it through the Facebook validation tool I was told:
Objects of this type do not allow properties named 'og:article:published_time'.
For the moment, I have gone with option 1 and although this validates, I would like to know what the definitive correct syntax is?
729
Open Graph is an internet protocol that was originally created by Facebook to standardize the use of metadata within a webpage to represent the content of a page. Within it, you can provide details as simple as the title of a page or as specific as the duration of a video.
The open graph protocol allows developers to leverage Facebook in new and exciting ways. One of the easiest ways to venture into the world of Open Graph is to add the open graph meta tags to your site. Open graph meta tags allow you to control what content shows up when a page is shared on Facebook.
How to implement Open Graph. Open Graph implementation is done by adding Open Graph markup to your HTML documents, in the <head> section of your pages. You can do this manually, or if your website's driven by a CMS, it's likely there's functionality or plugins available for this job. If not, go talk to your developers.
Open Graph is a technology first introduced by Facebook in 2010 that allows integration between Facebook and its user data and a website. By integrating Open Graph meta tags into your page's content, you can identify which elements of your page you want to show when someone share's your page.
Have a look at the Facebook developers page: https://developers.facebook.com/docs/reference/opengraph/object-type/article
It looks like your examples 2 and 3 have incorrect formatting. None of the "article" properties should begin with "og:"
Here's what I have on one of my sites, and I get no errors from the FB debugger:
<meta property='og:type' content='article' /> <meta property='article:author' content='https://www.facebook.com/YOUR-NAME' /> <meta property='article:publisher' content='https://www.facebook.com/YOUR-PAGE' /> <meta property='og:site_name' content='YOUR-SITE-NAME' /> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
