Sunday, August 12, 2012

Tutorial : Add Follower Widget New Ver (Blogskin)

Tumblr_m8lqfivtwx1qbc0uoo1_500_large
Tuto yang ini atin nak ajar korg cara utk tambah follower widget bagi pengguna blogskin. Sebab blogskin selalunye guna button an? Tapi maaf lah . atin dah tak boleh follow guna button :( . Tuto ni memang ramai yang request . tapi time tu busy sgt2 LOL >< . Kadang2 tu sampai lupa nak buat huhu . Oklah Jom mula

Example
Ok masa tu , berapa tahun dah ekk . ada yang buat tuto  Add Follower Widget an? tapi cara dulu guna google friend connect an? tapi dah lapok . Dah tak boleh guna . tu yang org bengang tu --' . Untuk cara baru ikut step atin buat k


1. Mula2 korang kne tukar dari Template Classic/Blogskin ke Template Designer . Tak tahu ? ikut tuto kat SINI

2.  Dah? next korg pergi ke Dashboard > Design > Edit layout


3. Kemudian, korg add gadget follower. Kalau dah ada tak yah buat . Bagi yang takde tu korg click Add Gadget.



 4. Lepas korang dah tambah followers . Korang terus je save . Tengok bawah ni :


5. Dah siap? OK next step  tekan Ctrl+ u serentak untuk view page source. Nanti akan keluar page source yang banyak kod HTML tu kan? Banyak code? OMG ><
Haha jangan peduli lah . Korang just click Ctrl+f  dan cari code friendconnect


6. Nampak kan yang ada highlight oren tu? Ok kalau dah jumpa korang nampak yang atin line kan tu? ada kat bawah warna merah tu.. Dah nampak? OK start situ korang copy .. Wait?



WARNING
JANGAN COPY CODE INI. SEBAB SETIAP BLOG ADA CODE YANG TERSENDIRI. 
YANG INI CODE UNTUK FOLLOWER BLOG ATIN SAHAJA.

Copy code mula dari yg atin line tu :

 <script type="text/javascript"> 
sehingga 
locale: 'en'}, skin); </script></div>

Tak tahu? korang boleh tgk code yg atin punye ni . Just scroll ke bawah


<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/4949628771204580317/posts/default";
         
         
         
            holder.commentFeed = "http://www.blogger.com/feeds/4949628771204580317/comments/default";
         
          holder.currentBlogUrl = "http://fatinhalid.blogspot.com/";
          holder.currentBlogId = "4949628771204580317";
       
        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-dggn4nsajf2t" 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-dggn4nsajf2t",
     height: 260,
   
   
   
     site: "17088071973553619268",
   
     locale: 'en' },
     skin);
  </script>
</div>

7. Copy code tu then korg paste dekat Notepad dulu ye.

8. Lepas tu, korg bole tukar dari Template Designer ke Template Classic semula. Ikut tuto SINI

9. Dah selesai tukar? so! korg bole lah copy and paste code dekat Notepad tadi ke dalam Blogskin korg.

10. Preview & save.

Dah siap !!! Cuba lah . 


20 comments:

nis said...

nak request header eunhae boleh? warna header tu warna pink cair + warna biru cair .. Boleh?? ni nisha .. cube try tgk blog baru nis ^^

http://sjelfworld.blogspot.com/

harap boleh bwatkan.. ^^

nis dah hantar kt awk punye kotak request try tgk..

NurulArissa (: said...

Thanks Kak Atin :D

Atin Tory said...

@NurulArissa : hihi ur welcome dear :D . harap dear punye menjadi k ^^

Pink PlatypuS ^^ said...

Atin, boleh x buatkan 'button followers' ni tok blog sye ? TT plsssssssssssssssss :(

♥工レoV乇ㄚ◯∪ ♥ said...

akak npe sye cari friendconnect tu xjumpe yer ??? bnyk kali dah cube...hhmmm pening lah...give up lah mcm niy ^.^

Atin Tory said...

@♥工レoV乇ㄚ◯∪ ♥ : lol? x jumpe2 gak? hmmm xkan dh tukar kot ..

Lina Lyn said...

Lyn ambik blogskin Atin Sweet Sweet Sorrow tu ye...cantik dan kemas. Terima kasih.

Atin Tory said...

@Lina Lyn : guna jgn x guna. my1st skin tu hihi... sama-sama :D

azifah yazid said...

tak jadi la awak

Atin Tory said...

@azifah yazid : ikut cara ke-2 punye kat sini

http://fatinhalid.blogspot.com/2012/12/tutorial-add-follower-widget-new-ver-2.html

nadiah mazli said...

atin,nk letak kt bwh skali ke kod tu?

Atin Tory said...

@nadiah mazli : letak code? dah copy code masuk dalm note.. then pergi kat template , boh bahagian sideber

nadiah mazli said...

sidebar?

nadiah mazli said...

atin,sye x pndai la..atin tlg buatkn boleh?nnty sye bg emel n password

Atin Tory said...

@@nadiah mazli : hmm bg kat msg fanpage atin..nnti atin cube try

Miss Namstar ^^ said...

atin,, nak paste kat mne nie?? sidebar yg mne?? bhgian code mne??

Atin Tory said...

@Miss Namstar : kat sdeber x tau ke? yg bhgian tepi sebelah line mcm atin punye ni la..

Yana Nana said...

atin..tolong buatkan boleh tak...kakak tak pandai la...please...kita bagi email ngan pasword kita ye

Mrs. Wordy said...

thank you so much hunn :)

Byun EXOstan said...

sye punye x dpt buat la..