1 Jul 2010

Cara Mengganti Font Blogger Dengan Google Font

Google telah meluncurkan layanan baru mereka... font web Google dengan slogan - 'Membuat Web Indah!'. Layanan ini akan memungkinkan Anda untuk menggunakan font kustom pada direktori font google di blog kita / website tanpa sign-up atau apa pun. Karena dari 'Google', itu tidak memiliki komplikasi dan juga benar-benar bebas untuk penggunaan komersial dan swasta., tidak ada pembatasan.  Hal ini bisa membuat blog Anda terlihat lebih gaya dan berlaku untuk blog blogger juga. Jangan heran, saya akan menunjukkan cara untuk melakukannya dengan blogger.

1. Masuk ke akun blogger anda, dan jangan lupa backup template.
2. Buka Google Font Directory dan pilih salah satu model yang ingin anda pergunakan dalam blog.


3. Klik pada nama pilihan anda, maka jendela baru akan terbuka, lalu klik Get The Code. Disini saya contoh kan dengan model Cantarell.

4. Copy dan pastekan setelah kode :
<head>
 

Catatan :  Harap menambahkan slash Forward ("/") sebelum akhir dari (">") tag kode ini. Kode di atas harus seperti ini :

<link href=' http://fonts.googleapis.com/css?family=Cantarell' rel='stylesheet' type='text/css'/>

Simpan Template.

5. Sekarang langkah terakhir. Dalam langkah ini, Anda harus menentukan di mana Anda ingin menambahkan font dan harus menambahkan kode css untuk itu. Jika Anda ingin membuat font muncul untuk kalimat tertentu saja dalam posting blog Anda,  gunakan kode HTML ini :

<div style="font-family: 'Nama Font Anda', serif;">Jenis Text Anda</div>

Ganti tulisan berwarna hijau dan orange dengan pilihan anda.

Jika Anda ingin font muncul untuk Anda pada :
  • Judul Blog
  • Judul Post
  • Isi Post
  • Font di sidebar
cukup tambahkan kode : font - family: 'Nama Font Anda'

Contoh, bila anda ingin agar tampilan judul posting yang diganti : cari  

.post h3 atau .post-title h3

lalu tambahkan / memodifikasi baris-baris di bawah kode di atas, sehingga akan terlihat seperti ini :

.post h3 {
font-family: 'Nama Font Anda';
}


Posisi utama dan kode css umum untuk setiap posisi adalah sebagai berikut :
  • Judul : h1
  • Judul Post  : .post h3 or .post-title
  • Isi Post  : .post-body
  • Sidebar : .sidebar h2

1 komentar: