Kali ini saya akan melanjutkan Tutorial Cara Membuat Template Blogger Sendiri Part 1 yang sebelumnya sudah saya pulikasikan sekarang kita lanjutkan dengan Tutorial Memasang Main Wrapper dan juga Sidebar.
Ok, langsung saja praktekan tutorial dibawah ini.
Pertama, kita buat terlebih dahulu kode CSSnya agar terlihat tamvan nantinya, Gunakan kode berikut jika ingin lebih Praktis dan letakan sebelum kode ]]></b:skin> atau </style>.
CSS untuk Main Wrapper
CSS untuk Siebar Wrapper
Kedua, pasang kode HTML Main Wrapper untuk memanggi kode CSS Main Wrapper yang telah kita buat.
1. Pasang Kode dibawah ini diatas<b:section class='main' id='main'> atau dibawah <div id='wrapper'>.
2. Pasang Kode dibawah ini diatas</div> penutup dari kode <div id='wrapper'> atau dibawah </b:section> penutup dari kode <b:section class='main' id='main'>.
Ketiga, pasang kode HTML Sidebar Wrapper untuk memanggil kode CSS Sidebar Wrapper yang telah kita buat.
Pasang Kode dibawah ini di atas</div> penutup dari kode <div id='wrapper'> atau dibawah </aside> penutup dari kode <aside id='main-wrapper'>.
Nah, Kalau sudah simpan template dan coba buat satu widget, caranya : buka menu Tata letak lalu buat widget di gadget sidebar setelah itu save dan lihat hasilnya.
Sampai disini dulu ya kita lanjutkan di Part berikutnya, sekian semoga bermanfaat.Deny Listianto
Ok, langsung saja praktekan tutorial dibawah ini.
Cara Membuat Template Blogger Sendiri Part 2
Pertama, kita buat terlebih dahulu kode CSSnya agar terlihat tamvan nantinya, Gunakan kode berikut jika ingin lebih Praktis dan letakan sebelum kode ]]></b:skin> atau </style>.
CSS untuk Main Wrapper
/* Main Wrapper */
#main-wrapper{float:left;width:65.5%;overflow:hidden}
CSS untuk Siebar Wrapper
/* Sidebar Wrapper */
#sidebar-wrapper{float:right;width:34.5%;overflow:hidden}
#sidebar{padding:0 0 0 12px}
.sidebar h2,.sidebar h3{font-weight:700;overflow:hidden;position:relative;color:#222;padding:10px 0;margin:0 0 10px 0;text-transform:uppercase;display:block;border-bottom:1px solid rgba(0,0,0,0.05);letter-spacing:.5px;font-size:17px}
Kedua, pasang kode HTML Main Wrapper untuk memanggi kode CSS Main Wrapper yang telah kita buat.
1. Pasang Kode dibawah ini diatas<b:section class='main' id='main'> atau dibawah <div id='wrapper'>.
<aside id='main-wrapper'>
2. Pasang Kode dibawah ini diatas</div> penutup dari kode <div id='wrapper'> atau dibawah </b:section> penutup dari kode <b:section class='main' id='main'>.
</aside>
Ketiga, pasang kode HTML Sidebar Wrapper untuk memanggil kode CSS Sidebar Wrapper yang telah kita buat.
Pasang Kode dibawah ini di atas</div> penutup dari kode <div id='wrapper'> atau dibawah </aside> penutup dari kode <aside id='main-wrapper'>.
<aside id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' showaddelement='yes'>
</b:section>
</aside>
Nah, Kalau sudah simpan template dan coba buat satu widget, caranya : buka menu Tata letak lalu buat widget di gadget sidebar setelah itu save dan lihat hasilnya.
Sampai disini dulu ya kita lanjutkan di Part berikutnya, sekian semoga bermanfaat.Deny Listianto
