Selasa, 19 Februari 2013
Kali ini saya akan share Cara Buat 2 Kolom Di Bawah Sidebar pada Blog. Contohnya bisa diliat diatas ^^.
Oke langsung saja yah :
>> Login akun blogger anda
>> Pilih Template > Edit HTML
>> Cari kode dibawah ini ( CTRL+F biar cepat )
#sidebar-wrapper
#sidebar-kiri { background-image: -moz-linear-gradient(bottom, rgb(25,25,25) 20%, rgb(41,41,41) 62%); background-image: -webkit-linear-gradient(bottom, rgb(25,25,25) 20%, rgb(41,41,41) 62%); border-radius:10px; box-shadow: 0 0 3px #191919; width:110px; float:left; word-wrap:break-word; overflow:hidden; margin-left:10px; margin-top:15px; padding-left:10px; padding-right:10px; font-family: 'Advent Pro', sans-serif; }
#sidebar-kanan { background-image: -moz-linear-gradient(bottom, rgb(25,25,25) 20%, rgb(41,41,41) 62%); background-image: -webkit-linear-gradient(bottom, rgb(25,25,25) 20%, rgb(41,41,41) 62%); border-radius:10px; box-shadow: 0 0 3px #191919; width:160px; float:right; word-wrap:break-word; overflow:hidden; margin-right:10px; margin-top:15px; padding-left:10px; padding-right:10px; font-family: 'Advent Pro', sans-serif; }
>> Selanjutnya Copy kode dibawah ini :
<b:section class='sidebar' id='sidebar-kiri' preferred='yes'>
</b:section>
<b:section class='sidebar' id='sidebar-kanan' preferred='yes'>
</b:section>
>> Lalu cari kode yang mirip seperti dibawah ini :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='BlogList1' locked='false' title='[ Blogroll ]' type='BlogList'/>
<b:widget id='HTML11' locked='false' title='[ Partner ]' type='HTML'/>
<b:widget id='HTML2' locked='false' title='[ Site Info ]' type='HTML'/>
</b:section>
</div>
Jika sudah ketemu kode yang mirip seperti diatas. lalu pastekan Kode yang tadi diantara kode
</b:section>
</div>
>> Sehingga hasilnya nanti akan seperti dibawah ini
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='BlogList1' locked='false' title='[ Blogroll ]' type='BlogList'/>
<b:widget id='HTML11' locked='false' title='[ Partner ]' type='HTML'/>
<b:widget id='HTML2' locked='false' title='[ Site Info ]' type='HTML'/>
</b:section>
<b:section class='sidebar' id='sidebar-kiri' preferred='yes'>
</b:section>
<b:section class='sidebar' id='sidebar-kanan' preferred='yes'>
</b:section> </div>
Klik Simpan/Save
NB :
Kalian bisa ganti background, border atau yang lainnya
sumber
