Tuesday, November 18, 2014

Tutorial Follower Widget (Blogskin)



Yeahh.. Tengah free sementara menghabiskan cuti sem yang masih berbaki sikit ni

Assalamualaikum w.b.t.

Finally, nad dah ada kotak follower sendiri. Puas dah cari tutorial sana sini. Godek code sana sini. Majoritynya tak menjadi. Tak keluar langsung kotak follower tu. Padahal dah ikut step by step. Entah dimana silapnya. Rasa macam nak hempuk je laptop ni. Fed up sangat sangat. Dah geram sangat, pernah juga terfikir nak tukar ke template lama balik. Bila difikirkan rasa rugi pula. Sebab dah penat berhempas pulas edit blog ni sampai macam ni.

 Alhamdulillah. Semalam nad dah berjaya jumpa tutorial macam mana nak letak kotak follower tu kat dalam blog ni. Try semalam dengan hati yang excited dan semangat yang berkobar-kobar. Mengharapkan tuto tu menjadi. Bila dah save dan view blog, akhirnya menjadi. Dalam pukul 6 pagi macam tu la nad berjaya buat tuto tu. Sanggup sampai tak tidur semalaman. Nak cari tuto punya pasal. Berbaloi juga berjaga macam Batman semalam. Rasa macam nak lompat bintang je. Hahaha.


Nad nak share macam mana nak dapatkan kotak follower tu. Mungkin ada yang blogger di luar sana yang mempunyai problem macam nad ni. Boleh diorang try tuto ni. Mana tau menjadi kan. Lega sikit hati tu. Hihi

1- Tukar blog kepada Simple Template.

How ? Macam ni caranya :

Pergi dekat bahagian Template Upgrade template Simple template. Lepas tu save je. Bagi yang tak ada widget follower, boleh pergi dekat Layout → Add a gadget Followers. Then, save. View blog korang dan tekan CTRL + U untuk view page source. Tekan CTRL + F dan tulis perkataan site. Cari code seakan-akan code kat bawah ni.

site: "07045439483620914405",

Kalau dah jumpa code macam kat atas tu, copy nombor tu dan save kat mana-mana dulu. Lebih senang save kat Microsoft Word.

2- Tukar semula template blog kepada classic template.

Pergi scroll sampai bahagian bawah template tu. Akan jumpa perkataan Revert to Classic Template. Click je kat perkataan perkataan Revert to Classic Template tu.

3- Copy code yang ada kat bawah ni dan paste kat ruangan sidebar yang dikehendaki.

<center><script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-YOUR BLOG ID" style="width:210px;border:0px solid #444;"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript">
var skin = {};
skin['BORDER_COLOR'] = 'transparent';
skin['ENDCAP_BG_COLOR'] = '#f3e4ca';
skin['ENDCAP_TEXT_COLOR'] = '#000000';
skin['ENDCAP_LINK_COLOR'] = '#000000';
skin['ALTERNATE_BG_COLOR'] = '#f3e4ca';
skin['CONTENT_BG_COLOR'] = '#f3e4ca';
skin['CONTENT_LINK_COLOR'] = '#000000';
skin['CONTENT_TEXT_COLOR'] = '#000000';
skin['CONTENT_SECONDARY_LINK_COLOR'] = '#000000';
skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#000000';
skin['CONTENT_HEADLINE_COLOR'] = '#333';
skin['NUMBER_ROWS'] = '3';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderMembersGadget(
 { id: 'div-YOUR BLOG ID',
   site: 'YOUR SITE NUMBER' },
  skin);
</script></center>


SITE NUMBER = Copy paste je site number yang dah save tadi
BLOG ID = Boleh ambil kat ruangan url kat atas sekali

Contoh blog ID

4- Save dan view blog

Try refresh banyak kali sampai kotak follower tu muncul dalam blog. Nad refresh dulu blog baru muncul kotak follower tu.

Credit to : Hafiz Zulkafly


No comments:

Post a Comment

Assalamualaikum. Hi! Please drop your comment and opinion here. Harsh and dirty words are strictly prohibited. Thanks :)