Freelance Web Developer

Apr 19, 2010

Set "connect with twitter" anywhere

Twitter @Anywhere is an easy solution for bringing the Twitter communication platform to your site. In my previous post we learned how to set twitter hovercard with anywhere Today i am sharing the code for using @Anywhere to integrate "Connect to Twitter."


Some @Anywhere functionality doesn't require the user to authorize your site for access ( like viewing a given Twitter user's profile info in a Hovercard). Other functionality, like to follow a user on Twitter via the Follow Button and Tweet from your site require the user to login to Twitter and authorize your site for access.
NOTE - To Tweet via anywhere your application must has Read/Write permissions. unfortunately option to change permissions is not supported yet on Dont worry, go to to change permissions.


First of all go to to register your application and and get an APIKEY


 <div id="user"></div>
 <div id="login"></div>
 <div id="logout"></div>
 <div id="default-tweetbox"></div>
 <div id="follow-dharmmotyar"></div

These are the target Divs for @anywhere element.

We have to include this script like this -

 <script src=""></script> 


//This function Updates HTML elements 
function update(T){
if (T.isConnected()) {
      document.getElementById('user').innerHTML 'Logged in as : ''screen_name');
      document.getElementById('logout').innerHTML '<a href='#' onClick="twttr.anywhere.signOut();">Sign out of Twitter</a>'; 
      //Add tweet box 
twttr.anywhere(function(T) {
    // The follow button
    //connect button
                    authComplete: function(loggedInUser) {
                        // triggered when auth completed successfully

                    signOut: function() {
                          // triggered when user logs out
                          document.getElementById('logout').innerHTML '';
                          document.getElementById('default-tweetbox').innerHTML '';
                          document.getElementById('user').innerHTML ''; 


You can see this code in action here.

Labels: , ,

By :