SKIP navigation
Buildit Template Widgets
BuilditInformation Services

This page's main content:

buildit documentation

widget: 'Mavtweets'

looks like this:

MavTweet

UNO

Why use it?

If you're not familiar with Twitter, it's a free social networking/micro-blogging service that lets users send and read small (140 character or less) 'tweets' (messages). Those messages can be sent via the Twitter website, your phone, or other methods and received by others via the Twitter website, SMS, RSS, email, or in our case — on your own web page. It is a quick and easy way to get your message out onto a variety of channels. The Mavtweets widget above is displaying tweets from University Relations (you can have your own custom avatar). Maybe MavTweets could work for you!

How to use it

This widget uses the jQuery javascript library. That library is loaded into your page automatically. Follow these steps to use the widget:

  1. You'll definitely need an account on Twitter — so get that all set up first. http://twitter.com/
  2. Call the tweet script in your page <head>.
  3. Ready the tweet function in your page <head>. You'll have to edit the first bolded portion (yourusername) of the 'ready the tweet function' code below. You can also edit the bolded count (5) to have the widget display as many tweets as you desire (up to 100). You should leave the rest of the code as it is.
  4. Put the widget code in your page <body>. You'll need to make a few changes here as well. In the 'put the widget code in your page' code below, you'll need to edit the 3 bolded items. The first one is the URL for your account's RSS feed (find it by clicking the RSS button near the bottom of your account's Twitter home page). Click it, copy the URL (something like - http://twitter.com/statuses/friends_timeline/12345678.rss) and paste it into your widget . Next, we need the URL for your Twitter account — that'll be 'http://twitter.com/yourusername/'. Almost there now, just need to edit the 'Yoursite' text so folks will know whose Mavtweet they're looking at. That's it — enjoy!
1. call the tweet script in your page <head>

<script type="text/javascript" src="http://www.unomaha.edu/js/08/jquery.tweet.js"></script>
2. ready the tweet function in your page <head>

<script type='text/javascript'>
  jQuery(document).ready(function($) {
    $(".tweet").tweet({
      username: "yourusername", // supply username - leave comma and quotes
      join_text: "auto",
      avatar_size: 32,
      count: 5, // how many tweets to display - leave comma
      auto_join_text_default: ":",
      auto_join_text_ed: ":",
      auto_join_text_ing: ":",
      auto_join_text_reply: ":",
      auto_join_text_url: ":",
      loading_text: "  loading tweets..."
    });
  })
</script>
3. put the widget code in your page <body>

<div id="list_tweet">
    <div id="lselect_tweet">
    <span class="btns-r"><a href="http://twitter.com/statuses/user_timeline/16809032.rss" class="btn-rss-noshad"><span class="hide">RSS Feed</span></a><a href="http://twitter.com/unomaha/" class="btn-all-list"><span class="hide">Twitter Archive</span></a></span>
      <h3>MavTweet</h3>
      <h4>UNO | Yoursite</h4>
      <div class='tweet'></div>
    </div>
</div>

note:

Don't make changes that compromise the designed function or appearance of the widgets. They should look, and behave, the same way no matter where they appear. Changes to font sizes, link colors, and/or other elements cause uncertainty for users, and compromise the visual and functional design that is part of the UNO brand. So please, use the widgets only as they are designed, and only for their intended uses. These widgets are only for use in the right-hand column (04 Main Content Right Column) of the WTA_01 template.

Content last modified: December 22, 2010, 8:24am