FB Connect - Login button not clickable - facebook

On my site the fb connect login button suddenly became unclickable, I have no idea what I did
http://www.belginfish.com/mp3/
(top right)
If anyone has any idea that would be excellent!

A div element with class="search_area" is lying on top if your facebook button. Its transparent so the fb button is still visible. Rectify your html/css and fb button will work just fine.

I had a similar problem. We were upgrading from FB Login v1.0 to v2.1. The old version was relatively simple to skin by just swapping in your own background image, and hiding the original image, like:
background: url(/ui/img/fb-login-small.png) no-repeat;
text-indent: -9999px;
Unfortunately in v2.1 this same code will hose you. You'll end up seeing your custom image, but it won't be clickable. Furthermore, the real button does load without any errors, and is promptly shuttled off -9999px offscreen. That can be pretty confusing.
The solution is to just get rid of the image replacement (get rid of the 2 CSS lines above) so the real FB login button can show through.

Related

Facebook like button bug on page load

I have an irritating bug with the Facebook like button. When my page is loading, my share buttons (Facebook like, Tweet, +1 buttons) will start on the left side. Then they will appear in the middle of the page. And finally when the loading is finished, they will appear in the correct position on the left side again.
The shifting of the share buttons all over the page is kind of annoying and looks unprofessional, even though they end up at the correct position on the left side when the page is done loading.
I believe this is related to the Facebook like button. I have tested this in IE and Chrome in Windows. I have also tested this in Safari on IPhone. All browsers seem to have the same problem.
You can see the bug here:
http://www.alphabanter.com/
Is there any way to fix this?
I figured it out. Looks like width=450 was causing the problem. I removed width=450 and the Like button now stays on the left side of the page and does not jump around anymore. Maybe there is a deeper reason why width=450 causes problems for my page but at least it works now.

Send button not displaying in my web page

I tried with HTML5 as well as XFBML version also but send button not appearing on my webpage.
I used the code from https://developers.facebook.com/docs/reference/plugins/send/ for http://www.rakthadanam.com. On the developers.facebook.com it is showing properly but on my site it's not displaying.
Well, that´s because you cut it from the Social Plugin. There is just no space for it right next to the like button, you are going to have to make it bigger.
Also, there is "send=false" in the source code, so of course there is no send button at all.

Fancy Box center within Facebook iframe fanpage

Hi I have a 1500px high fan page in facebook.
The fancy box popup centers in the middle of the 1500px iframe.
CSS positioning of #fancybox-wrap class to an absolute position (top:
50px !important;) does not work! If you are at bottom of page
and fire the fancy box popup it is not visible until you scroll back to top of the page.
I looked at the following STACKOVERFLOW fix but this did not work::
Fancybox Positioning Inside Facebook Canvas iFrame...
I am using the latest version of fancybox.
Thanks in advance for any help
(am pulling my hair out :()
cheers
Jaimie

adding facebook like and tweet buttons to an exhisting tumblr theme

I am trying to add facebook 'like' buttons and tweet buttons at the end of each blog post on my tumblr blog. I used the 'minimalist' theme on tumblr. Ive tried just about every method to insert the html properly and nothing has worked. Below it the current full HTML that I am using. If you go to my site right now there is a facebook button and it actually works but there is a ton of blank space underneath that I cant get rid of. Also, it works in Safari but not Firefox which is odd. The fbook code is right before {/block:posts}. I've been able to look at other formats of buttons but they either like my entire page rather than individual posts or I have this same spacing/firefox issue. Can anyone help?
</div>
</article>
Comments
{/block:Posts}
I cant even get that. I've done this task a few times before with other themes and it is no problem at all. It sounds like you didn't uncheck the boxes on Facebook that enable the big black space go back to f.b. and get a new code made from the link page. Do not forget to uncheck the unneeded stuff or that will also be embedded in the code given you.

Facebook Fan Gate Page with jquery overlay

I'm basically creating a 520px wide welcome page for Facebook which I will upload onto the server and then Iframe it into a Facebook fan page. I'm doing this using HTML, CSS and JQuery rather than the old FBML method.
I've seen a lot of companies using an overlayed image to tease the user to 'like' the page. Once the user have liked the page, the content underneath is visible.
Examples:
https://www.facebook.com/redbull
https://www.facebook.com/smirnoffus
Red Bull - when the like button is triggered the transparent image is hidden to show content underneath
Smirnoff uses an image to give the illusion that the image is overlayed on top of the content. Somehow when the like button is triggered, the image is swapped for content.
Can anyone shed any light on how this can be acheived? I don't mind which one - Smirnoffus looks easier but might be a pain as everytime I update the content, I'll need to update image too.
When a user likes your Facebook fan page, Facebook will reload the whole page. You can then use server code to inspect the signed_request post parameter that they will send over. This question has an example code of how to detect if they liked the page in server side code.