Tạo nút Like, Share trượt dọc cho blogspot (blogger)

Đối với các bạn đang sở hữu Blog thì không thể thiếu chức năng Like, Share bài viết của bạn lên các trang mạng xã hội giúp người đọc dễ dàng tiếp cận bài viết hoặc chỉ đơn giản là tìm kiếm lượng truy cập vào blog của mình.....
Có rất nhiều cách để cài đặt tiện ích nhưng hôm nay mình xin chia sẻ tới các bạn một cách để Blogspot (Blogger) của bạn có thể chia sẻ với tất cả các mạng xã hội.

Demo

Bước 1:
Đăng nhập vào Blogger

Bước 2:
Chọn bố cục => Thêm tiện ích => HTML/Javascript

Bước 3:
Dán đoạn code dưới đây vào

<style>
/* Fixed Positioned AddThis Toolbox */
.sharing_box_ibiet {
position: fixed;
top: 10%;
right: 0;
border: 1px solid #757775;
padding: 5px 5px 1px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background: #F0FFFF;
width: 60px;
min-height: 275px;
}
.sharing_box_ibiet .item {
width: 50px;
margin: 5px 0 5px 0;
}
.twitter_float iframe
{
width:55px!important;
}
</style>
<!-- SHARING BOX Fixed-Positioned Toolbox -->
<div class='sharing_box_ibiet'>
<div style='text-align:center; margin-top:5px'>

<!-- TWITTER -->
<div class='item twitter_float' style='margin-left:3px'>
<a class='twitter-share-button' data-count='vertical' data-lang='en' href='https://twitter.com/share'>Tweet</a>
</div>

<!-- FACEBOOK -->
<div class='item' style='margin-left:3px'>
<div class='fb-like' data-font='verdana' data-layout='box_count' data-send='false' data-show-faces='true' data-width='44'></div>
<div id='fb-root'></div>
</div>
<!-- G+ -->
<div class='item' style='margin-left:5px'>
<!-- Place this tag where you want the +1 button to render -->
<g:plusone size='tall'></g:plusone>
</div>
<!-- OTHERSHARE -->
<div class='item' style='margin-left:5px'>
<!-- AddThis Button BEGIN -->
<div class='addthis_toolbox addthis_default_style '>
<a class='addthis_counter'></a>
</div>
<!-- AddThis Button END -->
</div>

<!-- FAST SHARING SCRIPT -->
<!-- TWITTER SCRIPT -->
<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="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<!-- G+ SCRIPT -->
<!-- Place this render call where appropriate -->
<script type='text/javascript'>gapi.plusone.go();</script>
<!-- STUMBLEUPON SCRIPT -->
<!-- Place this snippet wherever appropriate -->
<script type='text/javascript'> 
 (function() { 
     var li = document.createElement('script'); li.type = 'text/javascript'; li.async = true; 
      li.src = 'https://platform.stumbleupon.com/1/widgets.js'; 
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(li, s); 
 })(); 
 </script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4f660fb932fd0f15"></script></div></div>

Bước 4:
Lưu mẫu => Chọn Mẫu => Chỉnh sửa HTML

Bước 5:
Tìm thẻ </head> (tìm kiếm nhanh Ctrl + f  dán </head> vào ô tìm kiếm)
Dán đoạn code dưới đây trước thẻ </head> => Lưu lại.

<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: &#39;en-US&#39;} </script>

Chúc các bạn thành công!