Minggu, 21 Oktober 2012

Membuat Banner di samping judul Blog

Bagi kalian yang sering menjelajahi dunia maya tentunya sering mendapati Situs-situs ataupun Blog yang menempatkan Baner di samping Judul, Selain dapat mempercantik Tampilan Blog atau Situs, Menempatkan Baner di samping Blog tentunya juga dapat menambah Pemasukan kantong di Blog sobat karena kalian dapat menambah Space Iklan baru yang tentunya akan Membayar ke Blog sobat, Eits tentunya kalau memasang baner yang berbayar lhooo.

Tetapi kelihatanya tidak semua Template Blog atau Situs di desain memiliki Widget yang terletak di samping Judul Blog sobat, " Tapi tenang saya akan kasih Tutor nya tentang bagaimana Memasang Baner di samping Judul Blog " Biasanya ukuran baner yang di pasang di samping judul Blok berukuran 729x90 pixel, tapi tenang bisa di ubah ukuranya sesuai kebutuhan yang anda inginkan, Ok.

Silakhan Kalian simak bagaimana Langkah - langkah menempatkan Baner di samping Judul Blog :

  1. Login Bloggger,
  2. Masuk template. Backup / Cadangkan dulu template yang ada, sebagai antisipasi kemungkinan terjadi kesalahan. Caranya, tekan tombol backup/cadangkan di bagian kanan atas. 
  3. Jika sudah selesai, klik edit html pilih " Lanjutkan "
  4. Cari kode #header dan hapus semuanya yang berhubungan dengan #header dan ganti dengan kode di bawah ini yang berwana Hijau : ( untuk memprmudah pencarian silakhan tekan tombol ctrl + f  )

    #header{background:transparant;float:left;width:179px;padding-top:15px;margin-left:7px;text-align:left;color:#f2f2f2}
    #header2{float:right;margin-right:7px;width:728px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQT1dAWSWzuz-toWT5iouylBIcP-npWEx68kE-jO4FhlFA0zppNGHmgJJeE1HKMTi7pTJjh0dXtCkjhm5q2b9_C-Ps65JYjflCVcbMV_UX8TmQIGvUX8shz2R2355PzI827lSgbd9Lry4/s1600/Advertisement+728x90.jpg) no-repeat;height:90px;margin-bottom:4px;margin-top:4px;}
    #header h1{line-height:1em;text-transform:uppercase;letter-spacing:.01em;font:bold 30px Georgia, Serif;margin:0 auto;padding:0 auto}
    #header a{color:#666;text-decoration:none}
    #header a:hover{color:#666}
    #header .description{max-width:100%;text-transform:none;letter-spacing:.01em;line-height:1.2em;font:normal 13px Arial;color:#999;margin:0 auto;padding:0 1px 5px}
    #header img{margin:auto}
  5. Kemudian cari kode <div id='header-wrapper'> dan rubah seperti sususan di bawah ini. Jika sudah ada susunannya kalian tinggal mengganti kode di bawah ini: ( untuk memprmudah pencarian silakhan tekan tombol ctrl + f  )

    <div id='header-wrapper'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='' type='Header'/>
    </b:section>
    <b:section class='header' id='header2' maxwidgets='2' showaddelement='yes'>
    </b:section>
    <div style='clear:both;'/>
    </div><!-- end header-wrapper -->
  6. Setelah selesai, Pratinjau terlebih dahulu, untuk menghindari kesalahan.
  7. Selesai dan lihat hasilnya.
Sekian infonya semoga berManfaat.


11 komentar:

Dunia Batas mengatakan...

Ane coba dulu gan
thx untuk info bermanfaatnya ya :D
soalnya ane mau bikin pake template bawaan blogspot blm ngerti caranya :3

Unknown mengatakan...

Cukup membntu gan makasih :)

fikri gustian mengatakan...

Sudah aku coba kok gagal ya gan...
tolong bimbingannya di http://kiatminibloger.blogspot.com

teguhdumadi mengatakan...

mantab infonya gan.
www.sourcecodeku.com
www.jaringankomputer.web.id

teguhdumadi mengatakan...

mantab infonya gan.
www.sourcecodeku.com
www.jaringankomputer.web.id

Anonim mengatakan...

Klo pake bawaan blogger bisa gak gan???

Unknown mengatakan...

mantap gan , thanks infonya
jangan lupa berkunjung gan http://formatikakomp.blogspot.co.id/

Unknown mengatakan...

hehe keren gan http://www.tangerangsatu.com

Unknown mengatakan...

hehe keren gan http://www.tangerangsatu.com

nayatrip.com mengatakan...

mantabs gan

Unknown mengatakan...

slot game sky777

Posting Komentar

Twitter Delicious Facebook Digg Favorites More