how to put"like button" of facebook and twitter in my website? - facebook

I want to put "like" button of facebook in my website, I use this
<html>
<head>
<title>My Great Web page</title>
</head>
<body>
<iframe src="http://www.facebook.com/plugins/like.php?href=https://www.google.com.sg/"
scrolling="no" frameborder="0"
style="border:none; width:450px; height:80px"></iframe>
</body>
</html>
however, it doesn't work if I haven't log into facebook, what't the problem?
and how to implement the same function in twitter?

There is generators for both Twitter and Facebook integrations available for free at the corresponding company's webpage.
However, as you've already written, it will only work when logged in. When you are not logged in it'll display a login page for facebook, see here for a working jsfiddle with your code:
http://jsfiddle.net/Y5WAp/
And here for a screenshot of what happens (and SHOULD happen) when I try to like without being logged in to facebook:
http://i.imgur.com/U2Tgz.png

Related

Embed content in facebook feed

How can I share embed content on facebook? For instance this facebook post https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Fvine%2Fposts%2F1119625504750685&width=500 links to a Vine item that embeds an iframe. The iframe is from facebook itself, but it runs some javascript from Vine. Can I do that for my own product, or is it some kind of partnership between facebook and Vine?
I could not find anything about such embedding in fb docs. To clarify, I'm not trying to put facebook content in my website, but my content into facebook.
From their website
https://developers.facebook.com/docs/plugins/embedded-posts
Such as from here:
<html>
<title>My Website</title>
<body>
<script src="//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5"
async></script>
<div class="fb-post"
data-href="https://www.facebook.com/20531316728/posts/10154009990506729/"
data-width="500"></div>
</body>
</html>

Facebook share not working

Have this problem, I have a WordPress website and on the single.php file when articles are we have a scrolling social bar, with Facebook like, Tweeter and Google+
However I wanted to change the Facebook like into a Facebook share button.
Anyone have the answer to this, I've been searching for ages to find a solution.
The Facebook like code I have is:
<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink($post->ID)); ?>&layout=button_count&show_faces=false&width=100&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:100px; height:20px;">
</iframe>
I have tried using: <div class="fb-share-button" data-href="<?php the_permalink() ?>" data-type="box_count"></div>.
This doesn't display all the time in Firefox and is virtually non-existent in Chrome, Safari and IE.
I use Facebook comments, so when share button doesn't appear, nor does the comments section.
I'm at my witts end with it.
Many thanks in advance
Try removing data-href="perma-link stuff" that Facebook automatically puts in for you.

Add to interest list via the Facebook API

I'm relatively new to facebook API, but would like to know how to allow a user to add a page to "Interest Lists" through the API, or social plugins? For example:
<html>
<head>
<title>My Great Web page</title>
</head>
<body>
<iframe src="https://www.facebook.com/plugins/like.php?href=YOUR_URL"
scrolling="no" frameborder="0"
style="border:none; width:450px; height:80px"></iframe>
</body>
</html>
Is how to like, and I understand that is basic but anything just so I can allow a user to add a liked page to their interest list.
API
You can't post to the interests connection. It's not supported in the Graph API.
Your app can retrieve a user's interests with the GET request
graph.facebook.com/USER_ID/interests
You'll need the
user_interests
friends_interests
permissions.
However, you can't post to the interests connection. You'll get the GraphMethodException "Unsupported post request" in return if you try.
Social Plug-ins
None of the Social Plug-ins has posting to interests as a feature.

Facebook like button doesn't apear

Hi I am trying to add a facebook like button to a website of mine but nothing seems to apear I've checked about a dozen tutorials and Im doing exactly what is being said there and the facebook button dosent apear.On firefox it shows nothing but on chrome , IE9 , opera and safari I get a this page can not apear error:
This is the link I'm using to generate the code:
http://www.facebook.com/pages/WillKode/228217780608588
And this is a test page i've created:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FWillKode%2F228217780608588&send=false&layout=standard&width=450&show_faces=false&action=like&colorscheme=light&font&height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>
</body>
</html>
Are you testing just a local HTML file? It seems to work for me: http://jsfiddle.net/jhchen/D8pgg/.
Try to change the iframe src to https://www.facebook.com instead of //www.facebook.com. It should be the latter (the way you already have it) but when testing locally the latter will not work.
Reason is // mean use the protocol of the document which is great security-wise because the iframe will use https://www.facebook.com if you are on an https page and http://www.facebook.com when you are on an http page but if you are just testing locally the protocol is file:// and file://www.facebook.com does not lead anywhere.

How to embed iframe in facebook?

An associate of mine maintains a facebook page for the company we work for.
The company wants a widget to put on their facebook to allow users to enter their email and subscribe to our newsletter.
The associate who does facebook is not a programer so he asked me to build something.
I made a small page that uses jquery and ajax to allow you to enter your email address and it sends it to our server using ajax so you never leave the page you are on.
We want to embed this page on facebook using an iframe.
First we just tried entering the iframe, which did not work,
then we found a tutorial and tried to embed the iframe the way it says like this:
<a onClick="outside_location.setInnerFBML(link_1);" style="cursor: pointer;">Let's see that iframe....</a>
<div id="outside_location"></div>
<fb:js-string var="link_1">
<fb:iframe height="500" allowTransparency="true" frameborder="0" scrolling="no" style="width:100%; border:none" src="http://URL-TO-OUTSIDE-LOCATION"></fb:iframe>
</fb:js-string>
<script type="text/javascript" charset="utf-8">
var outside_location = document.getElementById('outside_location');
</script>
It seems like facebook is appending things to our variables so link_1 becomes something like a325461252_link_1
Then we get a JS error like this:
Uncaught reference error:
a325461252_link_1 not defined
But every once in a while it will work but 99% of the time we get this error.
I have never built anything for facebook before, I am not sure there is is some sort of facebook way of doing things.
Is there something I am doing wrong? I have done many google searches trying to find answers and everything I find varies from "facebook does not allow iframes" to "facebook recommends iframes" so I really don't know what to think.
Check to see that your application is setup as an FBML applicaiton and not an Iframe application. An iframe application will not expand fb:... tags by default. Also inspect the DOM (Chrome or Firebug) to see if the Dom is getting changed when you click the link, but the iframe just isn't visible.
I just tested the following and it worked:
<hr/>
<a onClick="outside_location.setInnerFBML(location_two);" style="cursor: pointer;">Other IFrame Location</a>
<div id="outside_location" width="540" height="270" >
<fb:iframe width="540" height="270" frameborder="1" src="http://www.yahoo.com" />
</div>
<fb:js-string var="location_two">
<fb:iframe width="540" height="270" frameborder='1' src='http://www.google.com' />
</fb:js-string>
<script type="text/javascript" charset="utf-8">
var outside_location = document.getElementById('outside_location');
</script>
If all you wanted to do is add an iFrame to your application canvas then you can simply use this line:
<fb:iframe width="720" height="570" frameborder="1" src="http://www.yahoo.com" />
Or just change your application from an FBML canvas application to an iFrame application and point your Canvas Callback and Connect URL to your current page or page's directory. If you aren't using Facebook's API or FBML elements then you may not need to be in an FBML application at all.
BTW: To programmatically add iframes in Facebook you can use JavaScript like so:
<script type="text/javascript">
var Iframe = document.createElement('iframe');
Iframe.setStyle('smartsize','true');
Iframe.setStyle('frameborder','yes');
Iframe.setStyle('scrolling','no');
Iframe.setStyle('include_fb_sig','true');
Iframe.setStyle('width','500px');
Iframe.setStyle('height','500px');
Iframe.setSrc("http://www.msn.com");
document.getRootElement().appendChild(Iframe);
</script>
Good Luck!