Widget Artikel Populer ala Cipstuff

/* awal css*/

.artikelpopuler li
{
padding: 0 0 4px 17px;
background: url(http://t3.gstatic.com/images?q=tbn:gMoDR-FiKi9JwM) no-repeat 0 3px;
}

.adis
{
margin-bottom:10px;
border-top:solid 1px #DEDEDE;
padding-top:10px;
font-size:13px;
}

.ads-right-min
{
border-left:solid 1px #DEDEDE;
height:150px; padding-left:10px;
}

.ads-right-min a:link,
.ads-right-min a:visited,
.bottom-share-links a:link,
.bottom-share-links a:visited
{
font-size:12px;
color:#222;
display:block;
height:22px;
line-height:22px;
margin-bottom:16px;
padding-left:32px;
}

.ads-right-min a:hover,
.bottom-share-links a:hover
{
color:#666;
}

.mini-feed
{
background:url(http://lh4.ggpht.com/_TqPdHmAEwTM/SrVhkTClEUI/AAAAAAAAFqo/v8AYhMipuYU/feed.gif) no-repeat;
}

.mini-tweet
{
background:url(http://lh5.ggpht.com/_TqPdHmAEwTM/SrVkkLNvMlI/AAAAAAAAFqs/S-UYpTlrZa8/tweet.gif) no-repeat;
}

.mini-tech
{
background:url(http://lh6.ggpht.com/_TqPdHmAEwTM/SrVsIDBoz7I/AAAAAAAAFqw/UpGK_0UQUZg/technorati.gif) no-repeat;
}

.mini-facebook
{
background:url(http://lh4.ggpht.com/_TqPdHmAEwTM/SrXQ3G_uRnI/AAAAAAAAFq0/ktY0xwRy4Oo/fb.gif) no-repeat;
}

/* akhir css*/

<b:if cond='data:blog.homepageUrl != data:blog.url'>

<div class='adis'>

<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<tbody>

<tr>

<td valign='top' width='295'>
<div class='artikelpopuler' style='border: 1px solid #dedede; font-family:Arial, Helvetica, sans-serif; font-size:12px; padding: 0pt 5px; line-height: 18px; background: #efefef none repeat scroll 0% 0%; width: 290px; float: left; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous;'><div style='background: #ccc none repeat scroll 0% 0%; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; width: 135px; color: #000; text-align: center;'><b>Artikel Populer</b></div>
&lt;script type=&quot;text/javascript&quot;&gt;
function pipeCallback(obj) {
document.write(&#39;&lt;ul style=&quot;text-transform: capitalize;&quot;&gt;&#39;);
var i;
for (i = 0; i &lt; obj.count ; i++)
{
var href = &quot;&#39;&quot; + obj.value.items[i].link + &quot;&#39;&quot;;
var item = &quot;&lt;li&gt;&quot; + &quot;&lt;a href=&quot; + href + &quot;&gt;&quot; + obj.value.items[i].title + &quot;&lt;/a&gt; &lt;/li&gt;&quot;;
document.write(item);
}
document.write(&#39;&lt;/ul&gt;&#39;);
}
&lt;/script&gt;
&lt;script src=&quot;http://pipes.yahoo.com/pipes/pipe.run?_render=json&amp;_callback=pipeCallback&amp;_id=ff855e4f4d4a10fde1c2eb32074f99cd&amp;url=http%3A%2F%2Fyourblog.blogspot.com&amp;num=5&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;
</div>
</td>

<td>
<div class='ads-right-min'>
<a class='mini-feed' href='Your RSS Link'>Subscribe RSS Feed</a>
<a class='mini-tweet' expr:href='&quot;http://twitter.com/home/?status=yourblog.blogspot.com:=&quot; + data:post.url'>ReTweet</a>
<a class='mini-facebook' expr:href='&quot;http://www.facebook.com/share.php?u=&quot; + data:post.url'>Share on Facebook</a>
<a class='mini-tech' href='http://technorati.com/faves?sub=addfavbtn&amp;add=http://yourblog.blogspot.com'>Add to Technorati</a>
</div>
</td>

</tr>

</tbody>
</table>

</div>

</b:if>