Pada potensi ini, saya apalagi dulu akan membahas mengenai mengganti jenis Font dengan CSS Fonts dan bukan dengan Custom Font, yang memakai javascript dan umumnya bersumber dari API Google. Penggantian font dengan font CSS lain, walaupun sederhana tampilannya, tetapi cukup kondusif dan cepat di load, alasannya yakni Browser dan Computer sudah mempunyai database font-font tersebut (disebut "Web Safe Fonts").
Sekilas Tentang Jenis Font (font family) dalam CSS
Jenis font dalam CSS dinyatakan dengan properti font-family. sehingga dalam penulisannya, deskripsi CSS font-family dituliskan seumpama pola berikut:
p {font-family: "Times New Roman";....;}atau dipersingkat dengan shorthand (dituliskan dengan font saja):
p {font: "Times New Roman";....;}
Ada dua klasifikasi jenis font:
a. Font family: Nama-nama utama (root name) font, misalnya "times", "arial", courier", dll.
b. Generic family: Nama-nama font turunan, misalnya "serif", "sans serif", "cursive", dll.
Penulisan font-family yang sering kita temui dalam CSS berisikan font-family dan generic family. Keduanya dituliskan berurutan dengan tujuan apabila suatu font tidak tersedia dalam database suatu browser, maka browser akan merujuk pada jenis font lain yang sudah dituliskan di belakangnya.
Contoh:
p {font-family: "Times New Roman",Georgia,Serif;...;}
Note: amati tanda kutip pada Times New Roman. Tanda kutip dipakai pada nama font yang mempunyai jarak spasi kosong (white space).
Selalu tuliskan CSS jenis font dengan hukum seumpama di atas untuk berjaga-jaga apabila browser yang dipakai hadirin tak mempunyai database font yang diinginkan, sehingga browser sanggup eksklusif melompat ke jenis font lainnya.
Font Pada Template Blogger
Pada dasarnya font di dalam template Blogger diputuskan dengan CSS styling, sehingga jikalau mesti merubah jenis font, maka terang pergantian dijalankan pada CSS-nya. Ada dua cara yang umumnya dipakai untuk menghasilkan default font pada template Blogger:
1. Menuliskan variable CSS font untuk bagian-bagian (elements) tertentu, misalnya judul blog, deskripsi blog, judul posting, footer posting, footer, judul sidebar, dan seterusnya. Kemudian menuliskan variable tersebut pada font-family masing-masing elemen. Variable terletak di bab atas CSS, umumnya setelah/dekat <b:skin><![CDATA[. Contoh variable-variable-nya:
.......................
<Variable name="dateHeaderFont" description="Date Header Font"
type="font"
default="normal bold 117% Arial, sans-serif" value="italic wajar 80% Arial, sans-serif"
>
<Variable name="postTitleFont" description="Post Title Font"
type="font"
default="normal bold 180% Georgia, Times, serif" value="normal bold 142% Trebuchet, Trebuchet MS, Arial, sans-serif"
>
.......................
Sebagai contoh, jikalau saya ingin untuk menyatakan jenis font yang dipakai dalam judul posting (header posting), saya memakai nama variable (name=) postTitleFont selaku perwakilan jenis font pada properti font family nama blog yang sudah dituliskan pada variable. Nama variable yang dipakai selaku deklarator dituliskan dengan diawali tanda $:
.post h3 {font-family: $postTitleFont;}2. Menuliskan eksklusif jenis Font pada property-nya (font-family atau font). Contoh:
.post h3 {font-family: "Georgia, times, serif;...;}
Dengan demikian poin serta cara untuk mengubah/mengganti jenis font di Blogger begitu mudah. Lanjut!
Mengubah Jenis Font di template Blogger/Blogspot
Sesuai dengan dua cara untuk menyeleksi font pada template Blogger di atas, maka sudah pasti cara untuk mengubahnya pun ada 2, yakni mengubah font pada variable atau langsung merubah property font-family di setiap elemen. Mengubah variable sungguh beresiko alasannya yakni ada nilai default dan value yang ialah hukum general pada elemen-elemen utama blog.. Oleh karenanya, lebih baik ganti font eksklusif pada properti font family-nya.
Cara mencari dan merubah jenis font family pada setiap elemen CSS:
1. Buka Edit HTML/Template Blogger.
2. Cari elemen CSS yang ingin di ubah, letaknya antara <b:skin><![CDATA[ dan ]]></b:skin>.
3. Setiap elemen CSS di template Blogger mempunyai nama berlainan sesuai yang sudah diberikan oleh pembuatnya, tetapi secara umum, nama-nama itu nyaris seumpama dan mempunyai deklarator lazim yang sama:
Misalnya: Untuk elemen judul posting, umumnya dituliskan dengan .post h3, .post h2, #post h3, #post h2, .h3, .h2, (h menyatakan header atau judul/title, berlaku pula untuk judul sidebar, dll), dan masih banyak lagi. Untuk isi posting umumnya dinyatakan dengan .post. Demikian dengan sidebar, ada banyak kombinasi tetapi sanggup ditentukan semua mengandung kata yang sama: sidebar.
3. Setelah mendapatkan element yang dicari, berikutnya cari property font-family atau font yang di belakangnya ada definisi font atau nama variable seumpama pola variable diatas. Ganti dengan jenis-jenis font gres pada bab tersebut. Contoh:
.post h3 {font-family: Georgia, times, serif;...;}
Ganti bab font yang berwarna biru dengan font-font lain.
atau umumnya juga ditampilkan dengan nama variable:
.post h3 {font-family: $postTitleFont;}
Ganti bab font yang berwarna biru dengan font-font lain.
4. Anda juga sanggup menyertakan jenis font gres pada elemen yang belum mempunyai hukum font-family.
Misalnya. bab comment blog saya belum mempunyai hukum jenis font khusus, maka saya sanggup menyertakan font-family/font di dalam hukum CSS-nya:
5. Untuk mengenali jenis-jenis font, cek CSS Web Safe Fonts.Sebelumnya:#comments {margin: 0px 0px 0px 0px; padding: 15px 20px 15px 20px; text-align: left; color: #4c4c4c; border: 1px solid #ccc;background:#fff;}
Sesudahnya:#comments {margin: 0px 0px 0px 0px;padding: 15px 20px 15px 20px; text-align: left; color: #4c4c4c; font: "Times New Roman", Trebuchet, Serif; border: 1px solid #ccc; background:#fff;}
6. Setelah tamat merubah atau memperbesar font, save template.
Jika ada dilema atau pertanyaan lebih lanjut mengenai font, pengubahan font, serta elemen CSS blog yang belum diketahui, feel free to use the comment form below. Jika ingin merubah font blog dengan Custom Web Fonts simak Cara Menggunakan/Memasang Custom Font di Blogger.
mencuri yakni pekerjaan pengecut! © buka-rahasia.blogspot.com
mencuri yakni pekerjaan pengecut! © buka-rahasia.blogspot.com
){kind=link}