Facebook Share Link

Let’s say you have an awesome social network, a dating platform for cars, and you want to share your cars profile on Facebook. It should look like this. How do you do that?

First of all you should load Facebooks JavaScript SDK. Insert this code below the “body” tag in your page.

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=99999999999999&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>

Replace 99999999999999 with your Facebook App ID. Next you need a JS function to trigger the share dialog. That can look like this:

function share_my_car(kfz, kfz_id, image_url){
  url_to_share = "http://contactmycar.de/cars/" + kfz_id;
  FB.ui({ method: 'feed',
          name: kfz,
          caption: 'Mein Fahrzeug auf ContactMyCar',
          picture: image_url,
          link: url_to_share }, function(response) {});
}

And finally you need a link/button to trigger the JS function. I used a link.

<a onclick="share_my_car('<%= car.kfz %>', '<%= car.id %>', '<%= car.image_url %>'); return false;" href="">
 Fahrzeug auf Facebook teilen
 </a>

That’s it.