"Like" button not working, (iframe) version - facebook

I know this is a common question but I haven't found any answers. I click the button but nothing happens. I've been using the linter and have all the og tags.
Here's my code (straight from the like button creator) and site:
<iframe src="//www.facebook.com/plugins/like.php?href&send=false&layout=button_count&width=450&show_faces=true&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>
http://alexcieminski.com/index.html
Thank you.

?href& This is the problem. You need to really put your url-encoded url here: ?href=%3A%2F%2F&
Also check out your page in the linter: http://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Falexcieminski.com%2Findex.html
It says you should also specify the og:description too.

You need to remove all the 'amp;' that separate the query strings. So, instead of having '&' separating each query strings you should just have '&'. You also don't have anything for url for 'href'

I was facing this problem from last 4 hours & it turned out to be a browser related issue. After I've started accepting third party cookies from http://www.facebook.com/ suddenly every thing started working...

Related

Blogger - How to Percent Encode an URL / Escape It to Use as Query Param?

In blogspot template engine how do you escape the post URL to use it as a query param so you can use it in facebook / twitter / whatever buttons and iframes?
Problem: I have an iframe with a src that takes an URL.
<iframe src="https://www.facebook.com/plugins/like.php?href=MY_URL_GOES_HERE">
So say my post URL is http://example.blogspot.com/1999/01/first.html. I need to convert :/. to percent encoded characters, and also ?&% etc. Otherwise I get this:
<iframe src="https://www.facebook.com/plugins/like.php?href=http://example.blogspot.com/1999/01/first.html">
And that just looks like it's going to break someday. How can I escape the URL in blogger?
The way to do it is pretty simple and all it takes is wasting a couple of hours searching every corner of the internet for some semblance of documentation on blogspot's template engine and reading through a bunch of StackOverflow's answer that just dismiss the question with "use shareurl instead."
Anyway. Every string in blogspot templates has a .escaped field that is the string escaped. That is it. You just anyurl.escaped and it works. It can be data:post.url.escaped or data:post.url.canonical.escaped or whatever.
<iframe
expr:src=""https://www.facebook.com/plugins/like.php?href="
+ data:post.url.canonical.escaped + "width=173&layout=button_count&action=like&size=small&show_faces=false&share=true&height=46&appId=YOUR_APP_ID_HERE"" width="173"
height="46" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
Other elusive string attributes can be found in this extremely fishy blog: http://template-data.blogspot.com.br/2016/04/title_58.html
You'd think google would have this info somewhere easy to find but all they got are blogger HTTP API docs? What?

The Like Link don't work correctly

I have a quick question, maybe someone can help me.
I have some items that will each receive a like-link, that works quite well, only when transferred to FB the link is "cut".
Instead, of www.domain.de/news/name-der-news/&pos=1 he gives only
www.domain.de/news/name-der-news/
Have you any idea how I can fix it?
Thank you
You need to url encode it, so that special characters will be encoded, such as '?', '=', etc...
With your example, the encoded url is:
www.domain.de%2Fnews%2Fname-der-news%2F%26pos%3D1
Here's an online url encoder/decoder: http://meyerweb.com/eric/tools/dencoder/
Sure...
The link is e.g. http://www.hagelshop-lounge.de/news/13/21/Rock-your-style/&pos=1
and the code:
<iframe src="//www.facebook.com/plugins/like.php?href={$cgsimple->self_url()|replace:":":"%3A"|replace:"/":"%2F"|replace:"&":"%26"|replace:"=":"%3D"}&send=false&layout=standard&width=450&show_faces=false&action=like&colorscheme=light&font=arial&height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>
Written like that the the link will look like this:
http%3A%2F%2Fwww.hagelshop-lounge.de%2Fnews%2F13%2F21%2FRock-your-style%2F%26pos%3D1
but still the &pos=1 will be missing...
Thank you for your help.

Add Like Button to website

I am trying to install the like button on my website but cannot get it to appear on the website.I have tried everything but no joy. I have pasted the codes etc. etc but nothing. I use Serif Webplus X2 for web design.
I added the code to a html text box and after uploading to the web only the code print appears on the website but no button. However if I use the Facebook Platform code it works??
I had the same problem, i found interesting information on this website
http://www.webmonkey.com/2010/04/adding-facebook-like-buttons-to-your-site-is-damn-easy/
More easy, Facebook generate the code for the button "I like" for any website.
http://developers.facebook.com/docs/reference/plugins/like/
Add the below HTML code on any page:
<iframe
src="https://www.facebook.com/plugins/like.php?href=http://www.facebook.com/NiraTechTraining?ref=ts&fref=ts"
scrolling="no" frameborder="0"
style="border:none; width:450px; height:80px">
</iframe>
Get Your Code Here: http://developers.facebook.com/docs/reference/plugins/like/
The easiest way is to use a "iframe".
Make a HTML block and paste it into the body (Click the 'Paste to Body' Button on top right)
If it doesn't work in your preview, you have to Host it.
If you are willing to upgrade, Serif WebPlus X6 and later versions include support for Facebook Like buttons. In X6, go to Insert->Social Media->Facebook Widget and select 'Like Button' from the drop-down.

Facebook "like" button on comments

Is it possible to implement the Facebook like and share functionality for "liking" the comments of other users on a website? Does every comment has to have a permalink?
I have asked the question on Facebook developers forum, and they have come back to me with this response. Basically, the functionality that is required is not available.
http://forum.developers.facebook.net/viewtopic.php?pid=316205#p316205
Intro:
You will need individual like buttons for every comment, and as #Fnatte says you can then reference them to the comment by giving it an ID like #com1,#com2etc...
The best way to achieve this is through a for loop (I imagine you are pulling from a DB) that will iterate through and add the relevant code for the like button and implement the URL based on the comment it is pulling,
The Code:
You have 2 options, <iframe>:
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fexample.com%2Fpage%2Fto%2Flike&layout=button_count&show_faces=false&width=90&action=like&font=segoe+ui&colorscheme=dark&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:90px; height:21px;" allowTransparency="true"></iframe>
This is VERY slow, especially if you have a lot of comments loading at the same time, it does mean you don't need to import their JS library though,
Then there is the FB JS SDK:
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="http://example.com" layout="button_count" show_faces="false" width="90" font="segoe ui" colorscheme="dark"></fb:like>
This I would argue is a more eficcient way of doing things, but it does require a bit more time and effort - but will be well worth it.
The script of course can be imported only once in the head and then used multiple times throughout the page (perfect for what you need).
The URL to like is based on both the URL in the address bar and the ID that you have assigned to the code (e.g. #comment1) so the URL you are liking looks like this: http://mypage.com/page#comment1
Further Reading:
http://developers.facebook.com/docs/reference/plugins/like/
http://developers.facebook.com/docs/reference/javascript/
http://developers.facebook.com/docs/plugins/
Good luck and I hope this helps!
DEMO & SOURCE http://so.devilmaycode.it/facebook-like-button-on-comments/
updated, hope this help
I have never done it myself but you should probably check out http://developers.facebook.com/docs/guides/web#plugins.
It looks like you would need a unique link for each comment.
You could try including a fragment identifier in every URL like:
http://domain.com/article1#comment1
http://domain.com/article1#comment2
Facebook has rolled out a new version of the comments plugin which supports advanced functionality such as "liking" and replying to other comments. In addition, replies to a comment made on Facebook.com are now pushed back to the comments plugin (hosted on another site.)
How to enable:
Add the migrated attribute:
<fb:comments xid="YOUR_XID" migrated="1"></fb:comments>
OR use the href attribute instead of xid for future comments boxes
<fb:comments href="YOUR_CANONICAL_URL"></fb:comments>
References:
New <fb:comments>
Legacy <fb:comments>

Facebook Like Box isn't working

I'm trying to add a Facebook "Like Box" to an existing website, as described here
The Page I'm promoting works just fine in preview-box on that page.
But when I copy/paste the code as shown to my website, it instead shows a fraction of an empty facebook page with only a partially visible error message.
<iframe src="http://www.facebook.com/plugins/likebox.php?profile_id=SenRandyGordon&width=260&connections=10&stream=true&header=true"
scrolling="no"
frameborder="0"
allowTransparency="true"
style="border:none; overflow:hidden; width:260px; height:px"></iframe>
I cannot figure out what I'm doing wrong, and I added "Like Box"'s in the past, before Facebook released their new API.
Please help?
Solution
You have to replace all the "&" of the Facebook Likebox generator code with "&" - then it works.
Combine this method with Lemmy's method to make it work.
So the final result looks like these instead
<iframe src="http://www.facebook.com/plugins/likebox.php?profile=1&id=SenRandyGordon&width=260&connections=10&stream=true&header=true" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:260px; height:px"></iframe>
I copied and pasted the code supplied for the iframe, and it didn't work. I discovered there was no http: before the code. Once I put it there, everything worked perfectly.
I also faced same problem using facebook's social plugin.
In this plugin if user enter wrong input then security question comes with random generated code with 2 words, but user can view only 1 word means it shows partial part..
Here is Onther solution .... It Really Works!!!
<script type='text/javascript' src='http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US'>
</script>
<script type='text/javascript'>FB.init('aaafdced248eed501f09f66e3c5b7de9');</script>
<fb:fan profile_id=\"118774364811981\" stream=\"0\" connections=\"10\" logobar=\"0\" width=\"244\" height=\"240\" css='serverside_facebook.css?1'>
</fb:fan>
I used above code in Java verticalPanel.getElement().setInnerHTML("above code");
It really works!
Change profile_id=SenRandyGordon to profile=1&id=SenRandyGordon
It work for me
try thins iframe code working fine and tested by me on wordpress
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2FEnter_Your_FB_ID_OR_USERNAME&width&height=290&colorscheme=dark&show_faces=true&header=true&stream=false&show_border=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:290px;" allowTransparency="true"></iframe>
John's answer might work. Haven't tried it. This worked for me:
change profile_id= to just id= in the embed code.