1st Template Unik (XML)

Ada tambahan template nih, judulnya rada norak : 1st Template Unik, tapi saya suka dhenk dengan nama itu. mau lihat screenshootnya, coba klik gambar di bawah ini :








Tertarik? kalau iya, silahkan baca dulu petunjuknya ! template ini sudah saya pasang
sistem Readmore versi baru, sobat hanya tinggal menambakan kode <span id="fullpost"> .... </span>
pada saat posting, tapi jangan lupa postingnya harus pada posisi Edit HTML bukan pada posisi Compose. Agar lebih jelas coba baca lagi di sini !



Mengingat pengalaman yang lalu bahwa ada yang kesulitan menempatkan gambar pada bagian header, maka sebentar saya bahas tentang bagaimana menempatkan kode gambar pada header, kurang lebih caranya seperti ini :

1. sign in di blogger





2. Klik Layout





3. Klik Edit HTML





4. cari kode berikut :




#header {

margin: 0 2%;

color: $headerTextColor;

padding: 0;

font: $headerFont;

height:150px;

background-color:$headerBgColor;

}



tambahkan alamat gambar yang sudah sobat miliki! contoh :



misal alamat gambarnya seperti ini :



http://i162.photobucket.com/albums/t253/rohman24/banner_4.gif



maka penambahan kode seperti ini :



#header {

margin: 0 2%;

color: $headerTextColor;

padding: 0;

font: $headerFont;

height:150px;

background-color:$headerBgColor;

background:url('http://i162.photobucket.com/albums/t253/rohman24/banner_4.gif');

}




itu nanti gambar akan memenuhi seluruh ruang header, jika gambarnya kecil maka gambar akan di tampilkan ulang alias berderetan, kalau ingin gambar tampil seperti gambar aslinya (yang tampil cuma satu gambar) kodenya ada sedikit tambahan, seperti ini :



#header {

margin: 0 2%;

color: $headerTextColor;

padding: 0;

font: $headerFont;

height:150px;

background-color:$headerBgColor;

background:url('http://i162.photobucket.com/albums/t253/rohman24/banner_4.gif') no-repeat top center;


}


kode yang diatas akan menampilkan gambar pada posisi tengah bagian header. kode height:150px; adalah untuk menyesuaikan dengan tinggi gambar yang sobat miliki, nilainya silahkan ubah sesuai dengan tinggi gambar yang sobat miliki.





5. Klik tombol Simpan Perubahan





6. Selesai.

Langkah ini berlaku juga untuk template Denim yang kemarin lusa saya berikan.



Tidak seperti template Denim yang kemarin, template ini sudah saya masukan banyak variable agar sobat lebih mudah mengatur Font dan warna, bila tidak suka dengan warnanya, silahkan sobat masuk ke halaman Font dan warna ubahlah warna sesuai dengan keinginan sobat.



Agar tidak berlama-lama berimprovisasi, untuk mendownload template ini, silahkan klik di sini !



Selamat mendownload ria !