Cara Mengganti Header Blog dengan Font Keren | kadang kala kita merasa bosan dengan Font Header yang standart dan terasa kurang menarik, dan jika kita menambahkan sebuah gambar atau animasi akan dapat memperlambat loading blog kita, Tapi BSS punya solusi yang tepat untuk menpercantik header blog dengan mengganti jenis fontnya dan tentu saja tidak memperlambat loading blog.
Contaohnya kayak dibawah ini :
BSS akan jelaskan caranya secara terperinci. Silahkan disimak ya!
- Loggin ke blogger
- Masuk ke dasbor
- Klik "template"
- Cari kode ini dengan ctrl F </b:skin>
- kalau sudah ketemu, copas kode di bawah ini lalu simpan di atas kode </b:skin>
@font-face {
font-family: "zerro";
src: url(https://sites.google.com/site/amiengblog/kumpulan-fonts/BRAD.TTF) format("truetype");
}
6. Cari lagi kode yang seperti di bawah ini
#header.title {
Atau kode :
.header h1 { font: $(header.font);
7. Kalau sudah ketemu di antara 2 kode di atas, copas kode di bawah ini lalu simpan setelah kode#header.title{ atau kode .header h1 { font: $(header.font);
font: 40px/20px BRAD;
Tapi kalau tidak di temukan 2 kode di atas, bikin sendiri aja sob seperti contoh di bawah ini. biar enggak ribet, copas aja kode di bawah ini lalu simpan di atas kode </b:skin>
#header .title {
width: 400px;
margin: 0 auto;
float: left;
color: #8c6c0c;
font: 40px/20px BRAD;
text-align: left;
text-shadow: 0 10px 12px #1D2301;
border: 10px solid rgba(255, 255, 255, 0.01);
border-top-color: rgba(255, 255, 255, 0.01);
border-bottom-color: rgba(255, 255, 255, 0.01);
}
Keterangan :;
width: 400px; : untuk merubah lebar teks
color: #8c6c0c; : umtuk merubah warna teks
text-align: left : untuk merubah posisi teks
text-shadow: 0 10px 12px #1D2301; : untuk merubah warna shadow teks
border: 10px solid rgba(255, 255, 255, 0.01);
border-top-color: rgba(255, 255, 255, 0.01);
border-bottom-color: rgba(255, 255, 255, 0.01); : kode perintah untuk membuat teks shadow/bayangan
8. Selanjutnya tinggal di SAVE.
Bila kawan ingin jenis font yang lain silahkan klik ini KUMPULAN FONT
Dan masukan URL dengan format kayak seperti dibawah ini
https://sites.google.com/site/amiengblog/kumpulan-fonts/ALHAMBRA.TTF
NB: hanya terlihat di browser Google Crome
