I'm trying to implement a Facebook Like button on my site. It's at a subdomain.
I've tried putting the link in the script tag of the Like button and now I'm trying to use Open Graph meta tags. Neither works. I have:
<meta property="og:title" content="My Site"/>
<meta property="og:type" content="article"/>
<meta property="og:image" content="http://www.example.com/image1.png"/>
<meta property="og:url" content="http://mysite.example.com/"/>
<meta property="og:site_name" content="My Site"/>
<meta property="fb:app_id" content="123123123"/>
And the button:
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like show_faces="false" width="450"></fb:like>
It works, but when I like something it says:
John likes My Site on example.com.
How can I make it use the subdomain? I have the subdomain listed in the application settings as well.
Thanks
Try adding the full url of the page to like as the href value on the fb:like element. Something like:
<fb:like href="http://mysite.example.com/" show_faces="false" width="450"></fb:like>
Related
I am using the LinkedIn like button and the Facebook Like button.
On the LinkedIn when I click like, it works property, but I was wondering how I would change the name of the title on the pop dialog that comes up?.
For the Facebook Like button, how would I change the image thumbnail in the pop dialog box?.
Well I got the image thumbnail to work using
<meta property="og:image"
How ever I still have not been able to change the title for LinkedIn
I tried:
<meta property="og:title"
<meta property="og:site_name"
and none of those worked....is there a debugging site for LinkedIn, like Facebook does.
As fas as I know, it is not og:site_name, but og:title. The code below works perfectly for me so I am enclosing it (remember to change the content). Hopefully it'll fix your problem.
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta property="fb:app_id" content="APP_ID" />
<meta property="og:type" content="website" />
<meta property="og:title" content="My cool website" />
<meta property="fb:admins" content="ADMINS_ID"/>
<meta property="og:image" content="http://mywebsite.com/images/mylogo.png" />
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
The facebook like plugin (used as iframe) still not working for the website i work.
I'm aware for the problems that ocurred last week but I don't even have the debugger working for the URLs.
Example:
simple article
In the image below you can see where the fb:like button should appear.
The same URL of the article above at the facebook URL debugger (link) show no response about the open graph tags - and all the meta tags are ok in my point of view:
<meta property="og:url" content="http://extra.globo.com/famosos/zilu-assume-pela-primeira-vez-que-esta-separada-de-zeze-di-camargo-vida-continua-5767649.html"/>
<meta property="og:title" content="Zilu assume pela primeira vez que está separada de Zezé Di Camargo: ‘A vida continua’" />
<meta property="og:locale" content="pt_BR">
<meta property="og:type" content="article" />
<meta property="og:image" content="http://extra.globo.com/incoming/5767648-1c6-157/w107h60-PROP/zilu-zeze-dicamargo.jpg"/>
<meta property="og:site_name" content="Extra Online" />
<meta property="fb:app_id" content="205680889447721"/>
<meta property="fb:admins" content="100000043813964" />
Actually, there is one non-closed meta tag og_type but it isn't the real problem (meta at w3schools - section Differences Between HTML and XHTML and the page doctype is HTML).
There is a possibility of a problem not in the website but at facebook?
I would try to put the Like button iFrame outside of the <div
id="fb-root">, it does not belong there. Put it below the <div
id="fb-root"> and use a div with another id if you need to wrap it.
For the debug tool problem I would try to place my og meta data above
anything else right behind <meta http-equiv="content-type"
content="text/html; charset=utf-8"> so that nothing odd happens
before the Facebook bot scrapes the info it needs.
i am having some tweets like things and i would like to post that custom text with facebook like button. is it possible if yes then how.
thanks
Use Open Graph Tags:
Put this tags on your page head section:
<html xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta property="og:image" content="custom image path" />
<meta property="og:site_name" content="name of the website" />
<meta property="og:title" content="custom title" />
<meta property="og:url" content="url of the page" />
<meta property="og:description" content="custom description" />
<meta property="og:type" content="website/article/game etc.." />
</head>
use Linter to check your custom properties has affected.
More about Opengraph tags
You should add OpenGraph meta tags to the page located on URL you linking your like button. Once user click on Like Button Facebook crawl that page and post content of OG tags to feed.
Read more on Like Button documentation and Open Graph protocol
Although it is true as both the other commenters say you would need to create a facebook app which then would require a secure canvas URL in the end to be verified. Hence the obstacle is quite high.
I have a website that uses the Facebook like button.
I am attempting to get the "Administration" link to show up on the page so that I can push content to people who like the page.
My page's HTML namespace is like:
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#">
My meta tags are like so:
<link rev="canonical" href="http://mysite.com/welcome/" />
<meta property="og:locale" content="en_US" />
<meta property="og:site_name" content="MySite" />
<meta property="fb:app_id" content="012345678910" />
<meta property="og:title" content="Name of my page" />
<meta property="og:description" content="Description here..." />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://mysite.com/welcome/" />
<meta property="og:image" content="http://mysite.com/path/to/image.jpg" />
I have checked the page with the Facebook debugging linter and it passes without any warnings or errors. I am an admin of the app.
What am I doing wrong?
Note: I've also tried to put the <meta property="fb:admins" content="01234567" /> in to no avail. I've also tried different xmlns tags and even without any xmlns tags.
There is no og:admins tag. Try fb:admins and fb:app_id tags:
<meta property="fb:admins" content="USER_ID1,USER_ID2"/>
<meta property="fb:app_id" content="1234567"/>
You'll also need to press the 'Like' button.
1) Are you logged into Facebook
2) How long have you been waiting it can take some time to trickle thru Facebook's Servers.
3) The correct tag is fb:admins check Page Administration on https://developers.facebook.com/docs/opengraph/ -
<meta property="fb:admins" content="USER_ID1,USER_ID2" />
Also your og:app_id is wrong it is fb:app_id
4) At the bottom of the debugger it will give you a Graph URL click that to confirm the admins are correct
Whats the URL you are trying in the debugger?
It appeared that the problem stemmed from having the wrong xmlns tags in the <html> element.
I had a custom xmlns tag that was sending likes to the wrong graph (I believe...).
The current tags that are working are:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="https://www.facebook.com/2008/fbml">
After this change, liking a page would show up the Administration link.
Thanks for the responses!