Cara Membuat Share box di Blog

Stelah beberapa hari ini membahas tentang Seo blog kayaknya bosen jika setiap post selalu itu terus yang di publis. pada kesempatan hari ini saya akan mencoba buat share Cara Membuat Share Box di Blog. template yang kita download dan dipasang di situs kita sering kali banyak kekurangan, seperti share box, breadcrumb, artikel terkait dan masih banyak yang lainnya. tapi maklumlah secara tema kita dapatkan secara gratis. alternatifnya adalah dengan memasang sendiri atribut-atribut yang menurut anda kurang, sekalian belajar mengenal script html.
Share box untuk blog sangat penting utuk mempermudah pengunjung jika ingin berbagi artikel yang kita publish. ada beberapa menu yang biasanya dipakai dalam share box ini seperti Facebook, Twitter, Google+ dan masih banyak yang lainnya. berikut adalah tutorial membuat  share box di blog:

1. Login ke blog anda
2. Pilih rancangan > edit html
3. Cari kode berikut <div class='post-header-line-1'/> untuk mempermudah dalam pencariannya gunakan Ctrl+F
   jika kode diatas tidak ditemukan bisa mencari kode ini <data:post.body/>
4. Copy dan pastekan kode berikut di bawah salah satu kode di atas.
   

   <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 http://onchall.blogspot.com  --> </b:if>

5. Langkah terahir pertinjau atau bisa langsung menyimpannya.

Demikian artikel Cara Membuat Share box di Blog semoga bermanfaat.

Share on Google Plus

About catatancidingku.bligspot.com

M Agung Sutrisno: Saya seorang Web Devoloper sejak tahun 2015. Saya tertarik dengan dunia IT sejak tahun 2013. Lulus dari Universitas Islam Madura pada tahun 2016. Pernah bekerja di Univeritas Islam Madura selama 2 tahun. Mulai tahun 2017 mulai bekerja sebagai Web Developer di salah satu perusahaan software PT. Warung Jasa Teknologi, Jakarta.