Nah mungkin artikel kali ini cocok buat anda yang ingin merubah judul blog biar terlihat menarik tanpa menambah beban loading blog.
Contohnya seperti di bawah ini
Kegunaannya
- mempercantik tampilan header blog tanpa menambah beban loading blog
Cara membuatnya
- Loggin ke blogger
- Masuk ke dasbor
- Klik "template"
- Cari kode ini </b:skin>
- kalau sudah ketemu, copas kode di bawah ini lalu simpan di atas kode </b:skin>
- Cari lagi kode yang seperti di bawah ini
- 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);
- Cukup sekian dulu, bila ada yang kurang di mengerti jangan sungkan-sungkan untuk bertanya
@font-face {
font-family: "zerro";
src: url(https://sites.google.com/site/amiengblog/kumpulan-fonts/zero.ttf) format("truetype");
}
font-family: "zerro";
src: url(https://sites.google.com/site/amiengblog/kumpulan-fonts/zero.ttf) format("truetype");
}
#header.title {
Atau kode :
.header h1 { font: $(header.font);
Atau kode :
.header h1 { font: $(header.font);
font: 40px/20px zerro;
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 zerro;
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);
}
width: 400px;
margin: 0 auto;
float: left;
color: #8c6c0c;
font: 40px/20px zerro;
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
Bila sobat ingin merubah teksnya dengan teks kepunyaan sobat, sobat cukup mengganti kode yang berwarna merah di atas dengan kode teks kepunyaan sobat.
Lihat caranya DISINI untuk membuat kode teks sendiri dari komputer sobat.
Bila sobat enggak mau ribet, DCC udah menyediakan 8 kode teks di bawah ini :
https://sites.google.com/site/amiengblog/kumpulan-fonts/KASNAKE.TTF
https://sites.google.com/site/amiengblog/kumpulan-fonts/Tarzan__.ttf
https://sites.google.com/site/amiengblog/kumpulan-fonts/ALHAMBRA.TTF
https://sites.google.com/site/amiengblog/kumpulan-fonts/JFJunRoc.ttf
https://sites.google.com/site/amiengblog/kumpulan-fonts/tatu_font.ttf
https://sites.google.com/site/amiengblog/kumpulan-fonts/Blazed.ttf
https://sites.google.com/site/amiengblog/kumpulan-fonts/BRAD.TTF
https://sites.google.com/site/amiengblog/kumpulan-fonts/Patriot.ttf
makasih ka infonya bermanfaat...jangan lupa kunjung balik http://ilyas175.blogspot.com
BalasHapusoke sip, mksih ya atas kunjungannya
Hapusgan, kok, judul blognya kalau didekati kursor nggak ada link homepagenya
BalasHapusgan,, mhon maaf sblmnya,, sy mau tanya, cara ganti gambar header bawaan blog gmn ya caranya,, (tapi di tata letak tidak ada widget headernya) nyari2 di mbah google blm ada,, kbnykn yg ada widget header di tata letaknya... bingung sayah... boleh kirim jwbnnya ksini: aulia.izzatunnisa03@gmail.com
BalasHapusplease help me... :(
Terima kasih gan :)
BalasHapusArtikelnya keren gan, visit balik hearier.blogspot.com,
BalasHapusAda dua, b:skin fren yang mana neh
BalasHapusTerimakasih banyak gan, sangat bermanfaat sekali tutorialnya..
BalasHapus