I'm trying to use the open graph to mark up pages on a website as athletes, as follows:
<meta property="og:title" content="Mo Rollem" />
<meta property="og:site_name" content="Bruisin Banditas" />
<meta property="og:description" content="-" />
<meta property="og:url" content="http://bandita.circulartriangle.com/mo-rollem-3" />
<meta property="og:image" content="http://bandita.circulartriangle.com/mo-rollem-3/download/portrait/297875_923184074920_36913142_46189728_1083603_n.jpg" />
<meta property="og:type" content="athlete" />
<meta property="fb:app_id" content="251338211564923" />
I have a standard like button installed at the top which functions correctly. The story in my stream includes an image and pulls up the correct metadata. The sportsperson section of my profile gains a new page with all the metadata except the image.
The Linter shows the image: http://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fbandita.circulartriangle.com%2Fmo-rollem-3
But the Open Graph shows the question mark default: http://graph.facebook.com/?id=http%3A%2F%2Fbandita.circulartriangle.com%2Fmo-rollem-3
What am I doing wrong? Am I doing something wrong? There was a bug about this last year but it doesn't seem to affect any of the other sites I check.
The open graph system is very slow, sometimes taking many days to scrape, and even more to scale images.
Related
I'm building an image on the fly to attach to page to be shared on facebook. Everything seems to be going great until it hits the share dialog. Facebook doesn't seem to be scraping, because the image isn't showing up. If I refresh that dialog page, it does load the image (having crawled it from the first go?).
I've read several pages that say I need only specify og:image:width and og:image:height to allow for immediate rendering, but that doesn’t seem to be working. Here are my meta tags:
<meta property="fb:app_id" content="###"/>
<meta property="og:type" content="website" />
<meta property="og:url" content="###" />
<meta property="og:title" content="My Page Title" />
<meta property="og:description" content="My Page Description" />
<meta property="og:image" content="http://the-domain/the-image.jpg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:type" content="image/jpeg" />
Am I missing something here?
For these kinds of issues, I recommend checking out the debugging tool that Facebook provides. It's great for quick identification of show stopping errors like you're receiving.
https://developers.facebook.com/tools/debug/
Just a couple of things to keep in mind, sometimes the image or page will time out if Facebook finds that it's taking longer than 1s to fetch the data. I've also found issues with my own implementations if the og:url is different than the page you're expecting Facebook to fetch. The two values must match, because ultimately it's the og:url value that facebook is trying to scrape.
Starting about a week ago, Facebook no longer correctly pulls my "og:image" unless I use the Facebook debug tool and click on "scape again" several times.
I receive the following error message :
The provided 'og:image' properties are not yet available because new images are processed asynchronously. To ensure shares of new URLs include an image, specify the dimensions using 'og:image:width' and 'og:image:height' tags.
My code has been working perfectly for over a year and I have made no modifications to it.
Here is my code :
<meta property="og:image" content="http://www.example.com/images/example.png" />
<meta property="og:image:width" content="220" />
<meta property="og:image:height" content="220" />
<meta property="og:type" content="article" />
<meta property="og:title" content="<Article Title>" />
<meta property="og:description" content="<Article Desc>" />
<meta property="og:url" content="<Article URL>" />
<meta property="og:see_also" content="<Article Alt URL>" />
<meta property="og:site_name" content="example.com" />
<meta property="og:locale" content="en_US" />
I've removed the real meta content, but I assure you all the meta tags are filled out correctly.
After hitting the "scape again" button a couple times, Facebook is finally able to pull the image.
There is 0.00 server load on my dedicated server so that's not the issue.
Any ideas?
It appears this was a Facebook issue, as everything magically started to work again without me making any changes.
I am attempting to create a facebook share button on Page-A that will post a dynamic unique link to Page-B. I have accomplished this however I am unable to control the image that the post shows. When using the button on Page-A the post shows correctly, however once posted the image is of a completely different image found on Page-B. I have included the following on both Page-A and Page-B. (note the extra # is because of cold fusion escaping)
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb##">
<meta property="og:title" content="PaceButler Referral Program" />
<meta property="og:site_name" content="PaceButler" />
<meta property="og:url" content="http://www.pacebutler.com/referral.cfm?Referalcode=#GetProfile.referralCode#" />
<meta property="og:description" content="The lifeblood of our business is New Customers. When you refer a New Customer to PaceButler, we'll pay you what we pay them for the 1st shipment of cell phones they send in (see Program Details). This is an easy way to make some real money!" />
<meta property="og:image" content="http://www.pacebutler.com/images/referral/PB-Referral-Logo-Large.png" />
<meta property="og:type" content="website" />
thanks,
Mark
What I found was that after a few days facebook did eventually clear the images that it had stored in its cache.
I'm trying to implement a basic Facebook like functionality to a site. I've triple-checked & more the meta tags, but the og:description -text doesn't show up in the FB news feed. The title and the image work fine.
Here's the code:
<meta property="og:type" content="article" />
<meta property="og:title" content="SOG – VEITSIÄ VIIDAKOSTA ARKITÖIHIN" />
<meta property="og:url" content="http://www.finnprotec.fi/webshop/news/2" />
<meta property="og:description" content="Kunhan kirjoitan vaan jotain tekstia nyt." />
<meta property="og:site_name" content="Finnprotec.fi" />
<meta property="og:image" content="http://www.finnprotec.fi/webshop/kuvat/kuva517a8539a91f1.jpg" />
<meta property="fb:admins" content="6700009220" />
<meta property="fb:app_id" content="348235131938688" />
When I click on the link on the page, the description shows up nicely under the title:
But when I click on the send button, this shows up on my FB feed:
This is what I'm trying to get:
The url of the current page is: http://www.finnprotec.fi/webshop/news/2
I have tried to clear facebook's cache with the facebook linter, but that hasn't helped.
I just ran into this. I found that the description is actually there - you have to hover over the image to see it. It shows it in the format you want sometimes, depending on the size of the post where you're viewing it.
For example, after I've liked my post, I don't see the description in the post shown when I click on my name and view my wall (where the posts are smaller).
But I do see it when I just go to facebook.com and I view the larger version shown in my stream.
I realize this isn't really answering the question; I couldn't find a way to get it to show the description consistently.
add this two lines to your code after og:image
<meta property="og:image:width" content="400" />
<meta property="og:image:height" content="300" />
it must work
I would like to ask how to add data with links after the description to a Facebook post, what meta tags i should use to have such result like image below
http://alternative-spaces.com/UPDATE/screen_shots/GraphProtocol.png
Here is my code
<meta property="og:title" content="Exciting views and amazing floor plans"/>
<meta property="og:url" content="http://mysite.com/"/>
<meta property="og:description" content="sdfsfsd http://mysite.com/" />
<meta property="og:image" content="http://somagrand.com/images/fb_icon.jpg" />
<meta property="og:site_name" content="content"/>
<meta property="og:type" content="company" />
<meta property="fb:app_id" content="229103737100322"/>
<meta property="og:latitude" content="33.8164994"/>
<meta property="og:longitude" content="-116.5469377"/>
<meta property="og:street-address" content="1160 Mission St."/>
<meta property="og:locality" content="San Francisco"/>
<meta property="og:region" content="CA"/>
<meta property="og:postal-code" content="94103"/>
<meta property="og:country-name" content="USA"/>
That post wasnt made by liking a page on that site and therefore wont be concerned with open graph tags. It was done through the legacy REST API action stream.publish - if you go here: http://www.musicolio.com and click the 'share' button at the top you will notice the URL for the popup is something like this (once decoded):
https://www.facebook.com/dialog/stream.publish?action_links=[{"text":"Join Now","href":"http://www.musicolio.com/"}]&api_key=138938132827513&app_id=138938132827513&attachment={"name":"Musicolio","href":"http://www.musicolio.com/","description":"Collaborate on music projects, connect with musicians, find talented musicians, find work in the music industry.","media":[{"type":"image","src":"http://www.musicolio.com/blog/wp-content/uploads/2010/12/micon.png","href":"http://www.musicolio.com/"}],"properties":{"Get Discovered":"Monitored by industry executives","Private":"No Spam","Job Boards":"Get work, get paid","Free":"Get connected for free"}}&display=popup&locale=en_US&next=https://s-static.ak.fbcdn.net/connect/xd_proxy.php?version=3#cb=f24407dddc7a49a&origin=http%3A%2F%2Fwww.musicolio.com%2Ff1be678fb013a1e&relation=opener&transport=postmessage&frame=f11e216310dbbde&result=%22xxRESULTTOKENxx%22&sdk=joey&target_id=
I've highlighted the part you're interested in. More information on this can be found here: http://developers.facebook.com/docs/guides/attachments/