Cara Lengkap Menciptakan Template Blogger Sendiri [Bagian 3]
![Cara Lengkap Membuat Template Blogger Sendiri Cara Lengkap Membuat Template Blogger Sendiri [Bagian 3]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnvHDDl8k09SrFQbrCtSYdt7E9OSOth-reVjJvOQnL7SN24VGWnum18G-7RrE6pOcxVwRSueX2BtvTO2TOMjKsuNJD1cuiJNhEAgVHi0gZb_cC2NDpwe3Gp83fQCAMMLHsEzi87heCLLKw/s640/writing+photography.jpg "Cara Lengkap Membuat Template Blogger Sendiri [Bagian 3]")
Dalam posting kali ini saya akan melanjutkan pembahasan dari Cara Lengkap Membuat Template Blogger Sendiri [Bagian 1] dan Cara Lengkap Membuat Template Blogger Sendiri [Bagian 2]. Pada posting seri ketiga ini saya mungkin akan membahas lebih singkat dari yang sebelumnya lantaran poin pembahasannya ialah menciptakan adaptasi sebelum mengatur tampilan template blog memakai CSS, jadi disini kita belum memakai CSS.
Penyesuaian yang kita perlukan disini ialah membungkus seluruh section dan bagian-bagian utama dalam tag tertentu, contohnya kita memakai tag
<div>. Makara sections yang telah kita buat ditempatkan dalam tag tertentu kemudian kita beri nilai ID untuk tag tersebut yang akan kita gunakan untuk mengaturnya nanti dalam isyarat CSS. Kode terakhir yang telah kita buat adalah.<body> <b:section id='Header' maxwidget='1' showaddelement='no'> <b:widget id='Header1' locked='true' title='Koala Kumal (Header)' type='Header' version='1' visible='true'> <!-- TERDAPAT KODE PANJANG DISINI --> </b:widget> </b:section> <nav id='navmenu'> <ul id='menu'> <li><a href='#'>Home</a></li> <li><a href='#'>About</a></li> <li><a href='#'>Sitemap</a></li> <li><a href='#'>Contact</a></li> </ul> </nav> <b:section class='main' id='Posting' showaddelement='no'> <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog' version='1' visible='true'> <!-- TERDAPAT KODE PANJANG DISINI --> </b:widget> </b:section> <b:section id='Sidebar'/> <b:section id='Footer'/> <!-- COPYRIGHT JIKA PERLU --> </body>Pertama kita letakkan header dan menu dalam satu tag. Tuliskan isyarat <div id='header-wrapper'> diatas section header dan beri epilog </div> dibawah epilog </nav>. Makara isyarat pada bab tersebut akan menjadi.
<body> <div id='header-wrapper'> <b:section id='Header' maxwidget='1' showaddelement='no'> ... </b:section> <nav id='navmenu'> ... </nav> </div> ... </body>Kemudian selanjutnya bungkus pula section posting dengan
div dan beri ID main-wrapper, kemudian lanjut ke sidebar (sidebar-wrapper) dan footer (footer-wrapper). Sehingga isyarat final yang kita miliki hingga ketika ini menjadi ibarat berikut.<body> <div id='header-wrapper'> <b:section id='Header' maxwidget='1' showaddelement='no'> ... </b:section> <nav id='navmenu'> ... </nav> </div> <div id='main-wrapper'> <b:section class='main' id='Posting' showaddelement='no'> ... </b:section> </div> <div id='sidebar-wrapper'> <b:section id='Sidebar'/> </div> <div id='footer-wrapper'> <b:section id='Footer'/> <!-- COPYRIGHT JIKA PERLU --> </div> </body>Selebihnya kalau teman merasa perlu membungkus lagi bagian-bagian yang lebih kecil teman dapat melakukannya dengan memberi nilai ID yang berbeda. Dengan begini teman sudah siap melangkah ke tahap mengatur tampilannya dengan memakai CSS lantaran adaptasi yang saya maksud telah selesai dilakukan. Namun perlu teman ingat, kalau nantinya diharapkan proteksi adaptasi lagi mungkin tag
div dapat ditambah ditengah jalan tergantung kebutuhan. Silakan baca lanjutannya pada Cara Lengkap Membuat Template Blogger Sendiri [Bagian 4].Mungkin cukup sekian dari saya, biar dapat bermanfaat, kalau ada yang ingin teman tanyakan silakan sampaikan pada kotak komentar yang ada dibawah atau dapat juga melalui halaman contact blog ini. Terima kasih.
