Followers

Thursday 19 December 2013

A jQuery Twitter Ticker (Updated)

Follow my blog with Bloglovin

A jQuery Twitter Ticker (Updated)

1. Get JQuery. In these examples, we use Google's AJAX Libraries API.

2. include jQuery and jquery.tweet.js files in your template's <head>.

<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script language="javascript" src="/tweet/jquery.tweet.js" type="text/javascript"></script>
3. Also in <head>, Initialize tweet! on page load with your Username and other options

<script type='text/javascript'>
    jQuery(function($){
        $(".tweet").tweet({
            username: "seaofclouds",
            join_text: "auto",
            avatar_size: 32,
            count: 3,
            auto_join_text_default: "we said,", 
            auto_join_text_ed: "we",
            auto_join_text_ing: "we were",
            auto_join_text_reply: "we replied to",
            auto_join_text_url: "we were checking out",
            loading_text: "loading tweets..."
        });
    });
</script>
4. In <body>, include a placeholder for your tweets. They'll get loaded in via JSON. How fancy!

<div class="tweet"></div>
5. Style with our stylesheet in <head>, or modify as you like!

<link href="jquery.tweet.css" media="all" rel="stylesheet" type="text/css"/>
Contribute
Bring your code slinging skills to Github and help us develop new features for tweet!

git clone git://github.com/seaofclouds/tweet.git
Fork me on GitHub
Report bugs and request features in Github Issues

Licensed under the MIT
www.opensource.org/licenses/mit-license.php

No comments:

Post a Comment