Ok here is the think
suppose you want to submit a link to your mates wall,
You copy/paste a link and facebook generates title, image and description.
Curently i am working on http://www.compra.gr
When you want to submit this link (http://www.compra.gr) facebook generates characters that are not recognised.
When you want to submit http://compra.gr/index.php?option=com_content&view=category&layout=blog&id=35&Itemid=54
Facebook generates title,image and description normally.
I know that facebook takes the information from metadata. I corrected the metadata, however nothing happened.
Please help me if someone has a a clue what is going on.
Thank you in advance.
PS the site has copyright protection, in order to view the source code use google chrome and at the address bar enter view-source:http://compra.gr/
I know whats the problem, your site does not have Open Graph tags!
Check out: https://developers.facebook.com/docs/opengraph/
Here's a snippet for you to understand, add this to your site and then use
URL Linter to Debug: http://developers.facebook.com/tools/lint/
Open Graph Tags Snippet:
<!doctype html>
<html xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml" lang="en">
<head>
<meta charset="utf-8">
<title>Title</title>
<meta property="og:title" content="YOUR-POST-TITLE"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://YOUR-SITE-URL"/>
<meta property="og:image" content="http://YOUR-IMAGE-URL"/>
<meta property="og:site_name" content="YOUR-SITE-TITLE"/>
<meta property="og:description" content="YOUR-DESCRIPTION"/>
<meta property="fb:admins" content="YOUR-USER-ID"/>
</head>
.....
</html>
Related
Our game was approved (Open Graph stories, publish_actions permission etc) by Facebook, however when users post Open Graph stories they only show up in activity log and don't show up on Timeline at all. Even stories with explicit sharing property. Neither regular user nor test users\admins have them showing up in Timeline. The game is already out of a "sandbox" mode.
Our platform is Web-FB Canvas.
Here is the code:
<!DOCTYPE html>
<html>
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# cutecats_game: http://ogp.me/ns/fb/cutecats_game#">
<meta property="fb:app_id" content="117626198575574">
<meta property="og:type" content="cutecats_game:quest">
<meta property="og:url" content="https://fbcats.integra-games.com//mcats/og.story.php?img=quest_complete.jpg&title=New%20Amazing%20Quest!&desc=Complete%20amazing%20quests%20and%20receive%20helpful%20rewards!%20Will%20you%20complete%20this%20epic%20quest?&ref=st_quest&explicitly=true&objectType=quest">
<meta property="og:title" content="New Amazing Quest!">
<meta property="og:description" content="Complete amazing quests and receive helpful rewards! Will you complete this epic quest?"/>
<meta property="og:image" content="https://fbcats.integra-games.com/mcats/story/quest_complete.jpg">
<meta property="fb:explicitly_shared" content="true">
<meta http-equiv="refresh" content="0; url=https://apps.facebook.com/cutecats_game/?ref=st_quest"/>
</head>
<body></body>
</html>
Links to FB on this object are passed by this method https://graph.facebook.com/me/cutecats_game:complete
Thanks for you help in advance!
For a Facebook game, I want to have Open Graph picture objects with titles in multiple languages (specifically, English and German). I did everything as described in Facebooks open graph internationalization document, but somehow the objects (and actions) are always shown with English titles in the newsfeed and activities - and the app is definitely localized in its configuration.
Here's the URL of one of the objects: http://apps.facebook.com/spot-it/opengraph/picture/pictures.1A24.html
If I get it through Facebook's object debugger using the fb_locale parameter set to German, I see:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# spot-it: http://ogp.me/ns/fb/spot-it#">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta property="og:locale:alternate" content="de_DE">
<meta property="og:locale:alternate" content="en_US">
<meta property="og:locale" content="de_DE">
<meta property="fb:app_id" content="419035224820013">
<meta property="og:type" content="spot-it:picture">
<meta property="og:url" content="http://apps.facebook.com/spot-it/opengraph/picture/pictures.1A24.html">
<meta property="og:title" content="Beißerchen">
<meta property="og:description" content="Findest du die Fehler in 'Beißerchen'?">
<meta property="og:image" content="http://d2tv32y5kdvj8c.cloudfront.net/assets/pictures/1A24_potd.jpg">
</head>
<body>
<script type="text/javascript">
self.location.href = "";
</script>
</body>
</html>
So why doesn't Facebook use the German version when displaying actions involving that object to German users? Am I doing something wrong, or does internationalization for open graph simply not work?
in the app settings at developers.facebook.com > your app > "Localize" you can add support for additional languages.
you can set:
display name
tagline
description
detailed description
explanation for permissions
and all images like logo, icon, web banner, cover image…
i hope this is what you're looking for ;)
When I click on the link button on my website , I get the notification on Facebook that I have liked such and such thing and along with that my Logo of the website Appears. However I want that the logo of the website is not shown but instead the Image of the product is shown.
I am using the step 1 like button on this URL https://developers.facebook.com/docs/reference/plugins/like/
You need to look at open graph meta tags and in particular the image tag. og:image.
A full example of tags and how they work can be found here http://developers.facebook.com/docs/opengraphprotocol/ but the general jist of what you need is:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title>My Movie Website</title>
<meta property="og:title" content="My Movie Website"/>
<meta property="og:type" content="movie"/>
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
<meta property="og:image" content="http://mymovies.com/images/logo.png"/>
<meta property="og:site_name" content="My Movies"/>
<meta property="fb:admins" content="USER_ID"/>
<meta property="og:description"
content="Some content description blah..."/>
...
</head>
...
</html>
By setting this tag it should tell Facebook the image to load. You can test this via Facebooks tools online here http://developers.facebook.com/tools/debug
I'm looking to add some "share" buttons to a webpage I'm working on. I keep getting an "og:url" and "og:title" error even though they're both there. Any help would be great. Below is the beginning of the webpage script. Thanks, Marc
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org /TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>fccf pad promotion</title>
<meta property="og:title" content="FCCF Pad home"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://padsrockref.1sourceusa.com/fccfpad/" />
<meta property="og:description"
content="A great way to start the new year! Request some pads and One-Source will make a donation on your behalf to the FCCF."/>
When I go to the URL you specify (http://padsrockref.1sourceusa.com/fccfpad/) for og:url, I get a 302 redirect to another page (http://padsrockref.1sourceusa.com/PageNotFound.html). So there are no og meta tags for Facebook to process, hence why it is erroring out. Update it to a valid URL and I think that will solve your problem.
I'm building a facebook iFrame application that uses facebook comments. When a user leaves a comment the default action is that this comment will be posted to their wall. The wall post is something along the lines of
UserX commented on example.com
# the comment text goes here
http://example.com
apps.facebook.com
You should be able to include an image, a description, and set the link to be the title of the page (where it says http://example.com above the apps.facebook.com), but I'm having no luck getting this to work.
I thought it would grab the information from my meta tags (as long as they included the appropriate 'og' tags), but that isn't working. Nor am I able to define values for title, url, image etc. in the same way that you can for normal wall posts.
Anyone have any idea how to get this working??
EDIT:
Here are the meta tags I currently am using.
<meta property="og:title" content="USERNAME'S PAGE" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://example.com"/>
<meta property="og:image" content="http://example.com/images/wall-post.png" />
<meta property="og:description" content="Some description goes here." />
Use URL Linter to Debug
http://developers.facebook.com/tools/lint/
Make sure all meta tags are correct and if you've made some changes, it takes some time to update for facebook and here's a sample, this is a working version:
<!doctype html>
<html xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml" lang="en">
<head>
<meta charset="utf-8">
<title>Facebook Comment Box Sample</title>
<meta property="og:title" content="YOUR-POST-TITLE"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://YOUR-SITE-URL"/>
<meta property="og:image" content="http://YOUR-IMAGE-URL"/>
<meta property="og:site_name" content="YOUR-SITE-TITLE"/>
<meta property="og:description" content="YOUR-DESCRIPTION"/>
<meta property="fb:admins" content="YOUR-USER-ID"/>
</head>
<body>
<h1>Facebook Comment Box:</h1>
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:comments href="http://YOUR-SITE-URL" num_posts="10" width="500"></fb:comments>
</body>
</html>
OK, after a lot of stumbling around I figured this out.
My iFrame application requires facebook authentication before accessing the application (as I believe all facebook apps do). This means that the facebook crawlers were unable to crawl my homepage and pick up the og: meta tags.
To solve this I first had to figure out what the facebook crawler looks like. I logged the HTTP_USER_AGENT for all requests and then used the facebook URL Linter (http://developers.facebook.com/tools/lint/) to ping my site.
The facebook crawler identifies itself as "facebookexternalhit/1.1 (+http://www.facebook.com/externalhit_uatext.php)"
Once I had that I was able to just add a little conditional logic to let the crawler bypass authentication and access my site. I hope this helps others.
First I made sure I had all my meta properties set, then I just put my code in this:
if (strpos($_SERVER['HTTP_USER_AGENT'],"externalhit_uatext")<5)
{
}