1

i have a custom image for facebook, that when the user click, it will share something, however, developers.facebook provide element that will automatically generate share button with the below code

<div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button"></div>

I want to use my custom image to use the code generated to popup the share page, is there a way? 

%a.link.facebook{href: "some_url_here"}

I already search the net, still I'm stuck,

Thanks for your help , im still a beginner, :)

Pavan
  • 33,316
  • 7
  • 50
  • 76
Christian Angel Galamay
  • 109
  • 1
  • 6
  • possible duplicate of [Custom image for Facebook share button](http://stackoverflow.com/questions/28510338/custom-image-for-facebook-share-button) – Pavan Jul 13 '15 at 05:36
  • 1
    Make your own button, and then use `FB.ui` out of the JS SDK, or open your own popup with the URL version of the Share dialog. https://developers.facebook.com/docs/sharing/reference/share-dialog – CBroe Jul 13 '15 at 13:13
  • Thanks so much sir :) – Christian Angel Galamay Jul 14 '15 at 03:29

1 Answers1

2

Many suggestion are useful, thanks to all of them, but i find this method more simple, I want to share it to you guys.

Javascript (put it in header or footer)--

<script>
function fbShare(url, title, descr, image, winWidth, winHeight) {
    var winTop = (screen.height / 2) - (winHeight / 2);
    var winLeft = (screen.width / 2) - (winWidth / 2);
    window.open('http://www.facebook.com/sharer.php?s=100&p[title]=' + title + '&p[summary]=' + descr + '&p[url]=' + url + '&p[images][0]=' + image, 'sharer', 'top=' + winTop + ',left=' + winLeft + ',toolbar=0,status=0,width=' + winWidth + ',height=' + winHeight);
}
</script>

to your link or image

<a href="javascript:fbShare('http://jsfiddle.net/stichoza/EYxTJ/', 'Fb Share', 'Facebook share popup', 'http://goo.gl/dS52U', 520, 350)">Share</a>

http://jsfiddle.net/stichoza/eyxtj/

Christian Angel Galamay
  • 109
  • 1
  • 6