Tutorial : Add Follower Widget Cara Baru (Blogskin)
Assalamualaikum and annyeong. Ok ini merupakan tuto yg kedua utk hari ni. Ngeee :D. Tuto yang ini tieqa nak ajar korg cara utk tambah follower widget bagi pengguna blogskin. Memandangkan ramai yang tnya tieqa pasal ni. So hari ni tieqa akan buat tutonya. Sorry lambat =.= . Btw tuto ni tieqa dapat dari blog adik comel kita iaitu HarunoHana.
Okayy, kebanyakkan pengguna blogskin mesti ada masalah utk tambah follower widgetkan?. Tambahan pulak, skrang ni google friend connect dah takde follower widget macam dulu lagi. So ini agak menyukarkan korg nak dapatkan URL follower widget. Tapi don't worry tieqa dah dapat solution-nya. Jom ikut step ni.
contoh follower widget
1. Mula-2 korg kena tukar drTemplate Classic/Blogskin ke Template Designer dulu. Caranya bole ikut tuto INI
2. Bila dah convert ke Template Designer korg pergi ke Dashboard > Design > Edit layout
3. Kemudian, korg tambah gadget follower. Bagi yang dah ada tak perlu la tambah. Bagi yang takde tu korg click Add Gadget.
4. Korg Add Followers. Then Add & Save. Lihat contoh di atas.
5. Bila sudah. Korg view blog. Then tekan Ctrl+ u serentak untuk view page source. Nanti akan keluar page source yang banyak kod HTML tu kan? Okayy jgn pening dengan kod tu..lols. Korg just click Ctrl+f serentak dan cari code friendconnect
click untuk tumbesaran
6. Ha! nampak tak code yang di-highlight-kan tu? Good. Okay skrang korg cari code yang seakan-akan code kat atas tu.
WARNING
JANGAN COPY CODE INI. SEBAB SETIAP BLOG ADA CODE YANG TERSENDIRI. YANG INI CODE UNTUK FOLLOWER BLOG TIEQA SAHAJA.
Korg copy code bermula dengan <script type="text/javascript"> sehingga locale: 'en'}, skin); </script></div>
Korg bole rujuk code dalam scroll box ni. Cari codes yang seakan-akan dlm box 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.postFeed = "http://www.blogger.com/feeds/7689463663459457347/posts/default";
holder.commentFeed = "http://www.blogger.com/feeds/7689463663459457347/comments/default";
holder.currentBlogUrl = "http://pinkyshawol.blogspot.com/";
holder.currentBlogId = "7689463663459457347";
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-1yp6oi65g9ti" style="width: 100%; "></div>
<script type="text/javascript">
var skin = {};
skin['FACE_SIZE'] = '32';
skin['HEIGHT'] = "260";
skin['TITLE'] = "Followers";
skin['BORDER_COLOR'] = "transparent";
skin['ENDCAP_BG_COLOR'] = "transparent";
skin['ENDCAP_TEXT_COLOR'] = "#222222";
skin['ENDCAP_LINK_COLOR'] = "#2288bb";
skin['ALTERNATE_BG_COLOR'] = "transparent";
skin['CONTENT_BG_COLOR'] = "transparent";
skin['CONTENT_LINK_COLOR'] = "#2288bb";
skin['CONTENT_TEXT_COLOR'] = "#222222";
skin['CONTENT_SECONDARY_LINK_COLOR'] = "#2288bb";
skin['CONTENT_SECONDARY_TEXT_COLOR'] = "#999999";
skin['CONTENT_HEADLINE_COLOR'] = "#000000";
skin['FONT_FACE'] = "normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif";
google.friendconnect.container.setParentUrl("/");
google.friendconnect.container["renderMembersGadget"](
{id: "div-1yp6oi65g9ti",
height: 260,
site: "02717026770363591205",
locale: 'en' },
skin);
</script>
</div>
7. Copy code tu then korg paste dekat Notepad dulu ye. Macam ni :-
8. Lepas tu, korg bole tukar dr Template Designer ke Template Classic semula. Click SINI
9. Then korg bole lah copy and paste code dekat Notepad tadi ke dalam Blogskin korg.
10. Preview & save. Klau tak faham. Jgn segan-2 utk bertanya :)
180 comment [s]:
code tu boleh paste kat mne-2 je ke ?
@Nur Hanis ^^♥: paste dekat bahagian sidebar :)
oke terima kasihh , dah menjadi ^^
@Nur Hanis ^^♥: Most welcum ^^
ta menjadi laa. mcm mne ni ?
@eyda lha ♥: Eh ye ke? :O
betul tak copy code yg mcm tieqa bg tau tuh?
thnks atiqah :)love u la :D hehe
@Miss Fyqah: U're welcome :)
Tuto yg dicari2.. Terima kasih..
@priya darshini: Sama-sama :)
Assalamualaikum . YEZZA ! Akhirnya , menjadi jugak . Terima kasih kak sebab bagitau sy pasal tuto niy ! ^^ BERPOLUH-POLUH
@Anis Zulhas: Waalaikumsalam :)
Sama-sama, dear :)
duh tieqa, sy udah ikut tuto nya, tp gak bisa ,, bingung :(
@Ega : Memang tuto ini agak rumit..sy sendiri pon bingung. Cuba kamu ikut stepnya dengan teliti. Try again. :)
Ya Allah, Fiqah nak berterima kasih sangat-sangat pada Atiqah sebab ajar tuto ni. Haishh, dah lama tau cari cara akhirnya jumpa jugak. THANKS bebanyak ye !! :D
sekali try dah dapat. weee :3
@Nurul Syafiqah : Sama-sama fiqah :)
xjadi laa...kod xsame...cmne ek??
@firdy daus : Tak jadi ek? ermm, cuba cari code yg seakan-akan.
Saya dah cari kod tu kat dalam HTML tu tapi tak jumpa pun :(
@Nurul Sabrena : Tak jumpa ye? ermm, cuba try lagi sekali
salam...lepas dah tukar balik pada classic templete tu, kna masukkan balik ke blogskin n baru past code tu kat side bar??...kiranya sebelum tu kna copy dlu la ea blogskin yang mula2 kata tu??...harap dapat tolong...huhu
@Nur Zahirah Najwa : W'salam..yup! masukkan code tu bila da tukar ke template classic semula.better save dulu code tu dekat notepad :) hope dapat membantu :)
akak , kenape saya buat takleh ? :l
@Siti Khairunnisa : Erk, ermm mybe adik ada ter-miss beberapa code kot..cuba check balik~
akak , kite dah check . code friend connect tu takde ..
ye ke? ermm dah tambah follower widget blum, before cari code tu?
salam...dah dpt wat dah...heheh:) thanx ea gan tutorial tu.:)
@Nur Zahirah Najwa : W'salam..hehe welcome :)
thanks sangat ! :)
akak , adek dah buad mcm akk suroh tuh tapi biler search friendconnect
kat view source tuh x der pon ?
@♥ Anis : Welcome, dear :)
@Jᴜsᴛɪɴ Bɪᴇʙᴇʀ's ᴡɪғᴇ : cuba try banyak kali..mana tahu boleh :)
Akak ~ thanks sangat2 . . saya punya menjadi selepas beberapa kali try . . thanks ! :)
@Afina Yasmin : Alhamdulillah..good try, dear :)
x jumpa kod! :( ada cara ke-3 tak?
@Secret Garden : tak jumpe ek? ermm cuba godek2 code tu..sbb cara ni je yg sy tahu. sorry T_T
thanks akak :) , tuto yng berguna !
@Kiera Lee IV : U're most welcum :)
akak..nanti kalau tukar kepada templates designer tak hilangkan ke sume post ?
@pink apple : Klau template classic dia mmg akan stay. even kita tukar ke template lain..tp akak nasihatkan better kamu save dulu template tu dkt notepad. langkah berhati2 :)
alhamdulillah! gumawo. XD
@♩♫anafarhana♬♪ : nae, cheonmaneyo :)
Thanks For This Tuto Atiqah!! :)
@Nayli Izzati : U're most welcome :)
Thanks kak tieqa! jadi pun :)
kak TieQa , tak menjadi pon .
@Aira Dawson : U're welcome
@Farah Dini : eh yeke??
Untuk blogskins xda ke? :(
@Nurul Amierah Natasya : Tutor ni mmg utk blogskin :)
akk,boleh tak saya nak ltk tutor ni kat blog saya??saya akn credit akk.. :)
tutorial yg sangat berguna. thanks alot :)
Tak lepas :(
thanks . akhirnya . menjadi juga :D .
hihi ^^ . tuto yang sangat berguna .
thanks for the tuto^^
3ma kasih. Sangat berguna.
salam hmn akak asal sy buad ta menjadi ekk ? sy da ikot sume step,tapi bile sye preview x pape jadi ,hmn kosong jee :(
@All : Sama-sama. sekadar berkongsi :)
@A-Jazz : Try again :)
@fattyn : mmg mula2 dia akan jadi kosong.
dah jadi tiqah ! thanks a lotttt !!
Thanks sis . Lme da cari tuto nie .. Thanks a lot ! ^^
code yang kene cari tu takde pon :(
okay..jdi..thnkz sgtttttttttt!
@Aiesya Fendie & yayasyira : Most welcome :)
@Eyqin Asyiqin : Try again. mybe terlupa nak "add gadget" follower kot :|
salam k.ikah nape xjumpa kod tu?
saye dh copy.. tp ta tau nk paste dkt mne.. sis kte dkt sidebar.. tu yg sye ta tau dkt mner.. hope sis tolong.. apepon thanks for the tuto..
tak kua papepun bila preview ? :'(
@nur ainaa : ermm x jumpa? dah add gadget follower?
@cindrella's stepsister~ : Cuba tgk blog akak, yg section follower tu kan? ha! paste dekat bahagian tepi tu :)
@Zafiera Liyana : Mula2 dia mmg akan jadi kosong rasanya~
Salam, akak kalau nk letak dkt page (bogskin) boleh x? Balas dgn segera .. Dh balas, in4rm Lia dkt cbox Lia. ni link cbox sbb Lia privatekan blog Lia kejap.
LiaAbdillah.cbox.ws
TQVM
akak sidebar tu yang mana tak faham apa yang akak cakap dkt cinderella stepsister . sorry . harap akak jawab :D
@♥ Lia Abdillah ♥ : Sorry, dear. akak takde code tu. Cuba byk kali ok? Mula2 dia mmg kosong (?)
@Natasha Zakaria : Cuba tgk dekat blog akak. bahagian sebelah kiri. yg ada cbox, follower, credit tu. Itulah sidebar :)
code tu kena paste kat sidebar? sidebar mne ek?
@Aizan Shazlin : Tgk dekat sebelah kiri blog saya. itulah sidebar :)
use template default style ke tak ? tick bawah tu ke tak ?
akak nurul, bgmane ni, google dah tutup friend connect sejak November.. pantas je takde code "friendconnect".. ada cara lain ke??
akak!! kenape kat blog saya tak ada word "friendconnect" tuh?? walaupun hazim dah add gadget follower tuh...
akk , sy da ikut step dgn btul tp yg kluar cuma sidebar dy jak . yg google connect xdaa :(
alhamdulillah, bisaaaaaa.. terima kasih sangat-sangat pada akak Atiqah.. ^^
@Natasha Zakaria : Tak payah~
@Hazim Zamri : Ada..cuba cari lagi sekali. :)
@Nchie Sri Dewi : Alhamdulillah.jadi ea? :) sama-sama ^^
akak!! dah buat banyak kali!!! dah buat kat mozilla, kat google chrome, sume dah...
Thankyou^^ mmg mujarob! hehe
AAAaaaah ! Akak, dlm byk2 tuto akak punya jadi ! Tengs very much kak ! Sayamm akak :*
Huhuhu, tak jadi la kak
@Hazim Zamri : Tak jadi? ermm.klau nak akak tlong buatkan. just PM nt.
@Naz : U're welcome..hehe :)
@♥ Lia Abdillah ♥ : Alhamdulillah. sekadar share. welcome :)
@Hani Qamaliah : Tak jadi? cuba lagi. if still sama. just PM akak :)
yeaay ! alhamdulillah . b'kali-2 saya cuba . akhirnya dpt juga T^T . terima ksih yaa kak tieqa sbb buat tuto ni :D
@Dayang .N.H : Alhamdulillah :) Sama-sama ^^
Menjadiii! thankss..
Salam . Akak . Nakpastekat mane ek ?
kita dah tambah gadget follower tu , tapi tak ada jugak coding "friendconnect" tu .
akak, napa jdi kosong je? cmna nk bgi dia nmpak?
@shasha qilah : U're welcome ^^
@Marha Safwah Amni : Waalaikumussalam
paste je dekat mana2. tak kisah :)
@Eyqin Asyiqin : Eh mcm mana boleh xde? cuba cari btul2.
@Cat Lovers : Ada tertinggal mana2 code kot. cuba check balik.
thx akak! jdilah :D
X jdi.. haha :'(
assalamualaikum sys atiqah ! thanks a lot for the tutorial . now , my blog is perfect . Dont forget follow my blog yahh :)mwuah :*
Thanks kak tiqa :D
tetap tak jadi . dah cuba banyak kali :(
Datang dengan terima kasih, saya lupa memasang widget penting ini
Yes! Jadi ! Terima kasih :)
thanks! tuto yg sgt berguna~ :)
kenapa saya buat tak boleh ? boleh tak atiqah ajar saya ataupun buat kan untuk saya ? nehh link blog saya . saya takut tak perasan comment atiqah
http://fatinsaffron.blogspot.com/
@All : U're welcome :) Bagi yang tak menjadi cuba lagi. Tutor ni kena cuba byk kali baru jadi.
@Cik Keding Senget : Cuba lagi~ klau nak sy buatkan, boleh PM sy dekat fb :)
Saya punya tak bolehlah , unnie . Saya dah ikut semua tuto tuu . Tapi kenapa saya tak boleh . Boleh unnie tolong ??
Assalamualaikum, tieqa. Akak baru tukar balik template designer pada classic. Lepastu, cuba tuto ni and tak jadi. Macam mana ea?
akak, sekarang dah tak ada'friendconnect' cuma ada 'google+followers', so code dia macam mana erk? tolong saye
Asal tak boleh cari code friendconnect ?
Rasa nak nangis ! Jadi ! Omo ! Gomawopta Unnie :D
jadi jadi jadi!! thank you very much!
Alhamdulillah menjadi Tieqa.. thanks! Dah lama bhah cari pasal follower widget nih tp blog tuto org lain bhah xfaham.. bila tgk yg tieqa buat mudah sgt! vote for you!! Hehehe
hye awak2 !!! thanks sangat2 sbb tuto awak sgt2 membantu ....thnx yea... :)
follower widget pun xde...google+ widget je..same ke ek?
KAK.. yaya guna macbook... kenapa ta boleh nak bukak source page tu, hmm i need your help kak...
KAK.. yaya guna macbook... kenapa ta boleh nak bukak source page tu, hmm i need your help kak...
KAK.. yaya guna macbook... kenapa ta boleh nak bukak source page tu, hmm i need your help kak...
hyee .. sy nakk tyee . sy punyee blog tak dapat lahh nak buat widget tuhh . tolong sy bole .
due tige burung terbang...
mcam mne la pantun ni..
hehehe..
thank' for 'ur tutorial..
http://theyasa.blogspot.com
comment back.. :))
Assalamualaikum,kak mcm mne kak letak tu de box ?
Kepada yang bertanya, kenapa code followers tu tak jumpa. Sebenarnya follower widget mmg dah takde skrang & digantikan dengan google + T.T
Assalamualaikum , mcm mana nak buat eh ? takleh pon please tolong :(
ayinzpunyablog.blogspot.com
memang jadi la thnx :D hehe..come n c my blog..
jadi jugak..tq 4 da info..tq
da folow dah :D
Akhirnye ! Jumpe jgak Tuto ni ! dh lame nada cari :3 Thx for the tuto ! ^_^
kan kena paste kat blogskin kan.nak paste dekat bahagian mana?
Assalamualaikum kak :) terima kasih atas tutorialnya ^^ menjadii! hihi. mula-2 tak jadi, bila dah check betul-2 baru jadii. Hehee. Thanks a lot sis! :)
Kenapa tak boleh cari code friendconnect tu.Teringin nak buat...
dah dpt.. gomawo chigu~ :D
salam perkenalan :)
alhamdulillah..... akhirnya menjadi juga... terima kasih..:D
alhamdulillah... menjadi juga,,, terima kasih.. :D
wah dah jdi :)
tq!
thanks .. menjadi :)
nak paste dekat bahagian mne? bagi code dy
x menjadi.. dh cube dh
@Nurul Atiqah Atikah ! Kenapa tak menjadi??????????
x pa dah jadi! trima kasih bnykx2 ya! ^^
@QistinaWehh Tak jadi? ._. cuba lagi. agak rumit sikit tutor ni :/
Boleh tolong buatkan widget niy tk? Sebab dahh buat banyak kali tp tk jadi :/
@Xiaura ElLallyn PM me :)
Bagi yg tak menjadi tu. awak cuba byak kali ye. tutor ni rumit sikit -.-
jadi puuun^^ tengkyuuuuuuu
Kalau friendconnect tak ada nak search apa? Compius ! Dah try tapi cara follow di lain la. Pening guna yg tu :( Help me kak tiqa !
Kamsahamnida for this awesome tuto ! Very love itttt <3 Easy to follow too :D
Thank You Kak :)
yeay..jadi..thank ye :)
@Nurul Atiqah
x faham.. sidebar kat mna kak? pstu,xtau nak paste kat mna..
@Cassa Land Sidebar dekat bahagian kanan or kiri blog kita. paste dekat situ.
Akak, Syahmi buat jad. Cuma icon edit edit tu sentiasa ada. Memang macam tu ke? Follow and visit my blog xoxosupporter.blogspot.com
@syahmi arieb Yup memang macam tu. okay :3
Yeay!menjadi!!
Thanks a lot,Kak Tiqah.terhutang budi la plak.hihi
menjadi, tengs :)
kakak napa x jadi ....dia jadi mcm ni
We're sorry...
This gadget is configured incorrectly. Webmaster hint: Please ensure that "Friend Connect Settings - Home URL" matches the URL of this site.
Boleh x akak tolng .....
@nurul alfira nasir Rasanya code gadget tu salah. cuma check semula ;
@Nurul Atiqah
Akak macam mn nk paste kat sidebar? ='(
@Nurul AtiqahDah jadi akak :) Tersilap copy. Sorry :( Papepun, Thanks!
akak sya copy ye tuto ni nanti sayay credit
tak jadi la kak . dah banyak kali try ,
Bagi yg tak jadi tu, cuba byak kali ye, maybe ada code yg terkurang. cuba check balik :)
kalau tak jumpa kod friendconnect tu mcm mna??
kalau nak private bilangan follower boleh kan? boleh buat tuto?
tak jadi punnn! dia tak keluar dkt sidebar T__T
mcm mne nk paste balik kat template tu sye x reti la..
mohon share this tuto
macam mana nak paste kat side bar tu..xpaham..boleh wat tuto x sal tu..kod yang dah simpan kat notepad tu dah ada cuma part nak paste kat side bar tu yang xpaham..salah paste..blogskin xkeluar.
@Norin Dayu : Awak cari keyword utk sidebar. contohnya "owner". carilah code owner. Ouh, cuba awak save. kalau preview mmg sometimes tak keluar kotak followers tu ;
Salam . Thanks for the tutorial XD . Menjadi :)
ok done! thanks.. err one more, macam mana nk wat komen yg ada gmbar profil pengomen ni?
@Ummu Haseena : Here http://nurulatiqahjaidin.blogspot.com/2013/08/tutorial-comment-box.html
Assalamualaikum atiqah :) kita cuba banyak kali . tetap tak boleh kenapa ya ?
aineddihar.blogspot.com
balas komen dekat kotak chat blog kita (BORAK SINI) . .
akak,saya punya dia kata Followers list is private. Camne nak unprivate?
Akak. X menjdi. Bleh tlong buatkan x ?
I'm glad that I refer your tutorial XDD
mula2 dah siap dah suma dah follow macam Tiqah cakap, pastu preview alamak dia tak dak lak, pakai html editor dya cakap gadget tak betul lak, pastu belek lah komen kat blog Tiqah.. baru jumpak solution :D Thank anyway ^__^
Kak , tak menjadi punn . Tak keluar apa apa pun . Sedihhhh
thanks sis. akhirnyaaaa tuto sis jugak yg paling senang berbanding yg lain. muah ciked.
Akak nape tak boleh?Dia Jadi Camni Ni"We're sorry...
This gadget is configured incorrectly. Webmaster hint: Please ensure that "Friend Connect Settings - Home URL" matches the URL of this site."
Camne akak?Harap Akak boleh Tolong..
tq for sharing info
http://dreemikastore.blogspot.com/
tq for sharing info
http://dreemikastore.blogspot.com/
Thanks so much, Kak Tiqah! (^_^)
Kak.. dekat saya xdop pun add a gadget followers?? Dh gne ni?? Nk ngt ltok bnde ni.. sebab rmai ye hntr chat kbo follow dh follow dh. Tgk kt blogger.com sama je, 1 follower je, tu pun hk lma dh. Tlong!!!!!!
betul ke akan ade code 'frienconnect'? search 'fri' dh x ada
excuse me, fatin nabila komentar kamu kenapa masuk ke email saya?
della dian, x tahu.. sorry laa klo trmasuk..
Akak , code friendconnect tu takde la . Kenapa ek ?
awak boleh tlg buatkan untuk kite tak ? dah try tapi xjmpe friend connect :( plis2 , kalau boley wssp kite ek . 01129227772
cantik blog ni...jom become friend and follower.. visit blog saya yer..baru lg..xde kawan...tunjuk ajarku sifu.. =)
http://southpawska.blogspot.my/
Thank you for this tuto . Amat membantu :D
Post a Comment