Cara tambah dua column di sidebar
Tuesday, November 3, 2009
Tutorial ini akan menunjukkan cara bagi menghasilkan dua lagi column di bahagian sidebar di blog korang samaada sebelah kiri atau kanan bergantung kepada template yang korang gunakan. dengan menghasilkan column baru di bahagian sidebar, ia akan mencantikan lagi blog dan mewujudkan pilihan baru bagi meletakkan widget agar ia bersesuaian dengan saiz widget tersebut. sila ikuti beberapa langkah mudah dibawah ini.
1.Log in ke dashboard blog korang--> Design- -> Edit HTML
2.Cari kod dibawah ini, tekan Ctrl+F pada keyboard komputer dan paste kod dibawah. cukuplah sekadar paste kod <div id='sidebar-wrapper'> sahaja.
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Feed2' locked='false' title='Recent Posts' type='Feed'/>
<b:widget id='Label99' locked='false' title='Labels' type='Label'/>
</b:section>
</div>
3.Sekarang tambahkan kod merah dibawah diantara </b:section>dan </div> .
<b:section class='sidebar' id='magazine-left4' showaddelement='yes'>
<b:widget id='Text514' locked='false' title='Column 1' type='Text'/>
</b:section>
<b:section class='sidebar' id='magazine-right4' showaddelement='yes'>
<b:widget id='Text524' locked='false' title='Column 2' type='Text'/>
</b:section>
<div style="clear: both;"></div>
Lihat gambar di bawah ini sebagai contoh.
4.Selepas itu Tekan lagi Ctrl+F dan taipkan kod dibawah.
4.Selepas itu Tekan lagi Ctrl+F dan taipkan kod dibawah.
]]></b:skin>
5.Tambahkan kod biru dibawah atau paste sebelum kod ]]></b:skin> tadi.
#magazine-left4 {
width: 49%;
float: left;
}
#magazine-right4 {
width: 49%;
float: right;
}
Nota : Korang boleh menukar lebar saiz column bergantung kepada pilihan korang.
width: 49%; = lebar column
6.Tekan save template korang. korang sudah selesai dan ia akan terlihat seperti ini.
width: 49%; = lebar column
6.Tekan save template korang. korang sudah selesai dan ia akan terlihat seperti ini.
0 comments:
Post a Comment