jQuery Plugin To Display Your Tweets On The Web Page - TweeCool

File Size: 5.94 KB
Views Total: 16503
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Display Your Tweets On The Web Page - TweeCool

TweeCool is a lightweight jQuery based Twitter feed widget used to fetch and display the recent tweets on your website from any user without using Twitter Authentication Oauth. Fully customizable via CSS and Javascript.

See also:

How to use it:

1. Include jQuery javascript library and the jQuery tweecool plugin on your website.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="tweecool.js"></script>

2. Create an empty container to place the Twitter feed widget.

<div class="twitter-widget">
<div id="tweecool"></div>
</div>

3. Call the plugin on the container element you created. The plugin will generate an ul li based list for the Twitter feed widget so you can easily style it via CSS however you like.

<script>
$(document).ready(function() {
$('#tweecool').tweecool({
username : 'jqueryscript'
});
});
</script>

4. The sample CSS to style the widget.

.twitter-widget ul {
margin: 0;
padding: 0;
}
.twitter-widget li {
list-style: none;
clear: both;
}
.twitter-widget li img, .twitter-widget li .tweets_txt {
float: left;
margin-bottom: 10px;
}
.twitter-widget li img {
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.twitter-widget li .tweets_txt {
width: 350px;
margin-left: 10px;
}
.twitter-widget li .tweets_txt span {
font-style: italic;
color: #666;
display: block;
}

5. Available options.

$('#tweecool').tweecool({

  // Your twitter username
  username : 'jqueryscript',

  // Number of tweets to show
  limit : 5, 

  // Show profile image
  profile_image : true, 

  // Show tweet time
  show_time : true, 

  // Show media
  show_media : false,

  // Values: small, large, thumb, medium 
  show_media_size: 'thumb',

  // Action options
  show_actions: false,
  action_reply_icon: '&crarr;',
  action_retweet_icon: '&prop;',
  action_favorite_icon: '&#9733;',

  // Values: profile, tweet 
  profile_img_url: 'profile', 

  // This will show the original tweet in order to avoid any truncated text, 
  // and also the "RT @tweecool:" is removed which helps with 140 character limit
  show_retweeted_text: false 

});

Change logs:

2015-10-30

  • v1.8: added more actions.

2015-08-16

  • v1.7

2015-07-13

  • v1.6

2015-01-09

  • v1.5

2014-12-29

  • Media fixed

2014-10-04

  • added more settings.

This awesome jQuery plugin is developed by tweecool. For more Advanced Usages, please check the demo page or visit the official website.