Facebook share link without JavaScript

Asked 2/2, 2012 at 21:51 Answered 10/6, 2019 at 10:57

Solved facebook facebook-like facebook-sharer

173

The following link is for sharing a page on Twitter:

Is there a similar option for Facebook that doesn't require JavaScript?

I know about http://facebook.com/sharer.php, but that requires a get parameter to be inserted manually (which I'm not going to do), or with JavaScript (which doesn't fit my situation).

Aureus answered 2/2, 2012 at 21:51 Comment(0)

247

You could use

<a href="https://www.facebook.com/sharer/sharer.php?u=#url" target="_blank">
    Share
</a>

Currently there is no sharing option without passing current url as a parameter. You can use an indirect way to achieve this.

Create a server side page for example: "/sharer.aspx"
Link this page whenever you want the share functionality.
In the "sharer.aspx" get the refering url, and redirect user to "https://www.facebook.com/sharer/sharer.php?u={referer}"

Example ASP .Net code:

public partial class Sharer : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        var referer = Request.UrlReferrer.ToString();

        if(string.IsNullOrEmpty(referer))
        {
            // some error logic
            return;
        }

        Response.Clear();
        Response.Redirect("https://www.facebook.com/sharer/sharer.php?u=" + HttpUtility.UrlEncode(referer));
        Response.End();
    }
}

Achromatous answered 31/1, 2013 at 3:54 Comment(6)

yes this is a nice option. But If I want this to open in a pop up like the js version , What should I do ? At this moment it is opening in a new tab ! Thanks ! – Risa 25/11, 2013 at 23:29

This is not what I was asking for. This requires you to know the URL of the page being shared, so you can replace "#url" in your href with the page's URL. Using the twitter.com/share link, however doesn't require you to insert the URL of the page your sharing. – Aureus 28/11, 2013 at 19:24

Do you know how to send an image? – Corroborate 20/8, 2015 at 11:35

@Corroborate (and the newer reader), see this answer. In short: og:image tag. – Bluebeard 6/7, 2016 at 7:24

Is there documentation for this particular method? – Zama 19/9, 2019 at 10:7

Here is a giant list of URL's to social networks for sharing, to help: properprogramming.com/blog/… – Li 31/5, 2023 at 7:46

153

Ps 2: As pointed out by Justin, check out Facebook's new Share Dialog. Will leave the answer as is for posterity. This answer is obsolete

Short answer, yes there's a similar option for Facebook, that doesn't require javascript (well, there's some minimal inline JS that is not compulsory, see note).

Ps: The onclick part only helps you customise the popup a little bit but is not required for the code to work ... it will work just fine without it.

Facebook

<a href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Facebook">
</a>

Twitter

<a href="https://twitter.com/share?url=URLENCODED_URL&via=TWITTER_HANDLE&text=TEXT"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Twitter">
</a>

Heyer answered 28/11, 2013 at 9:39 Comment(7)

@superluminary ... it has but doesn't require it. I had mentioned that you can remove it (the onclick part) ... and it will still work. But I can see how it all not 100% clear ... I'll edit it. – Alcaide 26/2, 2014 at 16:3

Nice example of graceful degradation! – Insufflate 4/3, 2014 at 14:36

+1. Should change http://www.facebook.com/sharer.php to http://www.facebook.com/sharer/sharer.php – Vlad 6/3, 2014 at 14:10

I would update this answer to point people to use the Share Dialog as directed by Facebook. – Microsurgery 9/9, 2014 at 2:45

What is TWITTER_HANDLE parameter? – Waterborne 4/1, 2016 at 22:37

@HamidFzM That's just a placeholder for your Twitter handle. Replace appropriately. Unless your Twitter handle is actually "TWITTER_HANDLE". – Alcaide 5/1, 2016 at 11:12

onclick opening a pop not a new window. is there any way i can redirect it to a new window? – Chipman 9/11, 2018 at 10:15

It is possible to include JavaScript in your code and still support non-JavaScript users.

If a user clicks any of the following links without JavaScript enabled, it will simply open a new tab:

<!-- Remember to change URL_HERE, TITLE_HERE and TWITTER_HANDLE_HERE -->
<a href="http://www.facebook.com/sharer/sharer.php?u=URL_HERE&t=TITLE_HERE" target="_blank" class="share-popup">Share on Facebook</a>
<a href="http://www.twitter.com/intent/tweet?url=URL_HERE&via=TWITTER_HANDLE_HERE&text=TITLE_HERE" target="_blank" class="share-popup">Share on Twitter</a>
<a href="http://plus.google.com/share?url=URL_HERE" target="_blank" class="share-popup">Share on Googleplus</a>

Because they contain the share-popup class, we can easily reference these in jQuery, and change the window size to suit the domain we are sharing from:

$(".share-popup").click(function(){
    var window_size = "width=585,height=511";
    var url = this.href;
    var domain = url.split("/")[2];
    switch(domain) {
        case "www.facebook.com":
            window_size = "width=585,height=368";
            break;
        case "www.twitter.com":
            window_size = "width=585,height=261";
            break;
        case "plus.google.com":
            window_size = "width=517,height=511";
            break;
    }
    window.open(url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,' + window_size);
    return false;
});

No more ugly inline JavaScript, or countless window sizing alterations. And it still supports non-JavaScript users.

Piranesi answered 12/2, 2014 at 13:31 Comment(2)

Nice solution! Also, I'm using some javascript to fill in the current page URL:

$(".share-popup").each(function(){ 		var href = $( this ).attr( "href" ); 		href = href.replace( "URL_HERE", document.URL ); 		$( this ).attr( "href", href ); 	});

– Tussore 2/2, 2015 at 13:7

@Tussore it's better to include the current URL server-side to support non-JavaScript users – Piranesi 30/3, 2015 at 17:29

Try these link types actually works for me.

https://www.facebook.com/sharer.php?u=YOUR_URL_HERE
https://twitter.com/intent/tweet?url=YOUR_URL_HERE
https://plus.google.com/share?url=YOUR_URL_HERE
https://www.linkedin.com/shareArticle?mini=true&url=YOUR_URL_HERE

Rhodie answered 8/6, 2018 at 19:3 Comment(0)

I know it's an old thread, but I had to do something like that for a project and I wanted to share the 2019 solution.

The new dialog API can get params and be used without any javascript.

The params are:

app_id (Required)
href The URL of the page you wish to share, in case none has passed will use the current URL.
hashtag have to have the # symbol for example #amsterdam
quote text to be shared with the link

You can create an href without any javascript what so ever.

<a href="https://www.facebook.com/dialog/feed?&app_id=APP_ID&link=URI&display=popup&quote=TEXT&hashtag=#HASHTAG" target="_blank">Share</a>

One thing to consider is that Facebook is using Open Graph so in case your OG tags are not set properly you might not get the results you wish for.

Vida answered 10/6, 2019 at 10:57 Comment(2)

Thanks for posting this answer. However, I get the error

Can't Load URL: The domain of this URL isn't included in the app's domains. To be able to load this URL, add all domains and subdomains of your app to the App Domains field in your app settings.

I am on localhost. Any ideas? I have tried to include several domains in both the Basic and Advanced settings on FB but no luck. – Poulson 17/3, 2020 at 20:30

Does not look like display=popup is working on desktop. – Advertisement 20/5, 2020 at 19:30

You can use the Feed URL "Direct URL" option, as described on the Feed Dialog page:

You can also bring up a Feed Dialog by explicitly directing the user to the /dialog/feed endpoint:

  https://www.facebook.com/dialog/feed?  
  app_id=123050457758183&
  link=https://developers.facebook.com/docs/reference/dialogs/&
  picture=http://fbrell.com/f8.jpg&
  name=Facebook%20Dialogs&
  caption=Reference%20Documentation&
  description=Using%20Dialogs%20to%20interact%20with%20users.&
  redirect_uri=http://www.example.com/response`

Looks like they no longer mention "sharing" anywhere in their docs; this has been replaced with the concept of adding to your Feed.

Desimone answered 9/10, 2012 at 13:6 Comment(1)

But it is not possible to access that dialog without registering an App ID? – Viveca 21/5, 2013 at 15:47

Lots of these answers no longer apply, so here's mine:

Use the Share Dialog described at the Facebook Dev Page.

Example:

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

But you have to put in your registered app_id, the href, and a redirect uri.

Microsurgery answered 9/9, 2014 at 2:11 Comment(1)

So this is only useful if you're a registered in the Facebook dev program? – Unipersonal 6/11, 2022 at 14:12

http://facebook.com/sharer.php is deprecated

You have a few options (use the iframe version):

http://developers.facebook.com/docs/reference/plugins/like/

http://developers.facebook.com/docs/reference/plugins/send/

https://developers.facebook.com/docs/reference/plugins/like-box/

Ankeny answered 2/2, 2012 at 22:1 Comment(7)

This is not really what I'm looking for. I just want to use an anchor element. – Aureus 3/2, 2012 at 0:38

Sorry, then you're out of luck. It's either Javascript or iFramed. – Ankeny 3/2, 2012 at 3:17

So are you saying you are unable to implement the iFramed? What does your code look like? Can you post a link to a sample of the iframed version that is not working for you? – Ankeny 18/4, 2012 at 16:19

I'm saying that if the user has JavaScript disabled, then they won't be able to share the page on Facebook. I was just wondering if there was a similar link like twitter.com/share but for facebook. – Aureus 19/4, 2012 at 6:56

How do you know sharer.php is deprecated? – Phyletic 12/1, 2016 at 16:13

@Phyletic Please see developers.facebook.com/bugs/252983554810810 and read the comment from Noorin. {quote}Noorin Ladhani · · Facebook Team Hi Ronald - The Share button has been deprecated in favor of the Like button. {quote} – Ankeny 19/4, 2016 at 20:31

today it shows: There is something wrong with the configurator – Quite 14/11, 2020 at 21:53

For those that wish to use javascript but do not want to use the Facebook javascript library:

<a id="shareFB" href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"   target="_blank" title="Share on Facebook">Share on Facebook</a>
<script type="text/javascript">document.getElementById("shareFB").setAttribute("href", "https://www.facebook.com/sharer/sharer.php?u=" + document.URL);</script>

Works even if javascript is disabled, but gives you a popup window with share preview if javascript is enabled.

Saves one needles click while not using any Facebook js spyware :)

Dropout answered 14/5, 2014 at 17:33 Comment(1)

Is there any way to open it in new tab. Right now its pening a popup – Chipman 9/11, 2018 at 10:21

Adding to @rybo111's solution, here's what a LinkedIn share would be:

<a href="http://www.linkedin.com/shareArticle?mini=true&url={articleUrl}&title={articleTitle}&summary={articleSummary}&source={articleSource}" target="_blank" class="share-popup">Share on LinkedIn</a>

and add this to your Javascript:

case "www.linkedin.com":
    window_size = "width=570,height=494";
    break;

As per the LinkedIn documentation: https://developer.linkedin.com/docs/share-on-linkedin (See "Customized Url" section)

For anyone who's interested, I used this in a Rails app with a LinkedIn logo, so here's my code if it might help:

<%= link_to image_tag('linkedin.png', size: "50x50"), "http://www.linkedin.com/shareArticle?mini=true&url=#{job_url(@job)}&title=#{full_title(@job.title).html_safe}&summary=#{strip_tags(@job.description)}&source=SOURCE_URL", class: "share-popup" %>

Hemihydrate answered 4/9, 2014 at 20:33 Comment(0)

How to share content: https://developers.facebook.com/docs/share/

You have to choose use the deprecated function without JS, and check every day, or follow the way use JS and have fun.

Bristow answered 3/2, 2012 at 0:50 Comment(0)

Hot tags

Godot Unity Godot Help Programming Godot 4.X GUI GDScript 3D 2D Physics CSharp Godot 3.X VR XR Projects C++

Recommended topics

Hot tags