Mateu Mateu - 5 months ago 13
Javascript Question

Custom design for Twitter button with events

I've got a custom tweet button:

<a href="http://twitter.com/share?url=http://example.com;text=myText;size=l&amp;count=none" target="_blank">
<div>
<img src="/assets/twitter-logo.jpg">
<span>Twitter</span>
</div>
</a>


Now I want to achieve some result after the tweet has been published. To do so, I've looked at the Twitter Events API:

<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script type="text/javascript">
twttr.events.bind('tweet', function (event) {
alert("Tweet Successful");
});
</script>


However, this API only works on non-custom buttons (
twitter-share-button
class).

Anyone has managed to create a custom button which listens to events?

Answer

You can have a custom link and still have the web intents!

The key is, instead of your link pointing to "https://twitter.com/share" it should point to "https://twitter.com/intent/tweet"

like this:

<a href="https://twitter.com/intent/tweet">Tweet</a>

This way you can use the web intents like you were trying:

twttr.events.bind('tweet', function (event) {
  // Do something there
  alert('Tweeted');
});

Check this jsFiddle

Comments