Jika tertarik berikut cara Memasang update Twitter pada blog
Loging >> rancangan >> elemen halaman >> tambah gadget >> HTML/Javascript..
<style>#twitter-ticker{width:200px;height:300px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF2BmAqRnLw0IYX7W32JbT_NbttVaIoUz3HyZUSuHG9OjpencUjMDLIEQFeEEBSqyCqbNYWOazcNIXwsWM2jL_ZeIpoMMsa4LkUQdE9WS-pPszpDTV7jF_mcnYmuq69dt3Q79RbS7U-IQ/s1600/slickbg.png) no-repeat #f5f5f5;color:#666666;display:none;-moz-border-radius:10px 10px 6px 6px;-khtml-border-radius: 6px;-webkit-border-radius: 6px;border-radius:6px;text-align:left;}
#tweet-container{height:230px;width:auto;overflow:hidden;}
#twitIcon{position:absolute;top:-25px;left:-10px;width:64px;height:64px;}
#top-bar{height:45px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzZ0p_Ljhag3VbTnqceo7m6OHePIOh5qUQI9aSSN7by5NUtq1i1okVsSnkCes3qCl_YSI-PU0x7cCXOv_KmFOfs_d8GBb9z5zpmNl_7HXMFxlnUNz-WREKm06wBSFKv8fqajT5-qS61H0/s1600/top_bar.png) repeat-x;border-bottom:1px solid white;position:relative;margin-bottom:8px;-moz-border-radius:6px 6px 0 0;}
.tweet{padding:5px;margin:0 8px 8px;border:1px solid #F0F0F0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwdXTj_Ik2nxf1BHsZznIz1-B0sKzi-xnQpvDSpRffBjz2BEVpkAYrhkU4nSWOsvmgLwC0gWOg0EyfPF21pa0xQKsPRp0SKovMx4U0JH7J6X6Xg9BAU5NMbtIgc_glEHoXpfGhobw5vnE/s1600/transparent.png);width:auto;overflow:hidden;}
.tweet .avatar,.tweet .user,.tweet .time{float:left;}
.tweet .time{text-transform:uppercase;font-size:10px;color:#AAAAAA;white-space:nowrap;}
.tweet .avatar img{width:36px;height:36px;border:2px solid #eeeeee;margin:0 5px 5px 0;}
.tweet .txt{clear:both;}
.tweet .user{font-weight:bold;}
#loading{margin:100px 95px;}
#twitter-ticker{margin:40px auto 20px;}
.jScrollPaneContainer {position: relative;overflow: hidden;z-index: 1;}
.jScrollPaneTrack {position: absolute;cursor: pointer;right:4px;top:0;height: 100%;background: #ddd;}.jScrollPaneDrag {position: absolute;background: #999;cursor: pointer;overflow: hidden;}.jScrollPaneDragTop {position: absolute;top: 0;left: 0;overflow: hidden;}.jScrollPaneDragBottom {position: absolute;bottom: 0;left: 0;overflow: hidden;}a.jScrollArrowUp {display: block;position: absolute;z-index: 1;top: 0;right: 0;text-indent: -2000px;overflow: hidden;/*background-color: #666;*/height: 9px;}a.jScrollArrowUp:hover {/*background-color: #f60;*/}
a.jScrollArrowDown {display: block;position: absolute;z-index: 1;bottom: 0;right: 0;text-indent: -2000px;overflow: hidden;/*background-color: #666;*/height: 9px;}a.jScrollArrowDown:hover {/*background-color: #f60;*/}a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {/*background-color: #f00;*/}
h4.tut{color:#fff;font-family:"Myriad Pro",Arial,Helvetica,sans-serif;font-size:16px;padding:12px 0 0 58px;text-transform:uppercase;
text-shadow:2px 1px 6px #333;}
</style><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" src="https://sites.google.com/site/jquery01/jquery.mousewheel.js"></script><script type="text/javascript" src="https://sites.google.com/site/jquery01/jScrollPane-1.2.3.min.js"></script><script type="text/javascript">var tweetUsers = ['ID_TWITTER_ANDA','ID_TWITTER1','ID_TWITTER2','ID_TWITTER3'];var buildString = "";
$(document).ready(function(){
$('#twitter-ticker').slideDown('slow');
for(var i=0;i<tweetUsers.length;i++){if(i!=0) buildString+='+OR+';buildString+='from:'+tweetUsers[i];}
var fileref = document.createElement('script');
fileref.setAttribute("type","text/javascript");fileref.setAttribute("src", "http://search.twitter.com/search.json?q="+buildString+"&callback=TweetTick&rpp=50");
document.getElementsByTagName("head")[0].appendChild(fileref);
});
function TweetTick(ob){var container=$('#tweet-container');container.html('');
$(ob.results).each(function(el){
var str = ' <div class="tweet"><div
class="avatar"><a href="http://twitter.com/'+this.from_user+'"
target="_blank"><img src="'+this.profile_image_url+'"
alt="'+this.from_user+'" /></a></div><div
class="user"><a href="http://twitter.com/'+this.from_user+'"
target="_blank">'+this.from_user+'</a></div><div class="time">'+relativeTime(this.created_at)+'</div><div class="txt">'+formatTwitString(this.text)+'</div></div>';
container.append(str);
});
container.jScrollPane();}
function formatTwitString(str){str=' '+str;str = str.replace(/((ftp|https?)://([-w.]+)+(:d+)?(/([w/_.]*(?S+)?)?)?)/gm,'<a href="$1" target="_blank">$1</a>');str = str.replace(/([^w])@([w-]+)/gm,'$1@<a href="http://twitter.com/$2" target="_blank">$2</a>');str = str.replace(/([^w])#([w-]+)/gm,'$1<a href="http://twitter.com/search?q=%23$2" target="_blank">#$2</a>');return str;}
function relativeTime(pastTime){ var origStamp = Date.parse(pastTime);var curDate = new Date();var currentStamp = curDate.getTime();
var difference = parseInt((currentStamp - origStamp)/1000);
if(difference < 0) return false;
if(difference <= 5) return "Just now";if(difference <= 20) return "Seconds ago";if(difference <= 60) return "A minute ago";if(difference < 3600) return parseInt(difference/60)+" minutes ago";if(difference <= 1.5*3600) return "One hour ago";if(difference < 23.5*3600) return Math.round(difference/3600)+" hours ago";if(difference < 1.5*24*3600) return "One day ago";
var dateArr = pastTime.split(' ');return dateArr[4].replace(/:d+$/,'')+' '+dateArr[2]+' '+dateArr[1]+(dateArr[3]!=curDate.getFullYear()?' '+dateArr[3]:'');}</script>
<!--[if lt IE 7]><style type="text/css">div.tweet {background:none;border:none;}
div#twitIcon{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlCumXhyphenhyphen0xcKOIHClhe5TcB2zXk0oaY3NiF0SxtYpeHywL0TA_v6GUAs1K8w9ruQQVj1jPGTTSUI5fjXGqKsqujfne56GOmBEywEplV0eRnOEcD9SjuQtVrQ51wylgSNx-dni-N6ZJNQo/s1600/twitter_64.png,
sizingMethod=crop);}
div#twitIcon img{display:none;}</style><![endif]-->
<div id="twitter-ticker"><div id="top-bar">
<div
id="twitIcon"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlCumXhyphenhyphen0xcKOIHClhe5TcB2zXk0oaY3NiF0SxtYpeHywL0TA_v6GUAs1K8w9ruQQVj1jPGTTSUI5fjXGqKsqujfne56GOmBEywEplV0eRnOEcD9SjuQtVrQ51wylgSNx-dni-N6ZJNQo/s1600/twitter_64.png"
width="64" height="64" alt="Twitter icon" /></div><h4 class="tut">TWITTER SAYA</h4>
</div>
<div
id="tweet-container"><img id="loading"
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibfmwyu5intuIDFUGHplNXIATKiHYJP26HD5R4hFD_qVEy9A82XrMOu43JGtgc9lM-Zgi5ya52W9iB5DyfAUw0sU7ybc_FJJDsK7KH8-m5eEXE3Wl9aEzWaHATc8S-9FrJ53E5MsSRmpU/s1600/loading.gif"
width="16" height="11" alt="Loading.." /></div>p/s:
1. Ganti kode yang di bold dengan akun twitter. Atau akun teman anda
Contoh:
Akun Twitter: http://twitter.com/Akun twitter Anda
var tweetUsers = ['Akun twitt Anda','ID_TWITTER1','ID_TWITTER2','ID_TWITTER3'];
contoh: var tweetUsers = ['Akun twitt Anda','','',''];
2. Pada TWITTER ANDA Ubah dan sesuaikan..?
SImpan
Tidak ada komentar:
Posting Komentar