Artikel tersebut sebenarnya berkaitan erat dengan postingan sebelumnya yakni; Cara Mengatur Tag H1, H2, H3, H4, H5, H6 pada Template Blogspot. Karena dalam pengaturan tersebut berpengaruh terhadap ukuran, jenis font dan warna pada judul post.
Cara merubah font, ukuran, dan warna pada Judul Postingan, sebenarnya tidak terlalu rumit, namun perlu ketelitian dalam memelototi kode-kode HTML pada template blog.Seperti biasa;
- Login di Blogger
- Di menu drop down, klik template - Edit HTML
- Backup template kalian dahulu (Takut terjadi sesuatu yang tidak dinginkan)
- 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;
}
Jika sudah menemukan kode tersebut, hapus kode itu dan ganti dengan kode berikut : 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;
}
.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; }
Lalu Cari lagi kode /* Variable definitions dan letakan kode berikut tepat dibawah kode /* Variable definitions
<Variable name="titlecolor" description="Post Title Color"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">
Setelah itu, maka dapat diatur sendiri ukuran dan warna font sesuai dengan keinginan. Lalu save template.
Cara Mengubah Ukuran Teks Header pada Blogspot
Cari bagian <Group description="Blog Title" selector=".header h1"> atau yang mirip dengan itu. Ganti ukuran jenis font yang ada. Seperti yang telah diberi tanda warna merah dibawah ini.<Variable name="header.font" description="Font" type="font"
default="normal normal 60px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 60px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
default="normal normal 60px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 60px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
Cara Mengubah Ukuran Font Deskripsi pada Blog
Cari kode:<Variable name="description.text.size" description="Description Text Size" type="string" default="140%" value="140%"/>
Lalu ubah nilai persentase yang telah diberi tanda warna merah seperti tersebut diatas.
No comments:
Post a Comment