Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat Tombol Follow atau Link Follow di Blogger

Cara Membuat Tombol Follow atau Link Follow di Blogger

Tombol Follow Blog - Bagaimana membuat sebuah link yang bisa membuat orang lain mengikuti kita di blog?

Mungkin ini pertanyaan yang sangat mudah bagi yang sudah mengetahuinya tapi membuat bingung bagi yang baru belajar blogging.

Link menuju ke halaman untuk orang lain agar bisa mengikuti blog kita adalah hal yang tepat untuk membangun blog menjadi lebih baik.

Sebab dengan adanya dukungan dari pengunjung yang tertarik untuk mengikuti blog Anda.

Tanpa disadari bahwa blog yang kamu buat beserta tulisannya memberikan manfaat kepada orang lain.


Dalam halaman ini juga, kami akan memberikan tips untuk kamu yang ingin membuat link follow / tombol follow untuk blog kamu.

Langkah yang perlu kamu lakukan cukup mudah, karena kita disini tidak perlu memiliki sklill coding atau juga bungkar-bungkar template.

Membuat Link Follow di Blog

Silahkan kamu salin dulu kode link dikotak bawah ini.
<a href="http://www.Blogger.com/follow-blog.g?blogID=3549377267119047245" title="join this site">Follow Blogger</a>
Note: Kode angka yang saya beri tanda merah itu adalah kode angka blog miliki saya, untuk menggubahnya kamu bisa lihat kode angka yang ada di addres bar dashbor blogger
Cara Melihat ID Blogger
Agar lebih jelasnya dan mudah kamu pahami, silahkan lihat contoh gambar dibawah ini.

Cara Membuat Tombol Follow atau Link Follow di Blogger
images by rianseo.com

Salin kode angka id blog kamu, dan ganti dengan kode milik saya sebelumnya dengan id angka blog yang sudah kamu salin tadi.

blogID=3549377267119047245


Mendesain Tombol Follow Blog

Jika kamu ingin membuat tombol follow blog menjadi lebih menarik, maka yang perlu kamu lakukan adalah membuat kode CSS.
Baca lebih lanjut — Pelajari lebih lanjut tentang CSS di Blogger.
Tapi tenang saja, kamu tidak perlu ahli dalam masalah kode CSS, sebab disini kami sudah menyediakan kode CSS untuk tampilan tombol follow blog tersebut.

Salin kode CSS dibawah ini dan letakan kodenya Template > edit HTML > dan letakan di atas kode ]]></b:skin> atau </style>
#followSubscribe{background-color:#464646;width:220px;color:#fff;position:fixed;z-index:999;right:10px;bottom:0}
.followButton{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}
.followButton span{background:url("https://4.bp.blogspot.com/-fc3-0J--iW8/VyPNjRmxJtI/AAAAAAAAD7U/emRRY6ntYEg3IaL-mev9XxE9M1OKh50fACLcB/s1600/follow-blogger.png") no-repeat scroll 0 3px transparent;padding-left:15px}
.followButton:hover,.arlinafollowButton:focus,.followActive,.followActive:hover{color:#fff}
.followButton:hover span,.followActive span{background-position:0 -37px!important}
.followactive{background-color:#333}
.followForm{padding:15px;margin:auto;text-align:center;font-size:12px}
.followForm p{margin:10px 0}
.FollowFooter{text-align:center;font-size:11px;padding:7px 0;margin:0 0 -15px;border-top:1px solid #3c3c3c}
.FollowFooter a{color:#aaa;background:none;text-decoration:none}
.FollowFooter a:hover{color:#fff;background:none}
Klik " SIMPAN "

Memasang Tombol Follow di Blog

Langkah selanjutnya adalah tahap pemasangan tombol follow ini kebagian tata letak.

Buka Blogger > Tata Letak > Tambahkan Gagdet > Mode HTML


Cara Membuat Tombol Follow atau Link Follow di Blogger
images by rianseo.com

Salin kode HTML dibawah ini dan paste di kolom HTML tersebut.
<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("#followSubscribe"),t="-"+o.outerHeight()+"px";o.hide().css({bottom:"-510px"}),setTimeout(function(){o.show().animate({bottom:t})},500),e(".followButton").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="followForm">
    <a class="followButton" href="#" title="Follow"><b>+ Follow</b></a>
    <br />
    <a href="http://www.blogger.com/follow-blog.g?blogID=3549377267119047245" 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://1.bp.blogspot.com/-HViEx99kxmQ/VyPMrPGAvEI/AAAAAAAAD7M/bWz5CKpHrHkxtVdgL0z-xJQa_nA_tK0gACLcB/s1600/Follower.png" alt="Join on this site" /></a>
    <br />
    <p>with Google Friend Connect</p>
  </div>
</div>
Note: Ubah kode yang saya beri warna merah dengan kode id Blog kamu
Nah terakhir klik " SIMPAN "

Kesimpulan

Demikian tutorial yang dapat kami sampaikan tentang cara membuat tombol follow di blog.

Jika masih ada masalah dalam memasang tombol follow blog diatas, jangan ragu untuk bertanya melalui kolom komentar blog ini.

Refrensi : Arlina Design
Thanks to : Blogger.com

1 komentar untuk "Cara Membuat Tombol Follow atau Link Follow di Blogger"

Kami memiliki kebijakan dalam berkomentar di Blog ini :

— Dilarang promosi suatu barang
— Dilarang jika memasang link aktif di komentar
— Dilarang keras melakukan promosi iklan
— Dilarang menulis komentar yang berisi sara, bully atau cemuhan

NB :Komentar yang melanggar tidak akan ditampilkan

Kebijakan komentar yang bisa Anda temukan selengkapnya disini

Dukungan :

Jika menyukai dengan artikel blog kami, silahkan Ikuti blog ini