CARA MENGGANTI WARNA DAN UKURAN FONT BLOG

Selalu setelah sebuah tutorial blog saya coba dan berhasil tidak lupa saya share kembali, yang tentunya sobat blogger ada yang belum mengetahui atau membutuhkannya

Secara default, layout blogger atau blogspot tidak memungkinkan kita untuk melakukan kostumisasi terhadap Font, ukuran dan warna dari judul postingan kita. Namun kalau kita hobby otak-atik HTML/CSS blog kita,kita dapat merubah semuanya. Akan tetapi, karena kita baru belajar ngeblog, pasti timbul kekhawatiran akan adanya Error template kalau kita asal otak atik Heee... Padahal sebenarnya saya saja yang khawatir pada saat awal mencobanya.

Pada kesempatan kali ini, saya share cara merubah warna, ukuran dan font dari judul postingan blog kita. Tapi, sebelum sobat blogger mengikuti semua langkah yang ada, terlebih dahulu simpan/cadangkan template sobat untuk berjaga – jaga.!!!!

Cara mengganti warna, ukuran dan Font Judul Postingan :

·         Login di Blogger

·         Di menu drop down, klik template

·         Back up Template

·         Klik Proceed (Tidak perlu kasih tanda centang pada Expand Widget Template)

·         Cari kode yang seperti ini :

.post h3 {text-shadow: 1px 1px 3px #fff;
margin:.25em 0 15px;border-bottom:1px dashed $bordercolor;
padding:1px 0px 4px;
font:normal normal 24px Oswald;
font-weight:normal;
line-height:1.4em;
color:#333;
font:$titlefont;
}
.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
font:normal normal 24px Oswald;color:#333;
}
.post h3 strong, .post h3 a:hover {
  color:#c22400;

} 

·           Kalau sobat blogger sedah menemukan kode seperti itu, hapus kode itu dan ganti dengan kode berikut :

.post h3 { margin: .25em 0 0; padding: 0 0 4px; color: $titlecolor; font: $posttitlefont; }

.post h3 a, .post h3 a:visited, .post h3 strong { text-decoration: none; color: $titlecolor; }

.post h3 strong, .post h3 a:hover { color: $titlehovercolor; }

·           Selanjutnya, cari kode  /* Variable definitions

·           Kalau sudah ketemu, letakkan kode berikut di bawahnya :

type="color" default="#c60" value="#cc6600">

< Variable name="titlehovercolor" description="Post Title Hover Color"

type="color" default="#c60" value="#cc6600">

< Variable name="posttitlefont" description="Post Title Font"

type="font" default="normal normal 18px 'Trebuchet MS',Trebuchet,Arial,

Verdana,Sans-serif" value="normal

normal 18px 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif">

·           Kalau di template sobat, ada salah satu dari kode di atas, hapus saja salah satu (Untuk menghindari kode yang sama).

·           Selanjutnya, simpan template sobat.

·           Lihat perubahannya Kalau tidak cocok sobat tinggal edit sesuka hati.

Lho...!!! Judul postingan saya kok tambah hancur? 

Wah berarti sobat kurang teliti dalam membuatnya…

Selamat mencoba!!!

Semoga berhasil.