Facebook share link without JavaScript

Question

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).

Medeni Baykal · Accepted Answer · 2021-09-21T19:21:08.613

243

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();
    }
}

edited Sep 21 '21 at 19:21

answered Jan 31 '13 at 03:54

Medeni Baykal

4,223
1
28
36

1

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 ! – Sagiruddin Mondal Nov 25 '13 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 http://twitter.com/share link, however doesn't require you to insert the URL of the page your sharing. – Web_Designer Nov 28 '13 at 19:24
1

Do you know how to send an image? – miguelmpn Aug 20 '15 at 11:35
@miguelmpn (and the newer reader), see this [answer](http://stackoverflow.com/a/4758285/863110). In short: [`og:image`](http://developers.facebook.com/docs/share) tag. – Mosh Feu Jul 06 '16 at 07:24
Is there documentation for this particular method? – Navid Khan Sep 19 '19 at 10:07
Here is a giant list of URL's to social networks for sharing, to help: https://properprogramming.com/blog/45-custom-social-network-urls-for-sharing-content/ – Michael Parisi May 31 '23 at 07:46

score 152 · Answer 2 · edited Jun 25 '19 at 08:27

152

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>

edited Jun 25 '19 at 08:27

Ahmad Awais

33,440
5
74
56

answered Nov 28 '13 at 09:39

King'ori Maina

4,440
3
26
38

@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. – King'ori Maina Feb 26 '14 at 16:03
3

Nice example of graceful degradation! – Arnold Daniels Mar 04 '14 at 14:36
7

+1. Should change `http://www.facebook.com/sharer.php` to `http://www.facebook.com/sharer/sharer.php` – Nir Levy Mar 06 '14 at 14:10
1

I would update this answer to point people to use the [Share Dialog](https://developers.facebook.com/docs/sharing/reference/share-dialog) as directed by Facebook. – Justin Skiles Sep 09 '14 at 02:45
1

What is `TWITTER_HANDLE` parameter? – hamidfzm Jan 04 '16 at 22:37
@HamidFzM That's just a placeholder for your Twitter handle. Replace appropriately. Unless your Twitter handle is actually "TWITTER_HANDLE". – King'ori Maina Jan 05 '16 at 11:12
onclick opening a pop not a new window. is there any way i can redirect it to a new window? – Alauddin Ahmed Nov 09 '18 at 10:15

rybo111 · Answer 3 · 2016-03-04T10:29:38.850

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.

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 ); });` — GavinoGrifoni, Feb 02 '15 at 13:07
@GavinoGrifoni it's better to include the current URL server-side to support non-JavaScript users — rybo111, Mar 30 '15 at 17:29

score 34 · Answer 4 · answered Jun 08 '18 at 19:03

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

score 11 · Answer 5 · answered Jun 10 '19 at 10:57

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.

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. — padawanTony, Mar 17 '20 at 20:30

score 7 · Answer 6 · answered Oct 09 '12 at 13:06

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.

But it is not possible to access that dialog without registering an App ID? — Eli, May 21 '13 at 15:47

score 7 · Answer 7 · answered Sep 09 '14 at 02:11

7

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.

answered Sep 09 '14 at 02:11

Justin Skiles

9,373
6
50
61

So this is only useful if you're a registered in the Facebook dev program? – Kalnode Nov 06 '22 at 14:12

score 3 · Answer 8 · answered Feb 02 '12 at 22:01

3

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/

answered Feb 02 '12 at 22:01

DMCS

31,720
14
71
104

This is not really what I'm looking for. I just want to use an anchor element. – Web_Designer Feb 03 '12 at 00:38
Sorry, then you're out of luck. It's either Javascript or iFramed. – DMCS Feb 03 '12 at 03: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? – DMCS Apr 18 '12 at 16:19
3

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 http://twitter.com/share but for facebook. – Web_Designer Apr 19 '12 at 06:56
How do you know `sharer.php` is deprecated? – Flimm Jan 12 '16 at 16:13
1

@Flimm Please see https://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} – DMCS Apr 19 '16 at 20:31
today it shows: There is something wrong with the configurator – mLstudent33 Nov 14 '20 at 21:53

score 2 · Answer 9 · answered May 14 '14 at 17:33

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 :)

Is there any way to open it in new tab. Right now its pening a popup — Alauddin Ahmed, Nov 09 '18 at 10:21

score 2 · Answer 10 · edited Apr 29 '18 at 21:58

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" %>

score 1 · Answer 11 · answered Feb 03 '12 at 00:50

1

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.

answered Feb 03 '12 at 00:50

Sándor Tóth

743
4
10

Facebook share link without JavaScript

11 Answers11

Linked

Related