Cara Mengganti Warna Sidebar Pada Blog

adalah bagian yang tidak bisa di pisahkan dari blog yang kita miliki sebab di dalamnya berisi mengenai informasi About,Blog Arsip,Label Gedget,Link, dan masih banyak lagi.

Sidebar sendiri posisinya berada sebelah kiri dan kanan,tergantung dari template yang kita pilih.
Jika kita perhatikan ,sidebar yang sudah kita buat warna yang sama dengan warna isi pontingan,agar terlihat berbeda maka kita bisa merubah warna pada sidebar.
Berikut langkah-langkahnya:

1. Masuk ke halamn Dashboard.

2. Lalu Klik Pada Layout.

3. Klik Edit HTML.

4. Sesudah anda berada di halaman HTML carilah script berikut ini:

#sidebar-wrapper {
width: 220px;
float: $endside;
word-wrap: break-word;
/* fix for long text breaking sidebar float in IE */
overflow: hidden;
/* fix for long non-text content breaking IE sidebar float */
}

Untuk mengubah warna pada sidebar anda cukup menambahkan script background: ( code warna); di bawah code: #sidebar-wrapper {

Nantinya akan menjadi seperti ini:

#sidebar-wrapper {
background: #ooccff;
width: 220px;
float: $endside;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text conten breaking IE sidebar float */
}

5.Lalu klik Save Template.

Catatan:

Untuk Code warna tergantung pada pilihan anda,yang sesuai keinginan anda.

Selamat berkarya semoga bermanfaat.
Source: http://winardi-andalas-putro.blogspot.com

Cara melebarkan halaman pada Blog

Apabila kamu pakai blogspot silahkan menuju menu edit html. tidak usah memberikan tanda centang pada kolom expand template widget selanjutnya cari kode css #outer-wrapper, #main-wrapper dan #sidebar-wrapper. untuk lebih mudahnya silahkan tekan Ctrl+F dan ketikan kode yang anda cari.

Jika sudah ketemu silahkan nilai angka dibawah tulisan #outer-wrapper, #main-wrapper dan #sidebar-wrapper diganti sesuka kamu tentunya di sesuaikan dengan kondisi monitor anda bukan? Berikut penjelasan mengenai #outer-wrapper, #main-wrapper dan #sidebar-wrapper, #outer-wrapper –> kode untuk melebarkan halaman blog. #main-wrapper –> kode untuk melebarkan postingan blog #sidebar-wrapper –> kode untuk melebarkan sidebar blog. Page Source: http://karyono-web.co.cc/

Membuat menu horizontal pada blog.

Ada yang pingin buat menu horizontal tapi nggak tahu caranya?
Gini nih caranya, eh tapi tunggu dulu, apasih menu horizontal itu? Menu horizontal adalah menu-menu yang disusun secara horizontal (menyamping). seperti yang ada di bawah header blog ini .
1. Login ke blogger terus pilih Layout --> Edit HTML, trus beri tanda centang pada kotak "Expand Widget Templates". jangan lupa template di backup dulu.
2. Cari script seperti ini ]]>, kalo udah ketemu copy script dibawah ini dan taruh diatasnya

/*credits : http://trik-tips.blogspot.com */
#tabshori {
float:left;
width:100%;
font-size:13px;
border-bottom:1px solid #2763A5; /* Garis Bawah*/
line-height:normal;
}
#tabshori ul {
margin:0;
padding:10px 10px 0 50px; /*Posisi Menu*/
list-style:none;
}
#tabshori li {
display:inline;
margin:0;
padding:0;
}
#tabshori a {
float:left;
background: url("http://kendhin.890m.com/menu/blackleft.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabshori a span {
float:left;
display:block;
background: url("http://kendhin.890m.com/menu/blackright.gif") no-repeat right top;
padding:5px 14px 4px 4px;
color:#fff;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabshori a span {float:none;}
/* End IE5-Mac hack */
#tabshori a:hover {
background-position:0% -42px;
}
#tabshori a:hover span {
background-position:100% -42px;
}

Tulisan yang dicetak tebal bisa kamu ganti dengan gambar-gambar (text dibawah gambar) diatas tadi. Misalnya, jika kamu pilih yang warna merah maka scriptnya menjadi seperti ini;

background: url("http://kendhin.890m.com/menu/redleft.gif") no-repeat left top;

background: url("http://kendhin.890m.com/menu/redright.gif") no-repeat right top;

Mudeng nggak loe :D
Kalo sudah selesai mari kita lanjutkan, sampai angka berapa tadi? oh ya sampai angka ketiga ya.
3. Copy script berikut ini

• Home


• Trik-Tips


• Free Template


• Kamus


• Profile

4. Ganti http://trik-tips.blogspot.com dengan link yang kamu tuju. Link tersebut bisa berupa alamat blog lain atau link postingan km. Untuk mendapatkan link postingan caranya klik kanan pada judul postingannya trus pilih "copy link location" (untuk mozilla firefox).
Kemudian text yang dicetak tebal bisa kamu ganti dengan text yang kamu suka. Text tersebut adalah text yang muncul di tombol/menu.
5. Cara memasangnya ada beberapa macam tergantung dari template yang digunakan, salah satu contoh memasangnya yaitu begini
cari kode berikut ini :

caranya nyari biar gampang, copy script diatas lalu tekan Ctrl-f kemudian paste di kotak find, nha langsung ketemu kan. Kalo udah ketemu copy script yang tadi diatasnya

6. Simpan hasil pengeditan.
7. Lihat hasilnya.
8. kalo hasilnya kurang bagus/acak-acakan coba script tadi dipindah tempatnya, misalnya pindah keatasnya yaitu diatas kode

. kalao nggak cocok juga tempatnya dicoba lagi yang diatasnya atau juga dibawahnya, begitu terus sampai ketemu tempat yang cocok.
9. Kalo masih belum berhasil juga coba cara ini:
- Cari kode berikut ini :





teru ganti text yang berwarna hijau sihingga menjadi seperti ini:





terus di Save

Klik tab Page Elements, kemudian di daerah header klik Add a page element lalu pilih HTML/JavaScript paste script link tadi di dalam kotak content terus simpan, nha itu kan tempatnya diatas, coba drag kebawah dikit, nha gitu, terus simpan dan lihat hasilnya.

hasilnya pasti akan berbeda-beda di setiap template.
kalo berhasil berarti kamu pinter, kalo gagal berarti kamu kurang pinter :r coba diteliti lagi langkah-langkahnya dan dipahami maksudnya, jangan cuma di plototin. OK BOZ, Good luck.....

Link : http://trik-tips.blogspot.com/2008/01/membuat-menu-horizontal.html

Cara Menambah kolom update status facebook di blog " live stream "

Em, tentunya asik juga bukan update status facebook dari blog sendiri, hehhe.....
sehingga sedikit memudahkan kita ntuk ngeblog sambil update status facebook dari blog langsung, bahkan keterangan nya akan tertulis seperti ini " 12 menit yang lalu melalui nama anda ",
penasaran seperti apa, contohnya ada diatas postingan ini yang terpasang di blog saya....hehe..
em, oke lanjut... langsng ke TKP saja :

1. Login dulu ke akun facebook anda
2. seret ke paling bawah , maka terdapat tlisan pengembangan , untuk lebih mudahnya teman2 langsung klik aja link ini http://developers.Facebook.com/setup , maka akan muncl kotak dialog yang harus di isi yaitu : nama situs, url situs, lokasi .
Contohnya : nama situs : H.farid sikoca ( isi dengan nama site teman2 )
url situs : www.hfaridsikoca.blogspot.com ( isi dengan url teman2 )
lokasi : indonesia
3. setelah selesai klik tombol creat app , maka akan muncul id teman2. . terus copy id yang berupa angka2 tersebuat.
4. Klik link berikut http://developers.facebook.com/docs/reference/plugins/live-stream/
5. maka akan muncl kotak dialog, isilah perintah yang telah di sediakan, untuk App Id isi dengan id teman2 yang tdi sudah di copy, selanjutnya isi menerut teman2 suka. . terus klik tombol Get Code.
6. copy kode yang muncul dan simpan di notoped.

untuk Facebook selesai... selanjutnya kita lanjut ke blog
1. login ke blog teman2.
2. klik Rancangan elemen laman/ edit tata letak
3. tambah gadget, pilih HTML/ java script
4. copy kode yang di simpan tadi disitu.
5.klik simpan
6. selesai

nah sekarang lihat blog teman2 pasti dah muncul tuh, silahkan update status terbaru teman2 dari blog teman2 sendiri.. mudah bukan...
selamat berblog ria.., hhehehe