TUTORIAL - TABBER WIDGET | norsheilasalleh.blogspot.com

TUTORIAL - TABBER WIDGET

Assalamualaikum...
Credit buat Syida yang sudi memberi tunjuk ajar dekat aku. hehe. thanks again dear. So harini aku berhasil untuk share dengan korang tutorial nak buat tabber widget. Berkurun lama aku cuba follow tutorial orang yang handal-handal. Ternyata aku gagal. hahaha. Nasib baik syida ni baikkkk orangnya tau (^____^)
sheila shahfiekry
* Layout >> Add a gadget >> copy kod dibawah ini
* tabCount : 3 , adalah sebanyak mana korang nak tambah widget kat situ.

<style type="text/css">
    .tabber {
     padding: 0px !important;
     border: 0 solid #bbb !important;
    }
    .tabber h2 {
     float: left;
     margin: 0 1px 0 0;
     font-size: 12px;
     padding: 3px 5px;
     border: 1px solid #bbb;
     margin-bottom: -1px; /*--Pull tab down 1px--*/
     overflow: hidden;
     position: relative;
     background: #E3F3E9;
     cursor:pointer;
    }
    html .tabber h2.active {
     background: #fff;
     border-bottom: 1px solid #fff; /*--"Connect" active tab to its content--*/
    }
    .tabber .widget-content {
     border: 1px solid #bbb;
     padding: 10px;
background: #fffffff;
     clear:both;
     margin:0;
    }
    .codewidget, #codeholder {
     display:none;
    }
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
     $('#codeholder').bloggerTabber ({
      tabCount : 3
     });
    });
    </script>
    <!-- to make sure the widget works, do not alter the code below -->
<div id='codeholder'><p>Get this <a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank">tabber widget</a></p></div>

Macam contoh yang aku buat, tabCount tu aku bubuh 3 je. So kita kena drag 3 widget yang nak digabungkan contohnya : followers + bloglist + top commentator. Make sure preview dulu baru save okey. Kalau tak menjadi tanya aku ataupun Cik Syida ya :)

24 comments

May 6, 2013 at 11:05 AM

ala pandainya. mmg failed la akak kalau bab coding2 ni. hahaha! thanks for sharing anyway!

May 6, 2013 at 11:10 AM

heee my pleasure kak suria. hihihi. kita pun tak reti gak. orang yang buatkan. kita sharing je :)

May 6, 2013 at 1:25 PM

akak failed pastu suruh org buatkan..tapi hasil nye memuaskan hehehe tak puaeh hati lagi

May 6, 2013 at 1:32 PM

hehehe chaiyok2 kak. hehe. sheila pun tak puas hati kalau takleh nak buat sendiri. hee3

May 6, 2013 at 4:07 PM

salam, aina menang satu GA and aina dapat review dari akak . ni link blog yang aina menang, blogmenang.blogspot.com . akak tolong tukar and review blog ni eh http://kisahgadisketawa.blogspot.com/ :) thanks :)

May 6, 2013 at 4:18 PM

salam aina. nantikan review hari jumaat ni keluar ye. insyallah, akak akan komen sikit mana yang aina perlu ubah ye. btw, aina nak akak review blog aina yang lagi satu ek? okey dear :)

May 6, 2013 at 4:35 PM

ida buat ni tapi untuk post archive jee.. sbb banyak nau post. hehehhee

May 6, 2013 at 5:15 PM

hahahha orang rajin update blog kan ;p

May 6, 2013 at 6:44 PM

Wowww

Anonymous
May 6, 2013 at 8:05 PM

tahniah n tq for sharing

May 6, 2013 at 9:35 PM

Thanks for sharing ye..akan di cuba bila lisa bkak letop nnti..hee..menarikkk..

May 7, 2013 at 12:54 AM

wah nak kena coba ni

May 7, 2013 at 10:03 AM

heeee :)

May 7, 2013 at 10:03 AM

thank you ahmad afiq :)

May 7, 2013 at 10:08 AM

my pleasure lisa sheila. hahahha. kalau menjadi bagitau ye. hihiihi :)

May 7, 2013 at 10:13 AM

aik? bukan mak dah pernah buat ke tabber widget ni? hehehe

Anonymous
May 7, 2013 at 12:36 PM

tq share yer dik!

May 7, 2013 at 12:48 PM

my pleasure KA, hee :D

May 8, 2013 at 10:50 AM

thank u sheila. dulu namee nk buat tapi ikut tutorial tak jadi jeee. pastu give up ! hehe. blog namee buruk kemain skang. taktahu nak buat apa dah. hehe

May 8, 2013 at 10:54 AM

my pleasure namee sayang! heee. tk jadi mungkin sebab blog banyak bertukar2 editing kot. kalau namee nak cuba buat, sheila ada buat banyak tutorial. cer cuba dulu. blog awak tak buruk la cuma tak kemas je. hehehe ;p

May 9, 2013 at 10:03 AM

terus terang akak cakap, biasanya bab2 ni akak selalu tak menjadi. sobs.

May 9, 2013 at 10:06 AM

hahahahah buat slow2 kak maria. insyallah boleh punya. jangan give up ya :)

July 14, 2013 at 11:49 AM

kalau untuk blogskin memang tak boleh eh ?

September 30, 2013 at 5:33 PM

tak boleh pun yang :(

Post a Comment