Desain Template Blogger: Struktur Sebuah Template Blogger
Diperbarui
Penulis: Philip Faster
Desain Template Blogger: Tutorial 1
<< Pengenalan: Tutorial untuk Desain Template Blogger
>> Tutorial 2: Struktur Kode Template Blogger
Kembali ke Daftar Isi
Sebelum merancang template, Anda harus memiliki pengetahuan tentang struktur dasar template. Secara umum, struktur sebenarnya dari setiap template tidak persis sama. Tapi, dengan mengetahui struktur dasar, Anda dapat dengan mudah mendapatkan ide tentang bagaimana untuk mengedit template yang sudah ada, mendesain template, dan bagaimana mengubahnya menjadi struktur yang berbeda.
Beberapa bagian struktur template tampak jelas dapat Anda lihat pada kebanyakan blog: header, footer, dan bagian posting. Tapi ada beberapa bagian (Saya akan menyebutnya dengan blok atau kontainer) yang tidak terlihat pada layar komputer, tetapi merupakan tag HTML yang penting.
Apabila kamu belum mengenal pemrograman HTML, silahkan menuju ke situs belajar HTML bahasa indonesia di developer.mozilla.org, atau tutorial baru berbahasa inggris oleh Ezequiel Bruni di websiteplanet.com. Kemampuan memprogram HTML dan CSS (dan mungkin sedikit PHP) merupakan prasyarat untuk mendesain template blogger.
Untuk memulai, struktur template pada dasarnya berisi blok kontainer yang terlihat seperti ini:
Mulai dari yang blok terbesar sampai blok terkecil:
Body
: blok terluar adalah Body template Anda (pada dasarnya semua yang tampil pada layar komputer).
Outer-wrapper
: kontainer ini menutupi seluruh template Anda (bagian dari batas luar template). Secara umum, Anda membangun sebuah wrapper/pembungkus untuk menempatkan beberapa blok yang lebih kecil di dalamnya. Blok yang paling umum di dalam Outer-wrapper ini adalah Header, Content, dan Footer.
Header
: blok ini adalah bagian paling atas dari blok. Didalam Header dapat juga memiliki sub-blok, misalnya: Header Judul blok, Deskripsi blog, dan lain-lain seperti banner Adsense, menu bar, dll. Diluar header atau untuk membungkus semua sub-blok di dalam header biasanya dinamakan Header-wrapper.
Content/Isi
: dibawah Header adalah Content-wrapper - Pada dasarnya merupakan bagian dari blok yang paling penting. Secara umum bagian wrapper ini didalamnya terdiri dari blok Sidebar (bisa 1, 2 atau lebih sidebar) dan blok Main (yang berisi posting Anda, komentar, atau beberapa iklan).
Footer
: adalah bagian bawah dari template. Seperti pada bagian Header, dibutuhkan juga Footer-wrapper yang berisi bagian/sub-blok dari Footer.
Main
: Main-wrapper adalah bagian luar dari blok Main yang didalamnya terdapat Content-wrapper. Didalam Main-wrapper terdapat blok Post, blok Comment, Date Header, dan bagian lain yang dapat dibuat dari opsi Add Page Element.
Sidebar
: adalah bagian yang dapat berisi semua widget dan biasanya terletak dibagian samping, seperti: About Me, Labels, Archive, Text, HTML, Adsense, etc. Didalam standard template dari Blogger, biasanya ditemukan 1 sidebar, jika terdapat 1 sidebar maka template terdiri dari 2 kolom, yaitu Main dan Sidebar. Tetapi jumlah sidebar dapat ditambahkan dengan mudah. Yang paling umum adalah memiliki 2 sidebar atau berarti template memiliki 3 kolom. Dengan mengikuti seri tutorial ini diharapkan, nantinya kita dapat mengerti struktur dari template dan dengan mudah menambah atau memindah sidebar kekiri atau kanan.
Blog Post
: blok ini berisi bagian yan paling penting, seperti Posts Titles (judul artikel), Post (artikel), Post Author (Penulis artikel), Labels (label), etc.
Struktur dari template blogger, jika dilihat secara hierarki, mulai dari bagian yang paling besar ke bagian yang paling kecil, dapat ditampilkan sebagai berikut:
Body
Outer-wrapper
Header-wrapper
Blog Title
Blog Description
Other widgets
Content-wrapper
Sidebar-wrapper (1,2,3...)
Main-wrapper
Date Header
Posts
Post Title
Post Content (atau biasa disebut Post Body)
Post Footer (Author, Labels, dll)
Comments
Feed Link
Other widgets (biasanya untuk iklan)
Footer-wrapper
Footer text (disclaimer, copyrights, etc)
Other widgets
Setelah memahami struktur diatas, akan lebih mudah untuk memahami struktur kode dari templatenya Blogger. Belajar struktur kode dari template sebenarnya tidak belajar tentang HTML atau CSS, tetapi lebih terhadap bagaimana kode tersebut disusun dan terorganisir. Dengan memahami struktur dari template, walaupun punya pengetahuan yang minim terhadap pemrograman web, kita dapat mengubah template atau mendesain sesuai dengan selera.
6 Maret 2013 pukul 09.06
izin sedot ya gan
14 Januari 2014 pukul 07.17
Ok banget, ................ sederhana dan jelas, semangat terus Gan.
15 Mei 2020 pukul 22.41
bagus ini bang
18 Desember 2022 pukul 13.31
Izin nyimak gan. Terima kasih penjelasannyya