Kerangka Template Blogger Paling Sederhana (Membuat Template Blogger Dari Nol – Bagian 1)

  • Diterbitkan pada
  • July 14, 2020
  • Diposkan oleh
  • Eka Awaludin
Lokasi: Maja, Kabupaten Majalengka, Jawa Barat, Indonesia
Dulu ketika pertama kali terjun ke dunia blogger pada tahun 2007-an hal utama yang jadi perhatian saya adalah template. Saya memperhatikan banyak sekali blogger yang desain blog nya unik dan keren. Tak sedikit para master yang memberikan ilmunya tentang cara memodifikasi template blogger. Sayapun merasa tertarik untuk memodifikasi template blog saya. Saya belajar sedikit demi sedikit dan sampai sekarang saya bisa membuat atau membangun template blogger dari awal. Keuntungan membuat template sendiri adalah tentunya kita bisa menerapkan rancangan kita sendiri. Disini saya akan menuturkan pengalaman saya bertahun-tahun meneliti template blogger kemudian menjelaskan cara membuat template blogger dari nol. 😇

Disarankan Membuat Blog Eksperimen

Buat yang mau ngikutin tutorial ini,  saya sarankan untuk backup dulu template lama nya. Saya sih menyarankan kalian menerapkan tutorial ini di blog baru khusus buat eksperimen. Kalau belum punya saya sarankan bikin dulu. Oke? 👍

Fitur Template Blogger Yang Akan Saya Buat

Mobile Friendly

Nantinya saya akan membuat template ini menjadi mobile friendly atau akan terlihat baik di smartphone. 😎

Komentar Terbaru Blogger

Seperti kita ketahui, template terbaru blogger yaitu contempo, soho, emporio dan notable semuanya mempunyai tampilan yang solid serta mempunyai kolom komentar blogger yang terbaru. Dan semua orang suka dengan tampilan kolom komentar terbarunya. Tapi template blogger yang akan saya buat ini kolom komentarnya masih tampilan klasik lho. Tapi jangan khawatir, kolom komentar terbaru milik contempo cs bisa di terapkan di template yang akan saya buat ini. 💪

Kerangka Template Blogger Paling Sederhana

Di bagian pertama ini saya akan memperlihatkan kerangka template blogger paling sederhana. Mungkin sebagian besar dari kalian yang suka gunta ganti template sudah pada tahu kalau format template blogger itu adalah berformat xml yang di dalamnya terdapat ratusan baris kode yang membuat kita bingung. Tapi sebenarnya hanya dengan beberapa baris kode xml saja kita sudah bisa membuat template blogger yang paling sederhana. Ikuti langkah berikut ini:
  1. Klik bagian Tema
  2. Pilih tema Contempo lalu klik apply.
  3. Lalu masuk ke Edit HTML
Di dalam edit HTML hapus semua kode template Contempo dengan select all (CTRL+A) lalu klik delete atau backspace. Setelah itu masukan kode berikut ini:
Kemudian Klik Save Theme dan lihat blog. Template ini akan hanya mempunyai satu kolom yaitu kolom postingan. Bila blog kalian mempunyai postingan, maka akan tampil postingan nya. Tapi pastinya tampilan post nya bakalan acak-acakan karena belum di rapihkan menggunakan HTML dan CSS. 👌

Penjelasan Dari Kerangka Template di Atas

Bila kalian jeli dan hapal struktur kode HTML, kalian bisa melihat kerangka sebenarnya dari template ini adalah kode HTML. Lalu yang mana kode HTML di template ini? Perhatikan kode berikut ini:
Selebihnya adalah kode XML blogger yang akan saya jelaskan di bawah ini.

XML Declaration

Seperti yang kita tau kalau template Blogger berformat XML dan XML declaration menyediakan informasi dasar tentang format keseluruhan dokumen XML dan harus jadi bagian yang pertama di dalam dokumen XML Blogger.
<?xml version="1.0" encoding="UTF-8" ?>
1.0 adalah versi parser XML yang digunakan dan UTF-8 adalah character encoding yang digunakan mendecode keseluruhan dokumen XML.

Tag b:skin

Perhatikan kode berikut ini:
<b:skin><![CDATA[]]></b:skin>
Di dalam tag inilah dapat dituliskan CSS dan pendeklarasian variable. Tag ini wajib ada pada semua jenis tema xml blogger, dan ditulis hanya diperbolehkan 1 saja.

Tag b:section

Perhatikan kode berikut ini:
<b:section id='Konten' class="konten" maxwidgets='' showaddelements='yes'>
</b:section>
Ini adalah Tag yang digunakan untuk membentuk elemen tata letak dimana nantinya dapat diisi oleh gadget atau widget. Tag ini penting dan harus ada di xml blogger.

Tag b:widget

Perhatikan kode berikut ini:
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog'/>
Ini adalah tag yang digunakan untuk membuat sebuah gadget atau widget pada xml blogger dan harus diletakan didalam tag b:section yang saya jelaskan sebelumnya. Seperti yang terlihat widget satu ini adalah bertipe 'Blog' yang berfungsi menampilkan postingan di halaman beranda, halaman statis, halaman single post dan halaman lain yang menampilkan postingan.
Click to Expand