Cara Memasang Slide Out tombol follow di blog

Cara Memasang Slide Out tombol follow di blog- Hari ini MasBagus lagi bosan menulis artikel tentang SEO. Jadi biar nggak bosan, postingan ini akan membahas tentang tombol follow blog .

Apa fungsi tombol follow blog?

Follow blog merupakan menu yang disediakan oleh blogger untuk para pembaca situs yang tertarik dengan artikel situs tersebut. Jadi nantinya mereka bisa mengikuti suatu situs dan terus mendapatkan update terbaru. Namun biasanya tombol join this site ini diletakkan di sidebar oleh sebagian bloggers. Hal ini menyebabkan situs anda terlihat kurang menarik, apalagi bila belum ada yang mengikuti situs anda,hal ini hanya akan memenuhi widget sidebar di situs anda.

Oleh karena itu, Kini MasBagus akan memberikan cara agar tombol join this site ini terkesan menarik dan lebih elegan. Yaitu dengan menggunakan efek slide. Widget ini akan mempercantik tampilan situs anda.

Memasang Slide Out tombol follow di blog berguna agar apabila ada pengunjung yang tertarik dengan artikel di blog anda, dan mereka bisa mengikuti blog anda dengan menggunakan "join this site" yang tersedia dari google. Penasaran bagaimana penampakan menu slide ini? Lihat gambar di bawah ini.

Keren kan? Nah, sekarang bagaimana cara memasang slide seperti itu mas?. Sabar dulu, tapi sebelumnya ikuti juga blog MasBagus ini ya... Insyaallah isinya akan menarik dan membantu para bloggers pemula dalam mengurus blognya. Nah, saran saya ikuti dengan baik tutorial yang akan saya berikan dibawah ini

Cara Memasang Slide Out tombol follow di blog

1. Caranya sangat simple ,langsung aja masuk ke blogger>pilih tata letak> buat widged>pilih html>pastekan kode dibawah ini.

<style scoped='' type="text/css">
/*<![CDATA[*/
#arlinafollowSubscribe{background-color:#464646;width:220px;color:#fff;position:fixed;z-index:999;right:10px;bottom:0}
.arlinafollowButton{background:#464646;color:#fff;font-size:13px;line-height:28px;padding:0 10px;text-decoration:none;position:absolute;top:-28px;right:0;display:block;border-radius:2px 2px 0 0;height:28px;font-weight:700}
.arlinafollowButton span{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTZWoF_seesP99nB8J6Yai2ky4osSBOvorRyGnVzJsz1sMgkZE4JmoHorAdQC9Z-_it8ydnTA1Yw0_W11oMasugt3ceHd_PNglNAloZ4xyA8qIqSBEb-ZqK6VcnQDqRxPJQRZjMCliIana/s1600/follow-blogger.png") no-repeat scroll 0 3px transparent;padding-left:15px}
.arlinafollowButton:hover,.arlinafollowButton:focus,.followActive,.followActive:hover{color:#fff}
.arlinafollowButton:hover span,.followActive span{background-position:0 -37px!important}
.followactive{background-color:#333}
.arlinafollowForm{padding:15px;margin:auto;text-align:center;font-size:12px}
.arlinafollowForm p{margin:10px 0}
.arlinaFollowFooter{text-align:center;font-size:11px;padding:7px 0;margin:0 0 -15px;border-top:1px solid #3c3c3c}
.arlinaFollowFooter a{color:#aaa;background:none;text-decoration:none}
.arlinaFollowFooter a:hover{color:#fff;background:none}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
!function(e){e(document).ready(function(){e.extend(e.easing,{easeOutCubic:function(e,o,t,a,n){return a*((o=o/n-1)*o*o+1)+t}});var o=e("#arlinafollowSubscribe"),t="-"+o.outerHeight()+"px";o.hide().css({bottom:"-510px"}),setTimeout(function(){o.show().animate({bottom:t})},500),e(".arlinafollowButton").click(function(a){o.hasClass("followOpened")?(e(this).removeClass("followActive"),o.removeClass("followOpened").stop().animate({bottom:t},{duration:300,easing:"easeOutCubic"})):(e(this).addClass("followActive"),o.addClass("followOpened").stop().animate({bottom:"0"},{duration:500,easing:"easeOutCubic"})),a.preventDefault()})})}(jQuery);
/*]]>*/
</script>
<div id="arlinafollowSubscribe" style="bottom: -971px;">
  <div class="arlinafollowForm">
    <a class="arlinafollowButton" href="#" title="Follow"><b>+ Follow</b></a>
    <br />
    <a href="http://www.Blogger.com/follow-blog.g?blogID=5728786781831467300" title="join this site" onclick="window.open(this.href, 'dmfollow', 'toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=no,width=599,height=521');return false;" style="text-align:center;font-weight:bold;text-decoration:none;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjH_wATXnn3YcXgXJ3rgfmaJ-MpMIxYXU855Mnzk-g_I1J7mA_7pGhB4TBkC8Pa-IADOS7csn4wPhI1GhhJvWNo2ZVagEiVH43UNCxlzYEjcc-vVnRU75nj_PaFPFs2p8EQlZpIGjSD3eay/s1600/Follower.png" alt="Join on this site" /></a>
    <br />
    <p>with Google Friend Connect</p>
  </div>
</div>

Catatan: Untuk kode yang saya beri warna merah, dapat anda ganti dengan id dari blog anda. Untuk melihat id blog anda. Masuk ke dasboard > pilih ikthisar > lalu lihat URL yang ada diatasnya. Urlnya akan terlihat seperti ini :  https://www.blogger.com/blogger.g?blogID=5728786781831467300#overview/src=dashboard.
Angka yang saya beri efek bold dan miring ini lah yang disebut dengan id blog.

2. Selanjutnya Simpan Widget , dan lihat apakah widget ini sudah terpasang di blog anda.

Sangat mudah bukan?. Selamat mencoba dan semoga bermanfaat. Dan jangan lupa untuk mendapatkan info menarik lainnya ikuti juga blog ini ya ^_^.