Creating a Facebook share button with customized url, title and image

11
votes

Facebook used to allow custom parameters in the Facebook share button, but it is not working now. What I need is to create a Facebook share button which will have a custom title, url, image, description, etc. It cannot be done using meta tags because there are multiple share buttons on a single page. Each should have a different title, urls, images etc. I heard it can be done using the Facebook app - using app id or something.

I tried this but it's not working:

<a title="send to Facebook" 
  href="http://www.facebook.com/sharer.php?s=100&p[title]=YOUR_TITLE&p[summary]=YOUR_SUMMARY&p[url]=YOUR_URL&p[images][0]=YOUR_IMAGE_TO_SHARE_OBJECT"
  target="_blank">
4
facebookfacebook-graph-apishare-button
<a href="facebook.com/sharer.php?u=<?php echo $pageUrl; ?>" title="Facebook share" ><img style="margin-right: 10px;" src="_images/facebook_share.png" alt="facebook share button"/></a> – Gijo Varghese
“It cannot be done using meta tags, because there are a number of share buttons in a single page” – so all of them are sharing the same URL? One URL == one Open Graph object. If you want to use different Open Graph objects, use different URLs. If this is not an option (although sharing the same object with multiple images/descriptions does not make much sense – when those posts are re-shared on FB directly, FB will pull the info from the URL anyways), the Feed dialog still allows you to set those parameters at runtime. – CBroe
urls are different. Or is it possible in PHP to goto another page if the visitor is from facebook @CBroe – Gijo Varghese
So if the URLs are different, then why can’t you just provide the individual meta data under each of them? / Facebook appends a certain amount of tracking parameters to links from their news feed, so you could look for these and then redirect if necessary. – CBroe
ooops sorry the urls are the same. I mean the title, description and image will be different. @CBroe – Gijo Varghese

4 Answers

6
votes

Unfortunately, it appears that we can't post shares for individual topics or articles within a page. It appears Facebook just wants us to share entire pages (based on url only).

There's also their new share dialog, but even though they claim it can do all of what the old sharer.php could do, that doesn't appear to be true.

And here's Facebooks 'best practices' for sharing.

4
votes

This is the code as 2017:

<i class="fa fa-facebook-square"></i>
<a href="#" onclick="window.open('https://www.facebook.com/sharer/sharer.php?u='+encodeURIComponent(location.href),'facebook-share-dialog','width=626,height=436');return false;">Share on Facebook</a>

Facebook now takes all data from OG metatags.

NOTE: This code assumes you have OG metatags on in site's code.

Source

2
votes

Crude, but it works on our system: 

<div class="block-share spread-share p-t-md">
  <a href="http://www.facebook.com/share.php?u=http://www.voteleavetakecontrol.org/our_affiliates&title=Farmers+for+Britain+have+made+the+sensible+decision+to+Vote+Leave.+Be+part+of+a+better+future+for+us+all.+Please+share!" 
     target="_blank">
    <button class="btn btn-social btn-facebook">
      <span class="icon icon-facebook">
      </span> 
      Share on Facebook
    </button>
  </a>

  <a href="https://www.facebook.com/FarmersForBritain" target="_blank">
    <button class="btn btn-social btn-facebook">
      <span class="icon icon-facebook">
      </span>
      Like  on Facebook
    </button>
  </a>
</div>