Salam
Hari ni ada orang tanya tutorial cara nak gabungkan widget ni.
Actually semalam bloglist-II uzu, uzu gabungkan jadi 1 tempat supaya jimat ruang.
Thanks to Shida Radzuan sebab sudi tolong uzu gabungkan widget tu.
Yang ni uzu nak ajar korang lah camne buat tutorial gabungkan widget pada yang belum tahu.
sebab uzu baru faham camne nak buat. Hehe
1. Dashboard --> Layout --> Add a Gadjet --> Html
Sediakan dahulu gadjet-II yang nak di gabungkan. Contoh , uzu nak gabung 3 bloglist, so uzu dah ready siap-II ketiga-II bloglist ni .
2. Copy code kat bawah ni dan paste ke ruangan Html.
<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: #ffffff;
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>
4. Susun code kat atas ni, pastikan code atas ni berada di atas widget yang korang nak gabung.
Contoh, uzu nak gabung ketiga-II bloglist uzu, so uzu dah letak siap-II bloglist yang nak di gabung kat bawah ni . Yang uzu kaler merah kat bawah ni lah yang kita kena susun di atas gadjet-II yang nak di gabung.
Yang code banyak-II yang korang copy paste td, susun di atas, macam uzu susun kat atas ni.
bloglist yang nak di gabung berada kat bawah code tadi.
5. Tukarkan :
code ni background: #ffffff; kepada code warna background tab tu,
yang ni background: #fffffff; kepada warna sidebar korang
and last sekali tukar yang ni tabCount : 3 untuk jumlah tab yang korang nak gabung.
note :
Bila korang nak 4 widget digabung, bila code gabung widget di susun di layout,
dengan automatik gadjet akan secara automatik menggabungkan apa sahaja gadjet-II yang berada di bawah code tersebut dengan sendirinya sehingga tergabungkannya 4 gadjet.
tu sebab, if korang xnak keliru, sila sediakan gadjet-II yang korang nak gabung sebelum susun code kat atas tu.
Uzu pun xtaw camne nak explain. Fuhh pening jugak nak explain.
Anyone yang tak faham boleh tanya uzu eh kat facebook.
Thanks for reading.Salam
credit to : Shida Radzuan
22 Sila Komen:
Memang nak sesangat tahu... tqvm Uzu :)
thanks for sharing kak uzu :)
http://nurfaezahabdullah1712.blogspot.com/
Thanc sharing uzu :)
dah jadi :)
thanks sharing..tp ermmmmm mcm susah jer.
thanks for tutorial...... nice
bgus tutorial ni..penh tgk kat shida punyer
sy pun pening2 lalat gak nak memahamkannya. haha...
4 Kali baca baghu akak paham dik... haha... maklumle... pelajar tua... kiki terima kasih bebanyak ya Uzu coz wat tutor yg memang dh lm akak cari ni :)
ala..ala..ala.. tak sama cantik macam shida punya dengan uzu punya :P mohon shida buatkan untuk aida.. huwaaaaa.. haha
thanks awk. sy paham pe yg diajar...
nice ^_^
dah buat and menjadi !! thankyouu
senangnya tuto ni
kena cuba ni
dah banyak kali try,tapi tak jadik..:'(
thanks dear for the sharing :)
Dah jadi..Thanks for the tutorial :)
dah jumpa tutorial awesome ni. da lma cari.. tq2..
Alamak... Tak jadi laaaaa.... =(
almost done :) btw, thankyouu
pening. tk tau nak buat macam mana :'(
Ala.. dah try wat banyak kali tapi tak jadi. Sedeyy..:'(
Post a comment