Sometime ago I made a like button for my website with the help of this tool: http://developers.facebook.com/docs/reference/plugins/like/ and it worked well, the visitor could like the page and also make a comment.
Recently I noticed that the like button doesn't work anymore, when I click it the count goes +1 for a second then reverts back, also the comment windows appears and disappears as quickly.
I have searched the internet and found that I know have to have an appid, so I got one and added to my existing headers for facebook
<meta property="og:title" content="Title" />
<meta property="og:type" content="game" />
<meta property="og:url" content="http://www.myurl.com/url.html" />
<meta property="og:image" content="http://www.myurl.com/my/image/url.jpg" />
<meta property="og:site_name" content="Jocurile.US" />
<meta property="og:locale" content="ro_RO" />
<meta property="fb:admins" content="1058594454" />
<meta property="fb:app_id" content="294633860579624" />
Checked it with http://developers.facebook.com/tools/debug and it doesn't give any errors, but my like button still doesn't work.
The integration code that I use on my page is
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like href="<?php echo $canonical;?>" send="false" layout="button_count" width="400" show_faces="false" colorscheme="dark" font="arial"></fb:like>
I haven't written my url because I don't want people to think I want likes but if it's necessary I will give you the url.
I just found out that the culprit was the facebook button color scheme.
People had to confirm that they liked my page but the button was showing the text colored in white over a white background, because the color scheme was dark.
Related
I have a problem whenever I try to click my share button for the first time...
It's not seeing my og:image, but it's seeing my site logo instead.
See: http://d.pr/i/NIQZ
But for the second share and/or second attempt of clicking the share icon again, it begins to load the correct og:image or rather the thumbnail.
Proof: http://d.pr/i/vWAg
Here are my meta tags:
<meta property="og:image" content="http://stmaws.s3.amazonaws.com/thumbs/53184e19fd3401484600109b.jpg?AWSAccessKeyId=AKIAJQPNZH4P5E5ZY4LQ&Expires=1394388088&Signature=QTgflfyCzyIXVB%2BrMn2hBRw6srM%3D" />
<meta property="og:image:secure_url" content="https://stmaws.s3.amazonaws.com/thumbs/http://stmaws.s3.amazonaws.com/thumbs/53184e19fd3401484600109b.jpg?AWSAccessKeyId=AKIAJQPNZH4P5E5ZY4LQ&Expires=1394388088&Signature=QTgflfyCzyIXVB%2BrMn2hBRw6srM%3D.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="300" />
<meta property="og:image:height" content="300" />
<meta property="og:title" content="Check out what I made on Muserk.com" />
<meta property="og:site_name" content="Check out what I made on Muserk.com" />
<meta property="og:description" content="Muserk.com gives you the ability to legally add music to your videos and share them with the world!" />
<meta property="og:url" content="http://www.muserk.com/video/index/531a092efd3401725c00067f" />
The url that I want to share is: http://www.muserk.com/video/index/531a092efd3401725c00067f
Facebook Debugger tool is showing response code 200 so I can't replicate this issue.
https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fwww.muserk.com%2Fvideo%2Findex%2F531a092efd3401725c00067f
Sharer link: https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fwww.muserk.com%2Fvideo%2Findex%2F531a092efd3401725c00067f
PS: I cleared my browser cache like 5 times already and got no luck.
EDITS:
In my app that uses the sharer.php? way of catering share buttons, how can I implement the scrape=true paramater. Any ideas?
Tried to add the parameter to my sharer link but didn't work
https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fwww.muserk.com%2Fvideo%2Findex%2F531a092efd3401725c00067f&scrape=true
I have incorporated facebook like button in my application
Suppose you like this page
https://developers.facebook.com/blog/post/397/
Then, when you go to your facebook wall, you will see "fb_account_name" likes an article on developers.facebook.com.
I want my like to work in this way. My like button is not working in this manner, it does not show my website name with sentence like "fb_account_name" likes an article on
I have get my code from here https://developers.facebook.com/docs/reference/plugins/like/
What should i do ?
The open graph protocol
In your page head tags, Add:
<meta property="og:site_name" content="Site Name" />
<meta property="og:title" content="Page Title" />
<meta property="og:type" content="article" /> // site type (og type)
<meta property="og:url" content="http://example.test/" />
<meta property="og:image" content="http://example.test/og_image.png" /> // can be .jpg, too
<meta property="og:description" content="A sentence describes your site purpose" />
Those above will help Facebook to understand "How to publish the user action on their timeline" when hits the "Like" button
<div class="fb-like" data-href="http://example.test/myPage.html" data-width="450" data-show-faces="true" data-send="true"></div>
And remember to include Facebook JS
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
Ok, i know there's a lot of posts on this topic and i have read through a lot of them; however, i have yet to be able to solve my problem.
I am trying to add a Facebook like button to a website and use the Open Graph protocol to send specific information for the post that gets posted to the persons news feed that clicks the like button.
This is the code blocks i am using on the site:
HTML tag:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://developers.facebook.com/schema/">
Meta Tags:
<meta property="og:title" content="ethneCITY - Reaching the unreached in the urban center!" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://www.ethnecity.com/dev/images/share.png" />
<meta property="og:site_name" content="ethneCITY" />
<meta property="fb:admins" content="61800397" />
<meta property="og:description" content="100 yrs ago we sent missionaries to the nations to look for the cities. Today you go to the cities & you find the nations." />
Like button code generated from Facebook's like button creation tool:
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=145713945515336&xfbml=1"></script><fb:like href="http://www.ethnecity.com" send="true" layout="button_count" width="150" show_faces="false" action="like" colorscheme="dark" font="tahoma"></fb:like>
How it appears on my news feed right now? (not what i want) - http://tinypic.com/r/axi2kg/7
Anyone have any ideas why when i click the like button it only displays the post on my news feed like this instead of using the meta tags for the feed content?
Did you lint it?
Its data is likely out of date/cached and it just hasn't updated yet.
http://developers.facebook.com/tools/debug
I am building a News section for a client website (in ExpressionEngine) and they have requested that each article have the Facebook like button. So I went to Facebook's developer site and found the necessary code to make it work.
The problem I have is that if I like one article, it counts that like for all of them! I'm using my ee tags for title and permalink in the OpenGraph meta tags, but to no avail.
Open graph code:
{exp:weblog:entries weblog="news" orderby="date" sort="desc" limit="1" disable="member_data|trackbacks"}
<meta property="og:title" content="{title}" />
<meta property="og:type" content="non_profit" />
<meta property="og:url" content="{title_permalink=news/article}" />
<meta property="og:image" content="http://dallascityhomes.net/_images/dch-logo-big.png" />
<meta property="og:site_name" content="Dallas City Homes" />
<meta property="fb:admins" content="--removed--" />
{/exp:weblog:entries}
The actual button (it is wrapped within a exp:weblog:entry tag):
<div>
Tweet
<fb:like href="{title_permalink=news/article}" layout="button_count" show_faces="false" width="80" font="arial"></fb:like>
</div>
And of course the JS script for FB like, I moved to the bottom of the doc:
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
Has anyone encountered this before? Know a solution?
Do the og:url meta property and the href property of the fb:like tag appear to be rendering correctly when you view source?