Cara Buat Tombol Share Di Posting Blog

Bagaimana apa kamu tertarik unutk memasangnya?
Kalau kamu tertarik mari kita ikuti tutorial Cara Memasang Do You Like This Article berikut ini :

1.    Login ke Blogger

2.    Pilih template > Edit HTML > Proses dan beri tanda centang pada Expand Widget Templates

3.    Cari kode ]]></b:skin>

4.    Copy kode di bawah ini dan pastekan tepat di atas kode ]]></b:skin>

#doulike-outer:hover
{ background: #FFF;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
-moz-box-shadow: 1px 1px 2px #CCC inset; box-shadow: 1px 1px 2px #CCC inset; }
#doulike-outer td { padding: 5px 0; }
#w2bEmailsub
{ display: block;
clear: both;
margin: 10px 0; }
.form.w2bEmailform
{ margin: 20px 0 0;
display: block; clear: both; }
.emailText
{ background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQcscpujBY48gbqcFfa_i654jDs0s17jBdat6ca6C2QmHEgUdcxftQ35NnjxYChx9U5HOL8gzci-5ij1iz6BH-scTvOM7bdq30zUvFXniCMjvckxrVHUeFgQg6QrIhWUWNlzg0TgW-VToz/s28/w2b-mail.png") no-repeat scroll 4px center transparent;
padding: 7px 15px 7px 35px;
color: #444;
font-weight: bold; text-decoration: none;
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
-moz-border-radius: 4px; border-radius: 4px;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
-moz-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset; }

5.    Kemudian cari lagi kode <data:post.body/> atau <div class='post-footer-line post-footer-line-1'>

6.    Copy kode di bawah ini dan pastekan tepat di bawah kode <data:post.body/> atau <div class='post-footer-line post-footer-line-1'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='doulike-outer'>
    <div id='doulike'><span style='font-style: italic; font-size: 30px; font-variant: small-caps; font-family:&quot;Century Gothic&quot;;'>Do you Like this Article?</span>
<div style='padding:4px;'>
<table border='0'><tbody><tr>
<td>
<div style='margin-right:10px;'>
<a class='twitter-share-button' href='https://twitter.com/share'>Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp; action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; margin-left:0px; width:100px; height:20px;'/>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<g:plusone expr:href='data:post.url' size='medium'/>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'><img border='0' src='//assets.pinterest.com/images/PinExt.png' title='Pin It'/></a>
<script src='//assets.pinterest.com/js/pinit.js' type='text/javascript'/>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<script type='text/javascript'>
(function() {
var s = document.createElement(&#39;SCRIPT&#39;), s1 = document.getElementsByTagName(&#39;SCRIPT&#39;)[0];
s.type = &#39;text/javascript&#39;;
s.async = true;
s.src = &#39;http://widgets.digg.com/buttons.js&#39;;
s1.parentNode.insertBefore(s, s1);
})();
</script>
<a class='DiggThisButton  DiggCompact' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title'/>
</div>
</td>
</tr></tbody></table>
</div>       
<br/>
<table width='100%'>
<tr>
<td><fb:like expr:href='data:post.url' font='' send='true' show_faces='false' width='343'/></td>
<td align='right'>
<!-- DoYouLike Social Links -->
<a href='http://feeds.feedburner.com/tutorial-4u/Coto' title='Suscribe to RSS feed'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIhV9PC5jekW82UuIKToSJe1XDy3TcrPDC1huFbaSWuCiXEN1RcTANMbSaOnOzkgK-TFJEzLzlAWuliFGoDKCUlOhg-FA76BxfbVCHz9-7ZzNztyltKVSiK4Jip7nl_gJbF5Bkc8JOp1Nc/s40/w2bRSS+.png'/></a>
<a href='http://twitter.com/tutorialforyou2' title='Follow me on Twitter'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIGo2iWl4YtJdsrZkJB7nG5QD58HNTfpZcOPusFA9LG1qlkRvGShSJLRzx-Zi0NVSls8G9mifcpZoAOaCZZm3OpjUxCgS5tRYFcaHF9jCp2SOrfM2vYDDhXg3CswmpO7Efz85c_HvM2Dcq/s40/w2bTwitter.png'/></a>
<a href='http://www.facebook.com/tutorialforu' title='Became Fan on Facebook'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK2di2ZQkCTf_MWXioCQz5As_B1GXnY1SUpGvwU4I6Ctump3p5f9UEpK2wgR7cng1QGfQl7UAw7dwwaEI49I6lL0yydsyqZH_s5PvqrQMO7jV_QmQ2EfAZAgdnF7UEjHZpvYBfvB5BO7A4/s40/w2bFaceBook.png'/></a>
<a href='http://www.stumbleupon.com/stumbler/tutorial-4u/' title='Stumble Your Interests'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQ7K2mds5w95nRRtgEZfwfhMQEdefi7rPa2TmckG4xS464nRnJ_j1ib3PJmmquzUXL2fS6FdOugTPf_grOub2cZ9LNJiTBsqCmgEMA6G0kaKhsVwUCPFE5oSllwISFNBLYIa2Sq6MAhg9Z/s40/w2bStumbled.png'/></a>
</td>
</tr>
<tr>
<td colspan='2' style='text-align:center;'>
<span style='font-size: 16px; font-weight: bold;'>Get Latest Updates For Free!</span>
<!-- Feedburner Email From -->
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=tutorial-4u/Coto&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;display:inline-block;' target='popupwindow'>
<input name='uri' type='hidden' value='Tutorial For You'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='emailText' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>
<input alt='' class='emailButton' title='' type='submit' value='SignUp'/>
</form>
</td>
</tr>
<tr>
<td colspan='2'><span style='text-align: center; font-size: 10px; font-style: italic; display: block;'>Your email address will not be shared with anyone </span></td>
</tr>
</table>
</div>
</div><div style="clear: both;font-size: 9px;text-align:right;"><a href="http://www.tutorial-4u.com/2012/12/cara-memasang-do-you-like-this-article.html" target="blank"><font color="blue">[Get This Widget]<font></font></font></a></div>
</b:if>

7.    Setelah selesai simpan template kamu dan lihat hasilnya.




sumber