We Keep Coding

Append style to facebook like button

I'm trying apply a custom CSS to fb like button using this code:
$("#fblike").css("background-color", "red");
But isn't working, I'm getting this error: Uncaught TypeError: Cannot read property 'css' of null
Is there any way to solve this? Here is my code:
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = 'https://connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v3.1&appId=XX&autoLogAppEvents=1';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<span class="fb-like">
<fb:like id="fblike" name="fblike" send="true" width="450" show_faces="true"
href="https://www.facebook.com/cocacola/"></fb:like>
</span>
Also, I've tried using CURL to parse my facebook page to handle elements, but still asking to login, so I'm not able to apply the CSS in this case too...
Thank you.

Add share on facebook button on webpage

I am trying to add fb share in drupal site i want to do it with javascript so I followed following steps
Created on app page through Facebook developer
There I have created app and got appid and code to put on my template following is the code
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId=myappid";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
I am getting:
Uncaught TypeError: Cannot read property 'fb_app_id' of undefined this error in
console
Do I need to link any other js file something I am missing because of that share button not coming

Share button on my web application

I want to add a button to share a picture. This is my code in tag body:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/it_IT/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-share-button" data-href="my_image"></div>
Don't work. When i run my page.html it show an error:
GET file://connect.facebook.net/it_IT/sdk.js net::ERR_FILE_NOT_FOUND
However I WANT TO SHARE WITHOUT ID_APP!

Since you're testing this locally using a file path, "file:" is prepended onto the URL for the facebook script, hence the "file://connect.facebook.net". If you change the url to use "http:" or "https:" in the script, it should work as desired.

Social icons Twitter and Facebook do not load completely

Having a weird problem with social icons on my page.
G+ is working perfectly but the Twitter Share button + FB Like button do not load up when my html page has finished loading.
Twitter:
Tweet
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
here I only see the plain text "Tweet" (as a link) when the page finished loading. Not the actual twitter button.
Facebook (using some rails code here to display the current URL), here I don't see anything:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=.......";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="<%= request.original_url %>" data-width="100" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false" data-send="false"></div>
Funny thing is:
After the page has loaded and when I hit the reload button (CMD+R), the icons are showing up perfectly!
No idea how to solve that issue.
I have tried to show the content using JS only when the document has finished loading but that did not solve it.

The turbolinks gem caused the problem.
Solved by following these tips here:
http://reed.github.io/turbolinks-compatibility/twitter.html
http://reed.github.io/turbolinks-compatibility/facebook.html

<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-post"
data-href="https://www.facebook.com/photo.php?v=10153444775720220"
data-width="550">
<div class="fb-xfbml-parse-ignore">
<a href="https://www.facebook.com/photo.php?v=10153444775720220">
Publication</a> de
<a href="https://www.facebook.com/tsahalfr">
Tsahal-Armée de Défense d'Israël</a>.
</div>
</div>

Like Button social plug in code not working for browser..!

Hi I am trying to run the same code on JSFIDDLE.NET and its working abs fine.
But When I run the code under body tag in browser it shows no result and error in chrome console:
In the end I want to same html file in webView on Android so that I can like a page.!
Failed to load resource file://connect.facebook.net/en_US/all.js#xfbml=1&appId=415120148602947
I think javascript is not running.
Code Goes like This:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=415120148602947";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://developers.facebook.com/docs/reference/plugins/like" data-send="false" data-width="450" data-show-faces="true"></div>