Tempat Berbagi Berita, Cerita dan Derita

Kategori Yang Kalian Suka

Post ini diterbitkan pada : Thursday, January 22, 2009

Menambah Elemen Horizontal Baru Di Atas Sidebar

Saat pertama gue belajar nge-blog,gue bener-bener ga tau sama sekali mengenai cara mempercantik tampilan blog.. Bukannya ga mau,cuma gue ga bisa aja.. hehehe.. akhirnya,gue putuskan untuk bikin satu blog lagi khusus untuk gue belajar ngobrak-ngabrik kode HTML di markasujicoba.blogspot.com.Yah,diblog itulah semua pembelajaran gue di coba.. ^^ Setiap gue ngeliat ada posisi elemen dari suatu template blog yang unik,gue pasti ngarahin fokus gue ke blog yang itu dan mulai mencari caranya secara otodidak.Kali ini gue ingin berbagi sedikit Tips dan Trick untuk menambah sebuah elemen horizontal baru di atas kolom sidebar.(untuk template 3 kolom) Check this out!!



1. pertama-tama loginlah ke account blogger anda,masuk ke TATA LETAK --> EDIT HTML.

2. Carilah kode #sidebar dan masukkan kode dibawah ini di atas kode tersebut.

#sidebaratas-wrapper {
border: 1px solid #FFFFFF;
background:#FFFFFF;
width:320px;
float:right;
padding:5px;
margin-top:10px;
}

NB: rubahlah kode tersebut sesuai dengan lebar total kedua sidebar sobat.caranya jumlahkan saja width sidebar1 dengan sidebar2.cth,sidebar1 widthnya 160px dan sidebar2 widthnya 180px..,maka anda tinggal ganti width diatas menjadi 340px.

3.Langkah selanjutnya,anda cari kode

<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'/>
</div>

4.lalu taruhlah kode dibawah ini tepat dibawah kode tersebut.

<div id='sidebaratas-wrapper'>
<b:section class='sidebaratas' id='sidebaratas' showaddelement='yes'>
</b:section>
</div>

5.Simpan perubahan anda tersebut.. Setelah itu,masuk ke tab ELEMEN HALAMAN dan lihat hasil pekerjaan anda tadi..

6.Tambahkan elemen di lokasi baru yang muncul tersebut sesuai dengan sobat inginkan.contohnya,google adsense,daftar isi blog sobat,foto dll.tergantung kreasi dari sobat.^^

Akhir kata,klo ada sobat yang mempunyai tips-tips lainnya,minta sarannya ya.. thank's.

See u..

Do you like this post? You can share it with your community..
Dapatkan update artikel lewat email

Artikel Terkait

7 comments:

meletakkan gambar diatas head

March 13, 2009 at 9:16 AM Visitor
Anonymous said...

sy pengen nambahin sidebar saya...

letak na d atas sidebar yg lm sy

uda d cb berkali2 tp te2p g bs

krn code

div id='crosscol-wrapper' style='text-align:center

ini g ada d template sy

ada solusi na g..????

March 13, 2009 at 1:33 PM Visitor
Anonymous said...

@Hayus cheng,cari saja kode header-inner,kemudian tambahkan kode:

Background:url(http://alamaturlgambaranda);

@pare widitya,kalau begitu mungkin pengunaan bahasa code anda adalah template yang sudah di modifikasi oleh pembuatnya.
Anda bisa cocokkan dengan menambah kode sidebar atas dari saya dengan menambahkan nya diatas kode div id=sidebar-wrapper

March 23, 2009 at 4:49 AM Visitor
Anonymous said...

Menambah Elemen Horizontal Baru Di Atas Sidebar
tapi yang panjangnya satu halaman dari kiri sampai kanan,kodenya gmn ya mas..
tlong di bls ya

Waah, siip neeh....

makasih karna berbagi

terimakasih infonya sangat bermanfaat

My Tweet

 
Site Meter
© 2008 Blogger Abstrak | Template by : O-zone | Owner : Angga Leoputra