Template Blogger 2010

Sebenarnya aku bingung mau memberi nama apa tentang template ini, habis beberapa hari ini mencoba menerapkan sistem penulisan Javascript langsung dalam template... ndak jadi-jadi. Akhirnya dengan sak kepenak-ke dhewek aku sebut saja Mbulet blog.

Masih seperti biasanya, aku mencoba memodifikasi template MINIMA kemudian dengan memperhatikan beberapa template yang beredar saat ini, saya mencoba menerapkannya ke dalam template minima ini.

Mbulet blog sebenarnya terdiri dari dua kolom, namun karena aku mencoba memodifikasi agar terkesan multikolom maka aku tambahkan modifikasi dari html-nya.

Pada ruang Home Page, semua posting terakhir akan tampil penuh sedangkan posting kedua dan seterusnya ( tergantung kita format berapa tampilan postingannya ) secara otomatis akan menempatkan diri di kolom tengah. Jadi untuk kolom ini tidak bisa ditambahkan widget, sedangkan pada bagian sidebar dapat dipasang widget suka-suka kita.

Yang perlu diperhatikan dalam penggunaan template ini.

1. Pada bagian posting pertama, untuk tinggi ruang apabila panjang artikel melebihi 1500px, maka kita harus merubah ukuran Height secara manual. Untuk mengubah ukuran height, coba perhatikan bagian ini :

#first{
width: 530px;
height: 1500px;
margin: 0px 15px 10px 0px;
padding:0px;
float:left;
background: #111;
border: 1px solid #1b1b1b;
clear:both
}

Ukuran 1500px saya anggap standart, apabila pada bagian ini tidak saya tambahkan maka apabila artikel pada posting terakhir terlalu pendek maka tampilan cuplikan posting kedua dan seterusnya akan berada di bawah posting pertama bahkan terkesan berantakan.
Ukuran bisa ditambah sesuai dengan panjang artikel.

2. Tentu saja kita ingin menambahkan iklan di dalam ruang posting pertama, maka coba perhatikan kode dibawah ini : ( centang Expand Template Widget )

<div class='first-body'>
<p><data:post.body/></p>
</div>

Untuk menambahkan kode iklan anda, silahkan perhatikan kode dibawah ini :

<div class='first-body'>
<p><data:post.body/>...... Tambahkan kode anda disini.......</p>
</div>

3. Apabila artikel yang ditulis tidak bergambar, jika artikel ini nantinya akan menjadi artikel kedua dan seterusnya maka gambar akan secara otomatis diisi gambar yang sudah saya setting. Untuk merubah tampilan gambar tersebut, coba perhatikan kode dibawah ini

.......dst.......

if(img.length<=0) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px !important;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAT-RRC13jf9SVEkbTm6EFgN1qlbcMn75hyDXpFxBk-6ubCJnHayLedZkDv7keQTiXH-ZZNdNCkdDRpgUEm_69D_yyYpfL-QVrR12OaQyMLhskRTLQ7cFvK2o2_gTJk5VnvwbUBDzHaoaz/s320/logo-nyar-bcom.png" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/>

........dst......

Silahkan ubah URL berwarna merah dengan Url image yang anda punyai.

Jika ada waktu anda bisa menyempatkan untuk melihat demonya di SINI.
Untuk download, anda bisa berkunjung ke bCOMstudio, tempat dimana saya mengompulir hasil modifikasi template.