Cara Mengganti Background Judul Sidebar

Cara Mengganti Background Judul Sidebar – Pada kesempatan ini admin bacatutorial.com akan berbagi tentang Cara Mengganti Background Judul Sidebar. Mengganti Background Judul Sidebar dimaksudkan untuk mempercantik tampilan blog. Agar nantinya pengunjung blog bisa berlama-lama di dalam blog kita dan tentunya hal itu akan memberikan dampak positif bagi blog kita.

Ingat salah satu indikator yang diberikan oleh google agar blog bisa bersaing adalah navigasi yang bagus. Pada umumnya di bagian sidebar diberikan navigsi untuk memudahkan pengunjung blog membuka artikel yang mereka sedang cari.

Cara Mengganti Background Judul Sidebar

Cara Mengganti Background Judul Sidebar

 

Judul sidebar tentu kurang bagus dilihat jika tidak memiliki background, maka sangat penting untuk mengetahui cara mengganti background judul sidebar. Judul sidebar merupakan judul widget yang dimiliki oleh sebuah blogspot, biasanya berada di samping kanan ataupun samping kiri dan bahkan kedua sisi. Tergantung model template blogspot yang kita miliki.

Untuk mengganti background judul sidebar kita memerlukan sebuah gambar yang bisa kita modifikasi sesuai dengan selera dengan menggunakan software tertentu. Software yang paling banyak digunakan untuk memodifikasi sebuah gambar adalah potoshop.

Gambar untuk bakcground judul sidebar hendaknya sesuai dengan lebar sidebar template blogspot kita. Untuk mengetahu atau mengecheck lebar sidebar blogspot, kita bisa lihat di postingan Cara Mengubah Ukuran Header,Halaman,Sidebar Blogspot. Di postingan tersebut kita akan melihat kode HTML yang mewakili lebar sidebar blog kita.

Jika sudah mengetahu lebar sidebar blogspot, kita tinggal mendesain atau memodifikasi sebuah gambar sesuai dengan lebar sidebar blogspot kita. Dan untuk tinggi gambar tergantung dari kita, tapi biasanya ukuran tinggi biasa berkisar 20-50 pixel. Setelah gambar selesai dimodifikasi, selanjutnya diupload ke dalam hosting blog. Jika tidak memiliki hosting sendiri bisa menggunakan picasaweb.google.com. Setelah itu copy URL gambar contoh URL gambar

http://2.bp.blogspot.com/-gzGyw5RCJmY/TxACVbsHwSI/AAAAAAAACiQ/EQ_A1vJoG0k/s1600/widgettitle-bg.png

simpan di notepad.

Selanjutnya masuk ke blogspot, pilih template, edit HTML kemudian klik lanjutkan. Kemudian cari kode berikut ini :

.sidebar h2 {

Jika sudah ketemu perhatikan di belakang kode .sidebar h2 { . Biasanya banyak kode yang mengikuti kode ini tergantung dari template blogspot. Misalnya kode di template blogspot kita seperti ini :

.sidebar h2 { 

background:url(http://4.bp.blogspot.com/_ubwIhqPcR6M/TNQh-By6foI/AAAAAAAABG8/qFuq1Hmo4DE/s1600/sidebar+title1.png )repeat-x; 

color: #FFFF66;

font-size: 11px;

font-family: Georgia;

font-weight: strong;

margin: 0px 0px 5px 0px;

padding: 3px 0px 3px 10px;

text-align:center;

}

Maka kita tinggal mengganti alamat URL ini 

http://4.bp.blogspot.com/_ubwIhqPcR6M/TNQh-By6foI/AAAAAAAABG8/qFuq1Hmo4DE/s1600/sidebar+title1.png

 ganti dengan alamat URL gambar yang tadi kita upload.

Setelah diganti tinggal klik save dan lihat hasilnya.

Penjelasan :

  • Jika gambar yang kita tadi upload sudah sesuai lebar dan tinggi yang diinginkan, maka ganti kode repeat-x menjadi no-repeat.
  • Jika gambar yang kita upload memiliki tinggi 30 pixel dan lebar 1 pixel, maka kode repeat-x harus ditambahkan.
  • Jika gambar yang kita upload memiliki tinggi 1 pixel dan lebar 300 pixel (sesuai lebar sidebar) maka kode repeat-x diganti menjadi repeat-y.
  • Kode repeat artinya gambar tersebut akan diulang sesuai dengan sampai tempat meletakkan gambar tersebut penuh.
  • Repeat-x = diulang secara horizontal
  • Repeat-y = diulang secara vertikal

Demikian pembasahan singkat tentang Cara Mengganti Background Judul Sidebar dari admin bacatutorial.com, semoga bermanfaat. [bt]

Leave a Reply

Your email address will not be published. Required fields are marked *