Skip to content

Instantly share code, notes, and snippets.

@tuyenv

tuyenv/custom-social-share.html

Forked from mrtonyhuynh/custom-social-share.html
Created August 15, 2019 05:21
Show Gist options
  • Save tuyenv/0b2db441030eb699977acb0445b275e5 to your computer and use it in GitHub Desktop.
Save tuyenv/0b2db441030eb699977acb0445b275e5 to your computer and use it in GitHub Desktop.
Download ZIP
Custom Social Share Button with Callback
Raw
custom-social-share.html
<html>
<head>
<title>Social Share</title>
</head>
<body>
<h2>Custom Social Share Button with Callback</h2>
<button id="share-facebook">Share on Facebook</button>
<button id="share-twitter">Share on Twitter</button>
<div id="fb-root"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script>
(function(doc, script) {
var js,
fjs = doc.getElementsByTagName(script)[0],
frag = doc.createDocumentFragment(),
add = function(url, id) {
if (doc.getElementById(id)) {return;}
js = doc.createElement(script);
js.src = url;
id && (js.id = id);
frag.appendChild(js);
};
add('https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3&appId=', 'facebook-jssdk');
add('https://platform.twitter.com/widgets.js');
fjs.parentNode.insertBefore(frag, fjs);
}(document, 'script'));
</script>
<script>
var app = app || {};
app.facebook = {
share : function() {
alert('clicked');
FB.ui({
method: 'share',
href: 'https://developers.facebook.com/docs/dialogs/',
}, function(response) {
console.log(response);
if (response && response.post_id) {
alert('published');
} else {
alert('not published');
}
});
},
feed : function() {
alert('clicked');
FB.ui({
method: 'feed',
name: '',
link: '',
picture: '',
caption: '',
description: ''
}, function(response) {
console.log(response);
if (response && response.post_id) {
alert('published');
} else {
alert('not published');
}
});
},
};
app.twitter = {
share : function() {
alert('clicked');
twttr.ready(function (twttr) {
twttr.events.bind('tweet', function (event) {
console.log(event);
alert('published');
});
});
var popup = window.open('https://twitter.com/intent/tweet?text=', 'popupwindow', 'scrollbars=yes,width=800,height=400');
popup.focus();
}
};
</script>
<script>
$(document).ready(function() {
$('#share-facebook').on('click', function() {
app.facebook.share();
});
$('#share-twitter').on('click', function() {
app.twitter.share();
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment