cara membuat share box di blogspot- blogger blog anda

cara membuat share box untuk blogspot- blogger blog anda, didalamnya terdapar fungsi-fungsi:

1. official tweet button dengan counter 
2. oficial Google Buzz dengan counter 
3. official Stumbleupon button dengan counter 
4. Blog This! 
5. Email this! 
6. Print this! 
7. Comment count link 
8. dan terakhir Facebook like button.

bagaimana cukup complete bukan?semuanya dapat diramu jadi satu dan bisa ditambahkan dengan cepat pada blog anda.
tampilannya kira-kira seperti ini nih:

cara membuat share box untuk blogspot- blogger blog adalah sebagai berikut:

• Log in pada blogger anda 
• pilih Rancangan --> Edit HTML 
• Klik "Expand Widget Templates" 
• Cari kode berikut <div class='post-header-line-1'/>
• Copy dan pasang kode share box tepat dibawah kode <div class='post-header-line-1'/>

Perhatian: jika anda tidah dapat menemukan kode <div class='post-header-line-1'/> , anda juga bisa sebelum kode <data:post.body/>
Kode share boxnya adalah:

<b:if cond='data:blog.pageType == "item"'>


<style type='text/css'>
.multisharebox {
 background: none repeat scroll 0 0 #EFEFEF;  float: right;  margin: 5px 0px 3px 10px;  padding: 0 5px 0;  text-shadow: 0 1px 0 #FFFFFF;  width: 260px;  border:4px solid #d8dfea;
}
.fb-like-boxtop {
 background: none repeat scroll 0 0 #EDEFF4;  border: 1px solid #D8DFEA;  color: #000000;  float: right;  font-size: 11px;  margin: 0 0;  padding: 5px 10px;  text-align: left;  width: 230px;
}
.fb-like-boxtop a {
 color: #000000;  text-decoration:none;
}
.fb-like-boxtop a:hover {
 color: #000000;  text-decoration:underline;
}
.fb-like-box {
 background: none repeat scroll 0 0 #EDEFF4;  border: 1px solid #D8DFEA;  color: #000000;  float: right;  font-size: 11px;  height: 60px;  margin: 5px 0;  overflow: hidden;  padding: 5px 10px;  text-align: left;  width: 230px;
}
</style>


<!-- Perfect Share Box : Created by www.bloggertipandtrick.net  -->
<div class='multisharebox'>
<table><tr>
<td><table><tr>
<td><a class='twitter-share-button' data-count='vertical' data-lang='en' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow'/>
<b:if cond='data:post.isFirstPost'>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'>
</script>
</b:if></td>
<td><script expr:src='&quot;http://www.stumbleupon.com/hostedbadge.php?s=5&amp;r=&quot; + data:post.url'/></td>
<td><a class='google-buzz-button' data-button-style='normal-count' data-locale='en_IN' expr:data-url='data:post.url' href='http://www.google.com/buzz/post' rel='nofollow' title='Post on Google Buzz'/>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/></td>
<td><a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/></td>
</tr></table></td>
</tr><tr>
<td><div class='fb-like-boxtop'><a expr:href='data:post.sharePostUrl + &quot;&amp;target=blog&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=270,width=475\&quot;); return false;&quot;' expr:title='data:top.blogThisMsg' target='_blank'>BlogThis!</a> | <a expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'>Email This!</a> | <a href='javascript:window.print();'>Print This!</a> | <b:if cond='data:post.allowComments'><a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 0'>No comments</b:if><b:if cond='data:post.numComments == 1'>1 comment</b:if><b:if cond='data:post.numComments &gt;= 2'><data:post.numComments/> comments</b:if></a></b:if></div></td>
</tr><tr>
<td><div class='fb-like-box'>
Do you like this post?
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=230&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:230px; height:40px;'/>
</div></td>
</tr></table>
</div>
<!-- Perfect Share Box : Created by www.bloggertipandtrick.net  -->


</b:if>

Setelah terpasang, jangan lupa save pekerjaan anda dan lihat hasilnya.

Anda sedang membaca artikel tentang cara membuat share box di blogspot- blogger blog anda. Anda bisa bookmark halaman ini dengan URL http://rujakcemil.blogspot.com/2012/06/cara-membuat-share-box-di-blogspot.html. Jika Anda menyukai Artikel di blog ini, Silakan masukkan email Anda di bawah ini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit.