51

I am looking at the latest update to Facebook's share button. It seems that it's no longer possible to include a share button in a website without including the Facebook javascript SDK, or having a Facebook app somewhere that provides you with an app id?

Share button example 1 uses the Facebook SDK

FB.ui({
  method: 'share',
  href: 'https://developers.facebook.com/docs/',
}, function(response){});

Share button example 2 uses a custom app id

https://www.facebook.com/dialog/share?
  app_id=145634995501895
  &display=popup
  &href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
  &redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer

Question: how to build a plain and simple share button for Facebook with one line of code, that does not require libraries and app id's?

Kokodoko
  • 26,167
  • 33
  • 120
  • 197
  • Not possible. And why would you want to do that? – WizKid Oct 24 '14 at 15:21
  • 21
    A client has a website that needs a very simple "share this page to facebook" button, but I don't want to have to create an "empty" app just to create a button. Especially since the app has to be public. What's the point of having a public empty facebook app? Just so you can have an id? – Kokodoko Oct 26 '14 at 19:27
  • 2
    Yes. So we know who is behind it – WizKid Oct 26 '14 at 22:24
  • 26
    But what if people accidentally stumble upon my empty but public app via my Facebook page? That doesn't make sense does it? Also, if a client needs a share button, why would that have to be associated with my personal Facebook app? Should I ask the client to create their own app? – Kokodoko Nov 12 '14 at 14:43
  • Not only that, with "app" approach, you can add only one website-domain, that is you cannot test sharing on a development server. And you cannot offer working scripts that include sharing, because anyone using it on his domain has to become fb developer with his own app. Sharer.php on the other side seems to have problems in smartphones (http://stackoverflow.com/questions/14377968/cant-use-facebook-sharer-php-custom-parameters-in-mobile-sites), but might not be depracated in fact: http://stackoverflow.com/questions/27973009/is-facebook-sharer-php-endpoint-not-deprecated-anymore – Fanky Oct 19 '16 at 11:54
  • 5
    It is possible. Create a simple pop up window and use Facebook share dialog. https://developers.facebook.com/docs/sharing/reference/share-dialog No need for an FB application for a simple sharing of URL window.open("https://www.facebook.com/sharer/sharer.php?u=http://www.domain.com", "pop", "width=600, height=400, scrollbars=no"); – Carmela Nov 14 '16 at 09:31

5 Answers5

87

you can use facebook sharer link and a simple popup to do the job

$("#facebookShareLink").on("click",function(){
    var fbpopup = window.open("https://www.facebook.com/sharer/sharer.php?u=http://stackoverflow.com", "pop", "width=600, height=400, scrollbars=no");
    return false;
});
Eugene
  • 1,539
  • 12
  • 20
Reza
  • 965
  • 8
  • 7
  • 4
    Thanks. I thought this method was deprecated but apparently, Facebook is allowing it again: http://www.joshuawinn.com/facebooks-sharer-php-longer-deprecated-2014/ – Kokodoko Nov 27 '14 at 13:37
  • Thanks so much for this. Been trying to find a simple thing like that for hours! Glad it still works in '16 :) – IfElseTryCatch Aug 31 '16 at 08:49
  • It's still working as June 19th, 2017. But really, I'm still worried it may get deprecated in the future. :( – tom_mai78101 Jun 19 '17 at 12:16
  • I was able to use this example but I would add that there's no reason for a variable assignment and to put it into a document ready. Including a JQuery library this was what my code looked like: `$(function() { $("#facebookShareLink").click(function() { window.open("https://www.facebook.com/sharer/sharer.php?u=http://stackoverflow.com", "pop", "width=600, height=400, scrollbars=no"); return false; }); });` – AndyRBlank Dec 18 '17 at 20:40
  • 1
    The content that is shared in the this way is very static and only showing the site title for me, anyway i can change the text, and probably add image? – shababhsiddique Apr 06 '18 at 08:45
  • Still working at May 10th, 2018. It is inconvenient that FB js sdk can only share application url. Thanks for the answer. – 鄭元傑 May 10 '18 at 03:42
11

It is possible. No need for an FB application for a simple sharing of URL. Create a simple pop up window and use Facebook share dialog.

https://developers.facebook.com/docs/sharing/reference/share-dialog This is still included in their API as of the moment.

window.open("https://www.facebook.com/sharer/sharer.php?u=http://www.gmanetwork.com/news/", "pop", "width=600, height=400, scrollbars=no");
Carmela
  • 687
  • 1
  • 8
  • 15
  • 3
    Looking at the link on 6/15/18, all the examples indicate it wants an appid. The sharing url still does seem to work though – chrismarx Jun 15 '18 at 19:49
7

Create function who will center the pop-up every time.

function openURLInPopup(url, width, height, name) {
    if (typeof(width) == "undefined") {
        width = 800;
        height = 600;
    }
    if (typeof(height) == "undefined") {
        height = 600;
    }
    popup(url, name || 'window' + Math.floor(Math.random() * 10000 + 1), width, height, 'menubar=0,location=0,toolbar=0,status=0,scrollbars=1');
}

Then your link should look like this For Twitter:

 <a class="btn_twitter" onclick="openURLInPopup('http://twitter.com/home?status=http://www.domain.ro/url.html',600, 400); return false;" href="#" target="_blank">Twitter</a>

For facebook:

<a class="btn_fb" onclick="openURLInPopup('http://www.facebook.com/sharer.php?u=http://www.domain.ro/url.html',600, 400); return false;" href="#" target="_blank">Facebook</a>

For Google

<a class="btn_gplus" onclick="openURLInPopup('https://plus.google.com/share?url=http://www.domain.ro/url.html',600, 400); return false;" href="#">gplus</a>
Florin
  • 5,781
  • 2
  • 20
  • 30
  • 2
    Useless, the "popup" function is not included. –  Jun 05 '15 at 11:43
  • 5
    @Wesley not hard to guess what the "popup" function would look like. In fact he could have just done it inline with something like this `var newwindow=window.open(url, name || 'window' + Math.floor(Math.random() * 10000 + 1), 'width='+width+', height='+height); if (window.focus) {newwindow.focus();}` – David R. Sep 28 '15 at 04:42
6

If you want to add your own (possibly dynamic) text, you can add the quote parameter to the link:

https://www.facebook.com/share.php?u=example.com&quote=YOUR+TEXT+HERE

Josh
  • 8,329
  • 4
  • 36
  • 33
0

A dead simple link tag does the job as well as window.open(...).

<a href="https://www.facebook.com/sharer/sharer.php?u=http://stackoverflow.com">Click to share</a>

Try clicking this: https://www.facebook.com/sharer/sharer.php?u=http://stackoverflow.com

Félix Paradis
  • 5,165
  • 6
  • 40
  • 49