Cara membuat tombol Share atau Share button Blogger

Cara Membuat Tombol Share Facebook, Twitter, Google + dll. Membuat tombol share facebook, twitter, digg atau mungkin ditambah dengan Google + diatas setiap posting / artikel blog dengan cara menambahkan kode atau script pada template anda.

Cara membuat tombol Share atau Share button Blogger

• Pertama silahkan login blog anda
• Klik menu Design > Edit HTML > centang expand widget templates
• Cari kode <div class='post-body entry-content'> atau class='post-body entry-content' dan biasanya ada 2 kode tersebut, pakailah kode yang pertama
• Jika sudah ketemu, copy kode dibawah ini dan paste tepat diatas kode <div class='post-body entry-content'>

Kode :

<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>

• Langkah terahir yaitu simpan template

Membuat Menu Vertikal di Blogspot

Cara membuat menu di blog - lebih tepatnya menu vertikal di blogspot alias blogger. Menu vertikal atau pun menu horizontal memang tidak bisa di hindari dalam dunia blogger.dipostingan saya kali ini, saya akan memberikan tutorial Cara membuat menu di blog .

Cara membuat menu Vertikal di Blogspot

1. Login ke blog anda > Klik Design
2. Add a gadged dan pilih HTML / javascript
3. Penempatan gadged atau widget tepatnya pada sidebar kanan atau kiri, karena menu ini vertikal dan tentunya susunan menunya kebawah.
4. Copy kode berikut dan paste pada gadge.

<style>
.menu-vertikal, .menu-vertikal li ul{list-style-type: none;margin: 5px;width: 250px; /*Lebar Menu*/border: 1px solid black;}
.menu-vertikal li{position: relative;}
.menu-vertikal li a{background: #000000;font: bold 12px Verdana, Helvetica, sans-serif;color: #FFFFFF;display: block;width: auto;padding: 5px 0;padding-left: 10px;text-decoration: none;}
.menu-vertikal li ul{position: absolute;width: 250px;display: none;}
.menu-vertikal li ul li{float: left;}
.menu-vertikal li ul a{width: 250px;}
.menu-vertikal li a:visited, .glossymenu li a:active{color: white;}
.menu-vertikal li a:hover{background: #454545;}
* html .menu-vertikal li { float: left; height: 1%; }
* html .menu-vertikal li a { height: 1%; }
</style>
<ul id="verticalmenu" class="menu-vertikal">
<li><a href="/">Home</a></li>
<li><a href="http://Link1">Menu1</a></li>
<li><a href="http://Link2">Menu2</a></li>
<li><a href="http://Link3">Menu3</a></li>
</ul>

          5. Kemudian Save

ternyata gampangkan, Membuat Menu Vertikal di Blogspot .