I want to have my post image to be fetched and displayed by google plus whenever someone posts my URL.
I'm a bit confused with all these opengraph/schema formats.
It's working fine on facebook and twitter and I can see the data correctly structured on the debugger tools (both facebook's and google's).
Here's my blog and a sample post and here's what my HTML looks like:
<head>
...
<meta name="description" content="{{post.excerpt}}">
<meta property="og:type" content="article">
<meta property="og:url" content="{{post.permalink}}">
<meta property="og:title" content="{{post.title}}">
<meta property="og:description" content="{{post.excerpt}}">
<meta property="og:image" content="{{post.image}}"> <!-- absolute path here -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="{{twitterProfile}}">
<meta name="twitter:image:src" content="{{post.image}}"> <!-- absolute path here -->
...
</head>
<body>
...
<article itemscope itemtype="http://schema.org/Article">
<meta itemprop="inLanguage" content="pt-BR">
<meta itemprop="inFamilyFriendly" content="True">
<meta itemprop="image" content="{{post.image}}"> <!-- absolute path here -->
<div class="post-hero">
<section itemprop="associatedMedia" style="background-image: url({{post.image}});">
</section> <!-- absolute path here -->
<section>
<h1 itemprop="headline name">
<a itemprop="url" href="{{post.permalink}}" title="{{post.title}}">{{post.title}}</a>
</h1>
...
</section>
...
</div>
...
</article>
...
</body>
Am I missing something? Should I move my Article Scope to the HTML tag? If so, why?
Looks like it was a caching problem. I appended a query string to the URL and the image got pulled up.