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 ;)
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!
Hello Ive been struguling with this for a while.. and just cant get my head around it.
I do have the meta tags required :
<link rel="canonical" href="http://www.profsonstage.com" />
<meta property="fb:app_id" content="366418850196673">
<meta property="og:title" content="ProfsOnStage"/>
<meta property="og:site_name" content="ProfsOnStage" />
<meta property="og:description" content="Welocme to ProfsOnStage Web Site" />
<meta property="og:url" content="http://www.profsonstage.com" />
<meta property="og:type" content="article" />
<meta property="og:image" content="http://www.profsonstage.com" />
But when I try to use the share button facebook scraper doesnt fetch any data but the link.
When I check what the scraper sees I get :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script>function set_cookie(){var now = new Date();var time = now.getTime();time += 19360000 * 1000;now.setTime(time);document.cookie='beget=begetok'+'; expires='+now.toGMTString()+'; path=/';}set_cookie();location.reload();;</script>
</head>
<body></body>
</html>
I hope anyone can point me into the right direction to fix this. Checked a lot of similar questions but I was unable to find an answer regarding this issue.
Also I get this in my console log
Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains.
And My APP urls are :
www.profsonstage.com/
profsonstage.com/
I just don`t understand what is the problem here.
Seems like its a hosting issue. If anyone get a problem like that contact your hosting provider.
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 want to code my website in such order so if someone paste my website's URL in their facebook status update or in their profile page,this post will display correctly,with an image on the side,text parsed from the website.
For example i am posting a screenshot.The one on the left is my site.The one on the right is some random site.See they have included a picture,a text paragraph,a title and so on....
Are there any special guideline or rules i should follow or is it out of my powers.
Also,i could even think a search term for googling it so i post it here(dont even know what to search at FB apis).
Thank you all!
Take a look at the Facebook Docs. You'll need to include Open Graph tags withinin your <head>
https://developers.facebook.com/docs/opengraphprotocol/
From the docs:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
<title>The Rock (1996)</title>
<!-- the bold title on Facebook -->
<meta property="og:title" content="The Rock"/>
<meta property="og:type" content="movie"/>
<!-- the url under the title on Facebook -->
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
<!-- the image to the left of text on Facebook -->
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
<meta property="og:site_name" content="IMDb"/>
<meta property="fb:admins" content="USER_ID"/>
<!-- the description under description and title on Facebook -->
<meta property="og:description"
content="A group of U.S. Marines, under command of
a renegade general, take over Alcatraz and
threaten San Francisco Bay with biological
weapons."/>
...
</head>
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>