Oho, did I actually write the right title of this post? Bit.ly is not for tweeting, it’s for shortening the long URLs right, but hey, why bit.ly is so popular now? Most common answer could be twitter. I don’t know if people would used this service that much if there wasn’t twitter. Anyways, this is very important to shortening something in your tweet as twitter has character limits. So let’s see how we can actually tweet something from a website using this REST based Api method calls.
Note one thing that if your site is using wordpress or any kind of CMS that allows to use plug-ins then you don’t have to worry about it. This is something you can use only for updating some content to twitter from your site. Hope I made it clear at first….
After digging bitly apis, I think its pretty easy to do it as bitly provides Javascript client library so there shouldn’t be any varier about back-end language. So let’s see how easily we can tweet some content from our site.
First of all, if you redirect anything with the following URL, twitter will get your message in the text box and all you have to do is, just press the update button.
http://twitter.com/home?status=your_message_comes_here
So our message has to be customized and you cannot allow anybody to send message more than 140 chars right. This is why we will use bitly api to customized it.
First of all, we have to add the API library with the following format.
<script type="text/javascript" charset="utf-8" src="http://bit.ly/javascript-api.js?version=latest&login=junal&apiKey=R_888fefa724b856672a3276a3905d8e30"></script>
you need to login to get user name and password from bitly, though you can use demo user name and apikey from here but later you have to use your own authentication information.
Anyways, we are done connecting with bitly by including their JS client library. Now let’s create some functions of our own to call them. Open a JS file and paste the following there, you can find this example codes in the bitly documentation.
var TweetAndTrack = {}; TweetAndTrack.open = function(targ, url) { var callback_name = url.replace(/\W/g, ''); BitlyClient.call('shorten', { 'longUrl': url, 'history': '1' }, 'BitlyCB.' + callback_name); return false; }; TweetAndTrack.popResult = function(data) { // Results are keyed by longUrl, so we need to grab the first one. for (var r in data.results) { return data.results[r]; } };
now it’s time to create our own function to call. Here is the example one…
function tweetMe(msg, url) { var textMessage = msg.replace(new RegExp("^(.{0," + 80 + "}\\b).*"), "$1"); var callback_name = url.replace(/\W/g, ''); BitlyCB[callback_name] = function(data) { var result = TweetAndTrack.popResult(data); var tweet_url = "http://twitter.com/home?status=" + encodeURIComponent(textMessage+ "... " + result.shortUrl ); window.open(tweet_url); }; BitlyClient.call('shorten', { 'longUrl': url, 'history': '1' }, 'BitlyCB.' + callback_name); return false; }
I have used regular expression here to truncate the message. I kept the length of the message 80! why? Because, your URL will take some chars as well and you should also keep some space for people who will retweet your tweet
Now, we have to call this javascript function called “tweetMe()” and it has 2 params right. We have to pass the message and the url along with the message and bit.ly api will make sure that whatever we are sending, it will be customized before sending. So how can we call this function?
<a href=”#” onclick=”return tweetMe(‘Content or message of your tweet‘, ‘URL of your along with your message‘);”>tweet this </a>
Ok, now just click on “tweet this” and then you it will take you to the twitter heaven. Be happy there, and ask me any questions if you can’t reach there





I really didn't understand why the fuck I need to do that much for truncating some text to 140 characters! – You guys are developers, right? Not some fucking Idiots! Go and STudy Javascript before writing your next line of code!
Oh Gross!!
See http://www.w3schools.com/jsref/jsref_substr.asp to learn truncating you pathetic moron!
Cool script!
I've got a couple of bookmarkingbuttons on a website like delicious, googlebookmarks and this one.
It works perfectly in most browsers. But I found out that it doesnt work with safari when de block popup window is activated?
Cool script!
I've got a couple of bookmarkingbuttons on a website like delicious, googlebookmarks and this one.
It works perfectly in most browsers. But I found out that it doesnt work with safari when de block popup window is activated?
Boss ..Thanks for the share…but my question is how can we give function second parameter as dynamically . onclick =return xyz( 'message','URL');
You can see a live app running using this method here http://amrapositive.appspot.com/ and both params are getting dynamically set. Why can't you set them dynamically if you are setting all these urls or messages from database? Please clear the question if you are still confused.
var Unique = document.getElementById(“hdnUniqueurl”).value;
<a href=”#” onclick=”return tweetMe('Share An Amazing Deal From kijubi',Unique);”>tweet this
I am just passing the URL like this but : it is saying that : TweetAndTrack undefined ..any help please??
Thanks
Raghu
Very helpful! Thank you very much!
Well , the view of the passage is totally correct ,your details is really reasonable and you guy give us valuable informative post, I totally agree the standpoint of upstairs. I often surfing on this forum when I m free and I find there are so much good information we can learn in this forum!
http://www.sin-game.com
For some reason this works in Firefox but not in Safari or Chrome. Any insight???
For some reason this works with Firefox but not Safari or Chrome. Any ideas???