Kamis, Februari 07, 2008

Cara Mudah Mengganti Header Blog !!!

Bagi yang sudah bosen dengan tampilan Gambar Header Blog kita (kayak Ocy) dan pengin mengganti dengan desain kita biar lebih personal, mari simak cara-caranya !!!



Langkah Pertama Buatlah desain Headernya dengan Program pengolah gambar (Corel atau Photosop) dengan ukuran 847px X 240px. Simpan dalam format JPG atau GIF.

Let's Edit !!!
*) Cara Pertama :

1. Sign in di Blogger

2. Klik menu Layout

3. Klik menu Edit HTML

4. Klik tulisan Download Template Lengkap, silahkan save dulu template Anda untuk backup

5. Klik kotak kecil di samping tulisan Expand Template Widget

6. Tunggu beberapa saat sampai proses selesai

7. cari kode berikut pada template Anda :

b:section class="'header'" id="'header'" maxwidgets="'1'"

pada kode maxwidgets='1'. Rubah angka 1 menjadi angka 2, sehingga kodenya menjadi

seperti ini :

b:section class="'header'" id="'header'" maxwidgets="'2'"

8. Klik tombol SIMPAN TEMPLATE

Kemudian ................????????????????

1. Klik menu Elemen Halaman

2. KLik tulisan Edit yang ada pada elemen Header

3. Tunggu beberapa saat

4. Pilih radio button yang ada di samping tulisan dari komputer Anda

5. Klik tombol Browse...

6. Pilih Header yang telah di buat yang ada pada komputer Anda

7. Tunggu beberapa saat sampai proses selesai.

8. Gambar Header Anda akan di tampilkan

9. Klik tombol SIMPAN PERUBAHAN

10. Selesai.

**) Cara Kedua

Kalau kurang puas dengan tampilan di cara pertama, kita akan edit dengan cara yang kedua!
Jika sudah selesai mendesain Headernya, silahkan Upload gambar Anda ! contoh di http://www.photobucket.com/

Let's Edit !!!
Caranya

1. Sign in di blogger

2. Klik menu Layout

3. Klik menu Edit HTML

4. Klik tulisan Download Template Lengkap, silahkan save dulu template Anda untuk backup

5. Klik kotak kecil di samping tulisan Expand Template Widget

6. Tunggu beberapa saat sampai proses selesai

7. Tambahkan kode berikut pada style sheet css Anda.Yang warna hitam adalah kode asli dan yang merah adalah kode yang harus di tambahkan (sesuaikan dengan alamat gambar Anda)


/* Header -----------------------------------------------
*/

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid #ccc;
background:url(http://i256.photobucket.com/albums/hh174/mas_usup/mas_usup_top.gif);
}
}

8. Klik tombol Pratinjau untuk melihat perubahan yang ada

9. Bila sudah OK, klik tombol SIMPAN TEMPLATE

10. Selesai.


Thank's for Kang Rohman

46 komentar:

el dany mengatakan...

matur nuwun bung ucup!!!

yen nggawe link menu gimana pak???

btw, sorry pak! tapi kok potomu mengenaskan banget

Komuikasi dan Informasi mengatakan...

trima kasih mas ucup.
tutorialnya akan saya coba

Kang Rohman mengatakan...

sip tenan mas.. terus berkarya.

L . O . V . E . & F . R . I . E . N . D mengatakan...

assalamualaikum....

makasih banget mas artikelnya ...
berhasil loch :)

boleh nanya ga mas??

gimana cara membuat banner di header mas??? ditunggu ya mas...

jangan lupa mampir...

assalamualaikum....[-o<

Candra AK., ST mengatakan...

bisa dicoba......

gibols mengatakan...

mas ko ga jadi??
headernya tetap

ariff mengatakan...

blog yang sederhana & minimalis tapi sangat berkesan ketika dikunjungi....trima kasih mas tutorial nya....

Juli Hendra Asmoro mengatakan...

trimaksih sekali son infonya, sangat terbantu sekali, maju terus sob... saya senang berkunjung kesini

Irfan Madani Zukhruf mengatakan...

Terima kasih atas infonya...
Pokoknya gak sia - sia deh datang kemari...

Akang Ebi mengatakan...

maju terus.....

suwun yo mas


Gimana cara buat kotak komentar di bawah postingan....

kirimin y mas ke email ini : febri-suprayitno@yahoo.co.id

Plt mengatakan...

mantap mas, saya coba ganti dulu headernya apa bisa berhasil gak ya....? terimakasih

dari Andi

http://pelitaterang-blog.blogspot.com

usb-wifi mengatakan...

makasih ya, bisa berbagi info buat ngedit header blog

Adi Waskitoe Gend'z mengatakan...

wah...bagus nih tutorialnya..
saya coba ganti dulu deh...
maklum saya pendatang baru di dunia blogging

please visit me
http://www.jnanayoga-online.blogspot.com

Ratasoe mengatakan...

Thanks mas..infox ntr di coba dh..

'Oniee BeqicHan' mengatakan...

Nice Info
Tukr lìnk yuk
www.trik-gue.co.cc
Kumpulan trik unik

Andi darmawan mengatakan...

Kemarin ada coba, tapi agak sulit Mas, bagi yg uda berhasil kasi tau aku ya

THANKS.

Buku Termurah mengatakan...

Thank you

Andhie mengatakan...

boleh kuga tu .....

K-shoes mengatakan...

nanya mas..aku udah ganti header pake gambar sendiri tapi ko gambarnya ga mau ditengah ya melebihi batas getoh hehe ..makasih

Dik's Blog mengatakan...

Makasih mas.. ditunggu kunjungan ny..

Infobisnisanda mengatakan...

mantap mas...

Ardy mengatakan...

thanks tutorialnya....

Bocah Soenyi mengatakan...

thank's bosss....

wadud@duad mengatakan...

terima kasih sobat, sangat membantu.. salam kenal dari saya :-)

lappalla mengatakan...

trims mas usup

lappalla.blogspot.com

Fikri mengatakan...

mantap bro... trimakasih

SEKOLAH MENENGAH KEJURUAN ASSA'ADAH mengatakan...

asyik mas ilmunya

Blogg Untuk Anda mengatakan...

Wah Info bagus Nih..makasih Yah

412IF mengatakan...

Wah ...mantap bro
ini baru ori

Create a Fortune With The Power Of The Mind mengatakan...

Wah, sayangnya saya tak ahli photoshop dan corel draw, ada caralain gak yg lebih simple

Yogo mengatakan...

@ Komentator diatas :
Ada cara mudah untuk merubah header secara otomatis. Tutorial lengkapnya ada di http://yogopunyablog.blogspot.com/2010/11/membuat-gambar-header-blog-berubah.html

Tim Belajar mengatakan...

Very useful post. Bookmarked. Thanks for it!

blogketok mengatakan...

sudah di coba...
berhasil sukses.!
trim's mas.

mahro mengatakan...

mohon izin disalin hatur nuhun mas usup pasti manfaat buat bloger

fyiqun mengatakan...

siip mas.. oya jajal tempat q y mas n yang lainnya

Surya62 mengatakan...

trim atas infonya

Pipit mengatakan...

Thanks infonya mas Usup...
Nambah ilmu lagi..


http://pipit-eternity.blogspot.com/

Altair ibn Abdi Robhani mengatakan...

trima kasih mas.....
Tutorialnya sgt bermanfaat, akan saya coba

salam semangat dari Dayat's Artikel

Oga Gundul mengatakan...

terimakasih kang atas info nya :D
saya masih newbie
hehehhe
.....
yogakurniasany.blogspot.com

Syaiful Munir Site mengatakan...

lebih simpel ganti headerx di elemen halaman....
bisa langsung unggah dar hd,fd mmc n cmw jenis memori.......

bisnis pulsa termurah terlaris mengatakan...

mantap ner tutorialnya
by www.kubifree.blogspot.com

DUNIA91 mengatakan...

untuk edit nya ada cara lain gak?
soal nya style sheet css saya gak ada yang kek gitu?

ridho rizky mengatakan...

aku baru ne mas bro di blog.
jadi mau numpang nanya,
gmna caranya bikin header blog dengan kreasi sendiri mas bro?
thanks sblum nya

Rudy Hartono mengatakan...

thanks atas informasinya yang sangat bermanfaat dan mudah dicerna, salam kenal ya gan, follow me
http://caramembuatyangakumau.blogspot.com

Septiaji Agung Santosa mengatakan...

thanks atas infonya, berguna
(PENGETAHUAN PINTARs BLOGWALKING)

IRAWAN mengatakan...

makasih infonya...