Login To Facebook
Δ Selamat Datang Di Otocomputer Δ

MENGATUR JUDUL SIDEBAR

Penampilan judul sidebar dapat anda percantik dengan melengkapi kode-kode yang diperlukan agar penampilannya berbeda dengan sebelumnya.
Kode awal untuk judul sidebar adalah .sidebar h2 { yang dibawahnya dapat anda tambahkan kode-kode lain sesuai keperluan.
Yuk..sama-sama kita pelajari kode-kode yang dapat ditambahkan pada judul sidebar.

Jika anda ingin melalukan pengeditan pada judul sidebar, seperti biasa anda harus melakukan langkah-langkah standar yaitu :
  • Masuk ke Blogger dengan ID anda
  • Pilih Tata Letak
  • Pilih Edit HTML
  • Download Template Lengkap dengan tujuan jika hasil yang diharapkan tidak sesuai dengan keinginan anda, template dapat dikembalikan pada keadaan semula.
  • Cari kode diatas tadi yaitu : .sidebar h2 {
  • Perhatikan kode tersebut pada bagian bawahnya, apakah sudah memiliki penambahan kode atau belum. Jika belum atau masih standar , coba nada perhatikan kode sidebar dibawah ini yang telah dilengkapi dengan berbagai kode


Anda Perhatikan kode-kode untuk penampilan Judul sidebar dibawah ini


.sidebar h2 {

font-size:110%;

font-weight:bold;

text-transform:uppercase;

text-align:right;

border: 1px solid #000;

background:#6df466;

padding;5px;

}



Kita bahas satu persatu :
  • Kode font-size:110%; : berfungsi untuk mengatur besarnya huruf. Satuan yang digunakan bisa pakai % atau pixels (px). Angkanya dapat anda ganti sesuai keinginan
  • Kode font-weight:bold; : menunjukan judul yang tampil dengan huruf tebal. Kata bold dapat anda ganti dengan normal jika penampilanya tidak ingin tebal atau ganti dengan italic jika ingin penampilan hurufnya miring.
  • Kode text-transform:uppercase; : menunjukan bahwa huruf yang tampil semuanya berupa huruf kapital (besar). Anda dapat mengganti dengan kata lowercase (semuanya huruf kecil) atau capitalize (hanya huruf depannya yang besar).
  • Kode text-align:right; : Letak judul sidebar di bagian kanan. Anda dapat mengganti dengan left atau center.
  • Kode border: 1px solid #000; : berfungsi untuk menampilkan garis di sekeling judul sidebar. Anda dapat mengganti ukuranya dan warna dari garis tersebut.
  • Kode background:#6df466; ; untuk menampilkan warna latar dari judul sidebar. Ganti kode warnanya dengan warna kesukaan anda. Selain dengan menampilkan warna anda juga dapat menampilkan sebuah image sebagai background judul sidebar. Perhatikan cara meletakan alamat image agar tampil sebagai background


    background:url(http://www.alnect.net/blogcontest/banner_blog_contest.gif)no-repeat top left;



    Ganti alamat image diatas dengan alamat image kepunyan anda.
  • Kode padding;5px; : untuk memberi jarak antara bagian pinggir judul sidebar dengan tulisan judul sidebarnya, dengan maksud agar kelihatan tidak mepet ke bagian pinggir.
  • Silahkan anda coba untuk mengatur penampilan judul sidebar pada blog kesayangan anda
  • Jangan lupa setelah selesai klik Simpan Template.



Catatan : Jika pada template anda tidak ditemukan kode .sidebar h2 { coba anda cari kode h2 {. Belum ditemukan juga...... berarti anda harus menambahkan sendiri pada tempalte.
Caranya cari kode


/* Headings
----------------------------------------------- */



kemudian copy kode judul sidebar diatas dan paste tepat dibawahnya. Editlah kode tesebut sesuai dengan panduan diatas.

0 comments:

Poskan Komentar

Silahkan Komentar anda.Jangan spam ya...

"U Comment I Follow"

 
Template by: widodo dc © 2010