Memasang Widget Follow Me

Salah satu cara untuk menambah jumlah pengunjung adalah dengan mempromosikan blog kita melalui Laman web sosial. Oleh itu,memasang widget social bookmark di blog kita juga sangat diperlukan. Bagi sesiapa yang ingin boleh ikut tutorial dibawah ini.

Langkah 1

1. Login ke Account/Dashboard blog anda. Pilih Design.

2. Klik Add a Gadget dan Pilih HTML/JavaScript.

3. Sebuah halaman baru akan terbuka seperti dibawah ini.

4. Masukkan kode di bawah ini ke dalam Widget tadi.

<ul id="soc">
<li><a class="facebook" href="URL Fan Page Anda" title="Be my facebook fan">Facebook</a></li>
<li><a class="twitter" href="URL Twitter Anda" title="Folow me on Twitter">Twitter</a></li>
<li><a class="rss" href="URL Feedburner Anda" title="Subscribe via RSS">rss</a></li>
<li><a class="mail" href="http://feedburner.google.com/fb/a/mailverify?uri=ID Feed anda/feed" title="Subscribe to Email updates">email</a></li>
<li><a class="google" href="URL Google Friend" title="Follow Via Google Friend Connect">email</a></li>
</ul>

5. Jangan lupa edit dulu URL diatas baru klik save.

Langkah 2

1. Pergi ke menu Edit HTML.

2. Cari kode]]></b:skin> menggunakan CTRL+F pada browser anda,dan ganti kode tersebut dengan kode berikut ini

ul#soc{width:250px;margin:0px auto;list-style:none;padding:0px}

ul#soc li {display:inline;}

ul#soc li a {padding:0px;margin:0px;display:inline-block;float: left; height: 50px;background: url('http://img201.imageshack.us/img201/2135/socialbutton.png')no-repeat center; text-indent:-9999px;}

ul#soc li a.facebook {width:50px;background-position:0 0;}

ul#soc li a.twitter {width:50px; background-position: -50px 0;}

ul#soc li a.rss {width:50px;background-position: -100px 0;}

ul#soc li a.mail {width:50px;background-position: -150px 0;}

ul#soc li a.google {width:50px;background-position: -200px 0;}

ul#soc li a.facebook:hover,ul#soc li a.facebook:focus {background-position: 0 -50px;}

ul#soc li a.twitter:hover,ul#soc li a.twitter:focus{background-position:-50px -50px;}

ul#soc li a.rss:hover, ul#soc li a.rss:focus {background-position: -100px -50px;}

ul#soc li a.mail:hover, ul#soc li a.email:focus {background-position: -150px -50px;}

ul#soc li a.google:hover, ul#soc li a.email:focus {background-position: -200px -50px;}

]]></b:skin>

3. Save template dan lihat hasilnya.

Semoga berjaya.