Sebelum merancang sebuah template, terlebih dahulu anda harus memiliki gagasan tentang bentuk struktur dasar dari template anda. Pada umumnya, struktur dari setiap template tidak sama. Namun, dengan mengetahui struktur dasar, anda dapat dengan mudah mendapatkan ide-ide tentang bagaimana cara untuk merubah template yang ada, mendesain template, dan bagaimana mengubahnya menjadi template yang berbeda.
Bagian dari struktur template dapat anda lihat di browser pada blog: seperti header, footer, dan bagian posting. Tapi ada beberapa bagian tertentu (saya menyebutnya bagian blok atau kontainer) yang tidak terlihat pada layar komputer, karena berisi kode HTML yang tidak terbaca secara langsung di browser.
Untuk memulai, struktur template pada dasarnya mengandung bagian dari kontainer yang terlihat seperti ini:
Body
Body
Header
Main
Post
... Out Wrapper
... Content-Wrapper
... Content-Wrapper
Kita Mulai dari yang terbesar hingga ke sub bagian yang mencakup didalam sebuah template :
- Body : Bagian ini merupakan blok terluar dari body template (pada dasarnya semua yang meliputi layar komputer).
- Outer-wrapper : Bagian ini mencakup seluruh template anda (body template). Secara umum, anda akan membuat sebuah Outer-wrapper untuk menempatkan beberapa bagian-bagian blok di dalamnya. Blok yang terdapat dalam bagian Outer-wrapper adalah Header, Content, dan Footer.
- Header : Blok ini berada paling atas di blog anda. Dalam Header anda akan memiliki sub-blok seperti Judul header, Deskripsi Header, dan lain-lainnya seperti baner Adsense, atau sebuah menu bar, dll. Dan untuk membungkus semua sub-blok dalam dalam Header digunakan Header-wrapper.
- Content : Pada bagian bawah Header terdapat Content-wrapper. Bagian ini merupakan bagian yang cukup penting karena dalam Content-wrapper ini terdapat blok Sidebar (sidebar1 atau sidebar2) dan merupakan blok utama dari sebuah blog (yang berisi posting Anda, komentar, atau beberapa iklan).
- Footer : Footer adalah wadah yang paling bawah dari template Anda. Kebalikan dari bagian Header dan anda juga akan memerlukan Footer-wrapper untuk membungkusnya (di dalamnya dapat anda tambahkan bagian-bagian blok kecil).
- Main : Main adalah pembungkus blok posting di dalam Content-wrapper. Di dalam main terdapat blok Post, blok Komentar, Header Tanggal, dan widget lain yang dibuat dari opsi Tambah Elemen Halaman blogger.
- Sidebar : Sidebar 1 dan sidebar 2 adalah blok yang berisi semua widget tepi template Anda, misalnya About Me, Label, Arsip, Teks, HTML, Adsense, dll. Pada template Blogger standar, Anda biasanya akan menemukan hanya 1 sidebar atau template 2 kolom (Utama dan Sidebar) . Sebenarnya sepele untuk menambah hal-hal lainnya. Yang paling umum adalah 2 sidebars atau template 3 kolom. Anda akan belajar dari tutorial ini bahwa setelah Anda memahami struktur template, semua sebenarnya mudah dalam menambah atau memindahkan sidebars ke kiri atau kanan kontainer blok Anda, sesuka hati anda.
- Blog Post : blok ini berisi hal-hal penting mengenai tulisan Anda, yang di dalamnya terdapat Artikel Posting, Penulis, Tombol berbagi, Label, dll.
Jika di tampilkan dalam bentuk struktur terperinci. Mulai dari wadah terbesar untuk sub-kontainer, struktur itu akan terlihat seperti ini:
- 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 disebut Post Body)
- Post Footer (Author, Labels, etc)
- Comments
- Feed Link
- Other widgets (mostly ad units)
- Footer-wrapper
- Footer text (disclaimer, copyrights, etc)
- Other widgets
- Header-wrapper
- Outer-wrapper
Setelah Anda memahami struktur dasar, semoga akan lebih mudah untuk belajar tentang struktur kode template Blogger. Belajar struktur kode blogger tidak harus menguasai penuh HTML atau CSS, tapi yang paling penting tentang bagaimana kode template diatur, seperti bagaimana struktur container diatur atau bagaimana membuat sebuak blok dalam blok. Ini akan sangat berarti jika dengan sedikit pengetahuan tentang pemrograman web, terus hasilnya Anda dapat menyesuaikan template Anda dengan baik hanya dengan memahami struktur dasar dan beberapa bahasa CSS. Bagaimana, hebat bukan?
Tidak ada komentar:
Posting Komentar
Berkomentarlah jika ada pertanyaan seputar artikel ini dengan santun bahasa Indonesia yang baik.