Beranda » Template » Tutorial Blogger » Bagian-bagian Template Blogger Part 5

Bagian-bagian Template Blogger Part 5

Apa kabar Sahabat blogger????? Tidak terasa bagian-bagian template Blogger sudah mencapai tahap akhir nih.

Pada awalnya saya cukup pesimis dan tidak yakin bisa menyelesaikan pembahasan ini. Tetapi karena begitu banyaknya antusias dan dukungan dari para sahabat, maka pembahasan pun menjadi menyenangkan. Terima kasih atas dukungan Anda semua.

Sekarang kita akan membahas bagian terakhir dalam template Blogger. Sebelum melangkah lebih jauh, sebaiknya Anda sudah tahu struktur dari dokumen HTML. Setelah itu, baca dahulu

Bagian-bagian Template Blogger Part 1
Bagian-bagian Template Blogger Part 2
Bagian-bagian Template Blogger Part 3
Bagian-bagian Template Blogger Part 4

Okeh lah kalau begitu… Mari kita simak bagian-bagian template blogger berikut ini

/* Footer

----------------------------------------------- */

Bagian footer berawal di sini

#footer {

width:660px;

clear:both;

margin:0 auto;

padding-top:15px;

line-height: 1.6em;

text-transform:uppercase;

letter-spacing:.1em;

text-align: center;

}

Footer ini sama halnya seperti sidebar yaitu tempat penyimpanan gadget/widget pada blog kita namun footer tempatnya dibagian layout paling bawah yaitu dibawah main wrapper dan sidebar.

]]></b:skin>

Ini merupakan akhir dari css yang ada pada template blogger. Setelah kode ini, Anda bisa menyisipkan javascript dari autoreadmore, artikel terkait, dll. Setelah kode ini, bagian-bagian selanjutnya berisi kode HTML.

</head>

Ini merupakan tag penutup dari head pada dokumen HTML

<body>

Bagian body berawal pada tag ini
<div id='outer-wrapper'><div id='wrap2'>
Ini merupakan kode HTML dari outer-wrapper yang bisa diatur tampilannya dengan CSS

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

<b:widget id='Header1' locked='true' title='Blogwalking list (Header)' type='Header'/>

</b:section>

</div>

Bagian ini merupakan header-wrapper yang bias kita ubah tampilannya dengan CSS

Bagian main-wrapper dan sidebar-wrapper berada dalam tag ini

<b:section class='main' id='main' showaddelement='no'>

Widget blog terletak di sini

</b:section>

</div>

Ini merupakan kode HTML dari main-wrapper yang bisa kita ubah tampilannya dengan CSS.

<b:section class='sidebar' id='sidebar' preferred='yes'>

Widget blog pada sidebar terletak di sini

</b:section>

</div>

Ini merupakan kode HTML dari sidebar-wrapper yang bisa kita ubah tampilannya dengan CSS.

Ini mengatur ketinggian sidebar-wrapper dan main-wrapper supaya sama tinggi.

</div>

Ini merupakan akhir dari content-wrapper

<b:section class='footer' id='footer'/>

</div>

Ini merupakan kode HTML dari footer yang bisa kita ubah tampilannya dengan CSS

</div></div>

Ini merupakan tag penutup dari outer-wrapper

</body>

Ini merupakan tag penutup dari body pada dokumen HTML

</html>

Ini merupakan tag penutup dari dokumen HTML

Mungkin pembahasan akan lebih panjang jika kita membahas template dengan tanda centang pada 'expand widget template'.