Translate Your Language

English French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified

Senin, 14 Februari 2011

Mengganti Background Header Blog dengan Gambar

Kali ini kita akan membahas tutorial mengganti background header blog dengan gambar. Kenapa harus gambar??? Kan bisa pake warna ???

Jika mengganti background header blog dengan gambar, blog kita akan terlihat lebih menarik. Pada dasarnya, gambar mewakili kata-kata yang ngga mungkin kita tuliskan. Jadi, header blog mewakili bagaimana karakteristik blog kita. Kalau blog Kumpulan Tutorial Ngeblog menggunakan gambar header yang kecil. Kenapa kok kecil ??? Kan itu trik supaya halaman blog ini tidak berat saat loading...hehehehehe...

O iya, sebelum mengganti background header blog Sobat dengan gambar, perhitungkan dahulu ukuran gambar yang akan Sobat gunakan sebagai background header blog. Misalnya ukuran header blog Sobat lebarnya 800px. Jadi kita harus mempersiapkan gambar selebar 800px dengan tinggi terserah Sobat. Gambar bisa Sobat buat dengan Photoshop, CorelDRAW atau software pengolah gambar lainnya.

Gambar sudah siap, sekarang tinggal kita pasang. Silakan simak tutorial di bawah ini


=== Cara Mudah ===

Login ke akun Blogger milik Sobat > Tata Letak. Klik link edit pada bagian header blog.

Atur seperti pada gambar di bawah ini


Cari gambar di komputer Sobat dengan menekan tombol Telusuri. Jika sudah, proses upload akan berjalan. Setelah itu beri tanda pada “Selain judul dan keterangan” lalu klik tombol Simpan.


=== Cara agak sulit ===

Cara berikut ini cukup rumit karena kita harus menyimpan gambar kita ke salah satu image hosting yang ada di internet. Jika Sobat tertarik menggunakan cara manual, silakan simak langkah-langkah berikut ini

Langkah 1
Login ke akun Blogger milik Sobat > Tata Letak > Edit HTML. Klik Download Full Template untuk membackup template blog Anda.

Langkah 2
Cari kode berikut ini atau yang agak mirip, gunakan Ctrl+F untuk mempermudah pencarian kode pada template Blogger

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

Jika sudah ketemu, tambahkan kode background:url(link gambar); sehingga kode nya jadi seperti ini

#header-wrapper {
background:url (link gambar);
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

Ganti link gambar dengan lokasi penyimpanan gambar header blog Anda. Jika sudah selesai, klik tombol Simpan.

Semoga bermanfaat...
ENJOY !
  • Share
  • [i]
print this page Print Halaman ini

Masukkan Email-mu disini untuk berlangganan Artikel menarik lainnya Cuma Blog Sederhana :

Delivered by FeedBurner

0 Komentar:

:10 :11 :12 :13
:14 :15 :16 :17
:18 :19 :20 :21
:22 :23 :24 :25
:26 :27 :28 :29
:30 :31 :32 :33
:34 :35 :36 :37
:38 :39 :40 :41
:42 :43 :44 :45
:46 :47 :48 :49
:50 :51 :52 :53
:54 :55 :56 :57
:58 :59 :60 :61
:62 :63

Posting Komentar

Saya akan menghapus komentar yang Tidak sopan, memakai HURUF BESAR, berupa caci maki, mengandung kata-kata kebun binatang, debat kusir, provokasi, di luar konteks, berupa undangan/reklame. komentar yang terlalu panjang, tanpa paragraf, sulit dipahami dan berupa SPAM.

Isi komentar adalah Tanggung Jawab penulis komentar, Bukan Tanggung Jawab pengelola blog/situs ini. Harap dimaklumi !

Tukeran Banner Yuk !

Photobucket
Blok semua tulisan di kotak,lalu tekan Ctrl + C

Cari Rangking Blogmu Disini

Cari Web Kamu disini :
Pencarian Rangking Web Powered by Google Service Cuma Blog Sederhana

Music Center

Cari Lagu Favoritmu !
Related Posts Plugin for WordPress, Blogger...