Create a custom Facebook Share link - facebook

Question

So this question has been asked before, but no one wants to do it in the manner that I want to, so bear with me while I try and explain. The FB.ui API has some functions that I find useful, mainly that I can dynamically change the description. So, I want to put the FB.ui into a link that a user can click and then a pop up will appear where they can share my webpage. So far what I have is:
<div id="fb-root"></div>
<script>
function shareFB(){
window.fbAsyncInit = function() {
FB.init({
appId : '42352352356463',
status : true,
xfbml : true
});
FB.ui(
{
method: 'feed',
name: 'name',
caption: 'caption',
description: (
a
),
link: 'http://www.image.com/',
picture: 'http://www.image.com/static/3.png'
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
};
(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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
}
</script>
and then I have a link to this here:
<a class="links" onclick='shareFB()' href="#"> Share! </a>
But this doesn't work. Why not!

Answer 1

You are loading the facebook SDK when you click the button and that's the wrong way to load it, change your script to this:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '42352352356463', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/pt_PT/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
function shareFB(){
var obj = {
method: 'feed',
name: 'name',
caption: 'caption',
description: 'description',
link: 'http://www.image.com/',
picture: 'http://www.image.com/static/3.png'
};
function share(response){
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
FB.ui(obj, share);
};
</script>