246#Ai no Kotoba ~ [Tutorial] Add Follower Widget Untuk Blogskin Cara Baru

Awal-awal beritahu, tuto ni Hana dapat daripada blog adik Yati, salah seorang pengguna Blogskins yang comel. Yati pun dapat tuto ni daripada Kitty. Setakat tu je la yang Hana tahu empunya tuto ni *dah kira kredit lah ni letak link dan nama :)* 
Sebab dah tak boleh generate code macam biasa, ada cara manual untuk sesiapa pengguna Blogskins atau mana-mana template yang nak letak Follower Widget. Follower Widget ni penting sebab bukan semua blogger boleh follow blog dengan hanya guna Button Follow comel ala Tumblr tu. Nak tahu kenapa, baca entri INI. So, alert! Korang boleh guna tuto ni.

1. Pergi ke Template dan tukar daripada Blogskins kepada Blogger Template. Sebelum tu, save template Blogskins korang kalau tak nak hilang. Kalau tak tahu cara nak tukar dari Blogskins ke Blogger Template, klik SINI. 
2. Pergi ke Dashboard > Design > Edit Layout. Sebab korang dah bertukar pada Blogger Template, korang dah boleh add gadget Follower. Sesetengah Blogger Template tu dah ada Follower Widget ni, sesetengah tu korang kena add guna Add A Gadget. Lepas add, save terus.
3. Korang pergi ke blog dan tekan Ctrl + U (SERENTAK!) untuk view page source. Bila dah keluar page source yang banyak kod HTML tu, korang cari kod seakan-akan kod kat bawah ni. Untuk cari code, korang tekan Ctrl + F serentak dan masukkan keyword 'friendconnet'

Page Source akan keluar kalau anda tekan key Ctrl & U SERENTAK! :)

AMARAN : Jangan copy kod ni. Setiap blog ada kod yang tersendiri. Yang ini kod untuk Follower Widget blog Hana sahaja :) Korang copy bermula kod <script type="text/javascript"> sehingga kod locale: 'en'}, skin); </script></div>Rujuk kod dalam Scroll Box ni. Cari kod seakan-akan kod dalam ni.

<script type="text/javascript">
	if (!window.google || !google.friendconnect) {
	document.write('<script type="text/javascript"' +
	'src="http://www.google.com/friendconnect/script/friendconnect.js">' +
	'</scr' + 'ipt>');
	}
	</script>
	<script type="text/javascript">
	if (!window.registeredBloggerCallbacks) {
	window.registeredBloggerCallbacks = true;
	gadgets.rpc.register('requestReload', function() {
	document.location.reload();
	});
	gadgets.rpc.register('requestSignOut', function(siteId) {
	google.friendconnect.container.openSocialSiteId = siteId;
	google.friendconnect.requestSignOut();
	});
	}
	</script>
	<script type="text/javascript">
	function registerGetBlogUrls() {
	gadgets.rpc.register('getBlogUrls', function() {
	var holder = {};
	holder.currentPost = "http://www.blogger.com/feeds/8787990000793435477/posts/default/3323307139959403149";
	holder.currentComments = "http://www.blogger.com/feeds/8787990000793435477/3323307139959403149/comments/default";
	holder.currentPostUrl = "";
	holder.currentPostId = 3323307139959403149
	holder.postFeed = "http://www.blogger.com/feeds/8787990000793435477/posts/default";
	holder.commentFeed = "http://www.blogger.com/feeds/8787990000793435477/comments/default";
	holder.currentBlogUrl = "http://haruno-hana.blogspot.com/";
	holder.currentBlogId = "8787990000793435477";
	return holder;
	});
	}
	</script>
	<script type="text/javascript">
	if (!window.registeredCommonBloggerCallbacks) {
	window.registeredCommonBloggerCallbacks = true;
	gadgets.rpc.register('resize_iframe', function(height) {
	var el = document.getElementById(this['f']);
	if (el) {
	el.style.height = height + 'px';
	}
	});
	gadgets.rpc.register('set_pref', function() {});
	registerGetBlogUrls();
	}
	</script>
	<div id="div-17fr1iuczk6d3" style="width: 100%; "></div>
	<script type="text/javascript">
	var skin = {};
	skin['FACE_SIZE'] = '32';
	skin['HEIGHT'] = "260";
	skin['TITLE'] = "Tomodachi";
	skin['BORDER_COLOR'] = "transparent";
	skin['ENDCAP_BG_COLOR'] = "transparent";
	skin['ENDCAP_TEXT_COLOR'] = "#444444";
	skin['ENDCAP_LINK_COLOR'] = "#09dada";
	skin['ALTERNATE_BG_COLOR'] = "transparent";
	skin['CONTENT_BG_COLOR'] = "transparent";
	skin['CONTENT_LINK_COLOR'] = "#09dada";
	skin['CONTENT_TEXT_COLOR'] = "#444444";
	skin['CONTENT_SECONDARY_LINK_COLOR'] = "#09dada";
	skin['CONTENT_SECONDARY_TEXT_COLOR'] = "#000000";
	skin['CONTENT_HEADLINE_COLOR'] = "#3b75e3";
	skin['FONT_FACE'] = "normal normal 20px Arial, Tahoma, Helvetica, FreeSans, sans-serif";
	google.friendconnect.container.setParentUrl("/");
	google.friendconnect.container["renderMembersGadget"](
	{id: "div-17fr1iuczk6d3",
	height: 260,
	site: "04056827126375876332",
	locale: 'en' },
	skin);
	</script>
	</div>

4. Dah copy kod Follower korang? Bagus. Sekarang paste dulu pada Notepad. Tapi kalau korang online Facebook dan tengah menghadap profil FB korang masa ni, paste dekat Post Status aje. Maksud Hana, paste aje kod ni kat situ, tapi jangan pulak korang tekan Post. Sebagai alternatif kalau malas nak buka Notepad aje. Hana selalu buat macam ni. Ha ha.

5. Sekarang, boleh tukar balik template korang daripada Blogger Template kepada Blogskins atau apa-apa template sahajalah. Nak tuto klik SINI. Kod yang korang paste kat Notepad atau Post Status Facebook tu, korang copy dan paste lah dekat mana-mana kod Blogskins korang bahagian sidebar (Part sidebar ni kena tanya blogger yang terer coding Blogskins. Tanya Yati pun boleh) 

Macam yang ni, Hana gabungkan Follower Widget dengan Fieldset :) Dengan hanya guna tuto ni. Untuk pengguna Blogger Template yang nak guna tuto ni, boleh copy and paste pada gadget HTML/JavaScript.

Okey. Done. Kepada pengguna Blogskins yang nak tau lebih lanjut, tanya Yati sendiri. Sebab dia dah berjaya buat. Hana cuma nak sebarkan tuto ni aje untuk sesiapa yang tak tahu. Harap menjadi. Daa~ (^.^)v