membuat header dan logo di blogspot

Oke kini kita lanjutkan pelajaran membuat template bloggernya ya,,, kemarin kita sampai pada membuat style body dan wrapperdan sekarang kita akan coba belajar membuat header.

Header berfungsi untuk menampilkan judul blog atau logo dan sekarang sudah berkembang untuk di buat space adsense namun kita belajar dasarnya dulu biar nanti bisa di kembangkan lagi

oke sekarang tambahkan kode css ini di bawah kode yang kemarin kita buat tepatnya di bawah kode wrapper kemarin

#headerwrap {
background:#000;
height:90px;
width:900px;
}

.logo{
margin:0 auto;
text-align: left;
float:left;
color:#fff;
height:90px;
width:300px;
}

headerwrap berfungsi untuk membatasi semua yang ada pada header seperti logo, adsense dan kalo agan mau nambahin widget juga bisa yang penting jngn melebihi kapasitas headerwrap ini
ket :
#headerwrap
background:#000 : berarti background yg kita buat berwarna hitam kamu bisa ganti sesuai selera
height dan width : adalah tinggi dan lebar area header

.logo
text-align: left; : format tulisan logo adalah rata kiri jika kamu tidak ingin menggunakan logo bitmap dengan warna teks putih
float:left : letak logo berada di sebelah kiri

width:300px;

: nah dengan lebar 300 berarti kita msh punya space 600 dan itulah space ads yang nanti kita kembangkan tapi nanti aja ya,,

apakah sudah cukup sekian? oh tentu saja belum karena kita baru buat cssnya nanti kita panggil kode css tadi ke html untuk di tampilkan di blog oke sekarng cari kode :

<div id='wrapper'>

kemudian copy code ini di bawahnya :

<div id='headerwrap'>
<div class='logo'>
<b:section class='header section' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Theme Style (Header)' type='Header'/>
</b:section>
</div>
</div>

lo gan itu yg logo kok pake class nggak pake id?nah itu dia perbedaan class sama id kalo klass css di tandai dengan tanda (.) (lihat kode css di atas) sedangkan kalo id itu di tandai dengan tanda  (#)
(lihat kode css di atas) nah sekarang kita akan memasang logonya silahkan klik menu * Page Elements nah disana akan ada 1 widget (header) klik edit kemudian upload logo kamu kalo belum punya pake logo ini aja nggak papa

kalo udah save dan lihat hasilnya
oke sampai disini dulu ya nanti kita lanjut lagi kasih komentar dulu biar semangat kasih tutorialnya soalnya kalo nggak ada komentarnya berarti nggak ada yg berminat tuk belajar bikin template dan saya nanti juga males nulis lagi kalo nggak ada yg baca kan percuma ...

selamat belajar semoga sukses

Anda baru saja membaca artikel yang berkategori template blogger dengan judul membuat header dan logo di blogspot . Anda bisa bookmark halaman ini dengan URL http://sisatruk.blogspot.com/2012/07/membuat-header-dan-logo-di-blogspot.html .

Artikel Terkait template blogger

Ditulis oleh: Pramudya Ksatria Budiman - Rating : 4.5