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

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>

Related

How can I change the size of the image in this script?

How can I change the size of the image in this script to be larger? I see nothing in this script about height.
<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/sdk.js#xfbml=1&version=v2.3";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="https://www.facebook.com/pages/Crown-Jewel-Coins-and-Currencies/2408904309248837" data-layout="button_count" data-action="like" data-show-faces="true" data-share="true"></div>
You can't actually change the size of the image from that script. That script outputs an iframe of the Facebook social buttons, which you can't customize. What you can do, is use your own custom image and use the Facebook Graph API to open dialogs upon clicking on your custom button:
https://developers.facebook.com/docs/sharing/web

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.

Uncaught Error: No version specified facebook sdk

I'm updating the like facebook button in my website I just followed the instructions in the facebook developer page, I'm getting the following error:
Uncaught Error: No version specified
that's located in the line 82 of the facebook SDK (sdk.js)
the code is the following:
<div class="fb-like" data-href="https://www.facebook.com/fan-page-x" data-layout="button" data-action="like" data-show-faces="true" data-share="true"></div>
<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/sdk.js#xfbml=1&appId=xxxx&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
The like button appears on the page but I get the error in the console.
make sure you don't have another FB JS SDK initialization code in your page.

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>

Facebook Like button plugin not showing up in my browser

Im using dreamweaver cs5. I'm trying to put a facebook like box with the faces on a website for the first time.
When I preview my website in a browser (not server), the plugin doesn't show so Im guessing there is something wrong with my code.
Any advice is much appreciated.
This is my code:
<div class="float-left">
<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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="https://www.facebook.com/UnifiedSweden?ref=ts&fref=ts" data-send="true" data-width="300" data-show-faces="true" data-font="arial"></div>
Try,
js.src = "http:/connect.facebook.net/en_US/all.js#xfbml=1";

Categories