Cara Membuat Wrapper dan Body di Blogger

Tor Template, Cara Membuat Wrapper dan Body di Blogger - Wrapper merupakan bagian paling luar dari kode html, dan ini paling utama yang harus ada karena wrapper digunakan untuk menentukan tinggi lebar suatu template blog. Wrapper biasanya membungkus bagian header, content/main, sidebar, dan footer. Sedangkan body akan menentukan bagian keseluruhan dari isi blog.

Jika sobat sudah memiliki kerangka template, langkah selanjutnya untuk membuat template blog yaitu membuat wrapper dan body dengan cara :

1. Pertama login dulu ke akun blogger sobat. Jika sudah masuk Dashbord => Template => Edit HTML.
2. Pasang kode css untuk tata letak berikut di atas */]]></b:skin> :

   #wrapper{width: 860px;margin: 0 auto;background: #fff;overflow:hidden}

3. Copy kode css berikut di atas </style> :

   /* BODY AND WRAPPER
   ==================================================== */
   #navbar-iframe,.feed-links,.quickedit,.date-header{height:0;visibility:hidden;display:none}
   body{background:#f2f2f2;;font:13px/18px Arial,Helvetica,sans-serif;font:14px 'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, Arial, sans-serif;text-align:left;color:#555;margin:0}
   a{text-decoration:none}
   a:link,a:visited{color:#555;text-decoration:none}
   a:hover{color:#0099cc;text-decoration:none}
   img{border:none:max-width:100%!important}
   #wrapper{width: 860px;margin: 0 auto;padding:0;background: #fff;overflow:hidden}

4. Selanjutnya kita panggil kode css yang sudah dipasang tadi, cari kode berikut :

   <div id='outer-wrapper'> <!-- Disini posisi elemen outer-wrapper -->

5. Ganti dengan :

   <div id='wrapper'> <!-- Disini posisi elemen outer-wrapper -->

Dan hasilnya akan terlihat seperti ini :

Sedikit Penjelasan :
Untuk memanggil kode css yang sudah dipasang, pada bagian id harus disesuaikan dengan cssnya.
Pada bagian Body :
- background: #f2f2f2; : Background atau warna latar blog, warnanya bisa sobat ganti sesuai selera.
- a:link, a:visited {color: #555;text-decoration:none;} : Warna link dasar.
- a:hover{color: #0099cc;} : Karakter link ketika disorot.

Pada bagian Wrapper :
- width:860px; : Ukuran lebar layout 860px, sobat bisa merubahnya (sesuaikan juga dengan ukuran elemen lain, seperti sidebar dan header)
- background:#FFF; : Warna background, bisa sobar diganti sesuai selera.
- margin:0 auto; : Margin atau jarak luar akan ditentukan secara otomatis, berarti posisi tampilan akan tepat berada ditengah-tengah karena auto bersifat adil.

^^Semoga Berhasill^^