Cara Mengubah Tampilan Judul pada sidebar

Cari –cari templates dapat yang bagus tapi susah juga kalau tidak bisa mengubah isi nya!!.. setidaknya kita bisa mengubah sedikit tampilan pada blog!. Setiap kali mengubah tampilan atau mau mengutak – atik tampilan blog lakukan back up templates terlebih dahulu, supaya safety..^^..

Karena penasaran juga bagaimana sich caranya judul nya pada sidebar bisa berubah, karena waktu itu saya dapat templates yang bagus, tapi text di judul nya terlalu besar jadinya kurang srek, Maka nya saya coba – coba eh ternyata berhasil. Sekalian sharing juga ke saudara – saudara kalau gitu..^^..
Pada bagian templates blogger bisa kita liat ada code seperti di bawah ini..
.sidebar h2 {

……………….
}
………………. Itu di isikan untuk mendefinisikan bagiamana stuktur dari sidebar h2 ( yang di lambang kan sebagai kode untuk mengatur tampilan judul sidebar)
Misalnya code nya seperti ini:

.sidebar h2 {

font-size:130%;

font-weight:bold;

text-transform:uppercase;

text-align:right;

border: 1px solid #000;

background:#6df466 url(quote.gif) no-repeat;

padding;5px;

}

Font-size : 130% ->
diartikan sebagai ukuran huruf yang anda inginkan. Biasanya ukuran ini diatur dalam pixels .


font-weight:bold; ->
bold di sini diartikan sebagai huruf tebal, jadi setiap huruf yang muncul pada sidebar h2 adalah tebal, seperti pada microsof word penulisan seperti ini bisa menggunakan bold, italic, dll

text-transform:uppercase ->
uppercase jadi huruf yang di minta adalah huruf besar semua, nah kalau ingin menggunakan huruf kecil kalian bisa menggantinya dengan lowercase, dan untuk initial hanya huruf awalnya yang huruf besar

text-align:right ->
code di sini di artikan semua huruf yang kalian tulis akan rata ke kanan, jadi jika ingin mengubahnya menjadi rata ke kiri, ganti dengan left, dan center untuk rata tengah

border: 1px solid #000 ->
border adalah garis yang mengelilingi tulisan atau judul. 1px berarti garis tersebut memiliki tebal 1px dan berwarna #000 untuk pengaturan warna bisa diliat
menggunakan photoshop, atau click di link sini code pengaturan warna

background:#6df466 url(quote.gif) no-repeat ->
untuk background kalian bisa menggunakan warna saja atau mengubah warna transparent jika kalian ingin warna background sesuai dengan warna templates kalian. Di quote.gif bisa diganti dengan URL gambar yang kalian suka

padding;5px ->
nah, kalau menggunakan background warna gunakan code padding ini agar warna background dan template tidak bercampur.

Skr kalian bisa mengubah tampilan judul sidebar sesukan kalian… ubah dan buat tampilan nya jadi semakin menarik.^^..
lubang  bisnis

4 comments:

start sharing not selling said...

wah tipsnya bgus juga euy

webdesignwide said...

kalau mau themes yang sesuai selera kita, ya... tidak jarang harus mengedit sana sini dulu

jadi mesti bisa CSS dan ada kemampuan dasar PHP

kalau ga bisa, ya bayar aja orang yang bisa

kalau masih pas-pas an, ya pakai apa adanya dulu aja

tokoagen said...

kalo di tanamkan pada theme responsiv apa juga bisa gan ?

Anonymous said...

ketemu juga akhirnya artikel yang dicari. thanks gan..
Cara Budidaya Kroto

Post a Comment

Twitter Delicious Facebook Digg Favorites More