Cara yang Mudah Membuat Tombol Share di Atas Postingan

Cara yang Mudah Membuat Tombol Share di Atas Postingan - Setelah kemarin Fahri's Blog membuat artikel tentang cara yang mudah membuat tulisan di bawah postingan, kali ini saya ingin berbagi tentang cara membuat tombol share di atas postingan. Setelah saya melakukan pencarian di berbagai blog, akhirnya saya menemukan informasi membuat tombol share tersebut. Berikut langkah-langkah membuat tombol share di atas postingan artikel,yaitu:

1.Login blogger - Template - Edit HTML 

2.Checklist kotak kecil di sebelah bacaan Expand Template Widget

3.Lalu cari kode ini 

<div class='post-body entry-content'> atau class='post-body entry-content.

Gunakan ctrl+f untuk memudahkan proses pencarian. 

4.Pastekan Kode di bawah ini, tepat di atas kode <div class='post-body entry-content'> atau class='post-body entry-content. 

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div style='border-top:1px solid #ccc;border-bottom:1px solid #ccc; padding:8px 0px;margin:5px 0px 5px 0px;width:100%;float:left;height:20px;'> <div style='float:left;padding-left:0px;font:normal 12px Georgia;'> Share on : </div> <div style='float:left;padding-left:10px;'> <a name='fb_share' type='button_count'/> <script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'> </script></div> <div style='float:left;padding-left:10px;'> <a class='DiggThisButton DiggCompact'/> <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> </div> <div style='float:left;padding-left:10px;'> <a class='twitter-share-button' data-count='horizontal' data-via='User Name' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/> </div> <div style='float:left;padding-left:10px;'> <!-- Place this tag where you want the +1 button to render --> <g:plusone size="medium"></g:plusone> <!-- Place this render call where appropriate --> <script type="text/javascript">   (function() {     var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;     po.src = 'https://apis.google.com/js/plusone.js';     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);   })(); </script> </div> </div> </b:if>

5. Untuk lebih jelas bisa lihat gambar di bawah ini.

6.Klik Save

Selamat sekarang kamu sudah mempunyai tombol Share on di atas postingan artikel kamu.

Tweet

Subscribe to receive free email updates: