Search here

Type a word related to the post, then click the search button !

Memuat...
English
Bru masuk angin!

Arsip...

Flag Counters

Flag Counter

Pengikut

Recent Comments plus Kode CSS Box Gelap

Recent Comments

blog-indonesia.com

Vertical Menu

CLICK any categories for open!
Gubhug Reyot

Sobat Ngeblogh

Sobat Ngeblogh

Buat sobat blogger yang mau ikutan jadi follower silahkan KLIK link Follower (Follow) di ujung kanan-bawah. Dari hasil monitoring, ternyata yang link-nya telah dimasukkan ke "Sobat Ngeblogh" mengalami pertambahan pengunjung secara signifikan!
Terima kasih .: Salam :.
gubhug reyot

Font Spesial untuk Blogger Menggunakan Google Font API

Mungkin sampeyan tertarik untuk menggunakan jenis-jenis font yang selama ini belum tersedia dan biasa digunakan di blogger/blogspot? Ditanggung font ini akan terlihat secara sempurna saat dibuka oleh siapapun juga sekalipun kompu/PC mereka tidak dilengkapi "diinstal" dengan font dimaksud. Mengapa bisa demikian dan bagaimana cara melakukannya?

He ... he ... inilah salah satu kelebihan yang blogger miliki. Dengan memanfaatkan Google Font API yang disediakan dalam bentuk kode CSS, maka beberapa font bergaya berbeda dengan gampang bisa kita manfaatkan untuk membuat penampilan blog yang berbeda. Cukup dengan meletakkan link kode CSS di bawah tag pembuka <head> serta sedikit menambah atau merubah kode CSS yang terdapat di template maka dalam kerjapan mata berbagai pilihan baru jenis font dapat dinikmati.

Cara menampilkan jenis font baru menggunakan Google Font API

  • Login ke blogger.
  • KLIK "Design/Rancangan".
  • KLIK "Edit HTML".
  • Cari kode <head>. kemudian letakkan link kode CSS di bawahnya..
  • Buat kode CSS dengan memanfaatkan font-family sesuai link kode CSS yang digunakan.
  • KLIK "SAVE/Simpan Template".
  • Lihat hasilnya dengan membuka blog.


Contoh penggunaan dan penyimpanan link kode CSS

Link kode CSS ini dapat digunakan saat sampeyan akan menggunakan font-family Droid Serif.

<link href='http://fonts.googleapis.com/css?family=Droid+Serif:regular,italic,bold,bolditalic&subset=latin' rel='stylesheet' type='text/css'>



Bentuk kode CSS

Contoh-1:
.post h3 {
padding:0 0 4px;
line-height:1.4em;
font-family: 'Droid Serif', arial, serif;
}

Contoh-2:
h1.droser { font-family: 'Droid Serif', arial, serif; font-weight:bold;}

Contoh-3:
#header h1 { 
margin:0 5px 0;
padding:0 20px .25em;
line-height:1.2em;
letter-spacing:.2em;
font-family: 'Droid Serif', arial, serif;
}


Rubah kode CSS di atas sesuai kebutuhan blog dan simpan di atas kode ]]></b:skin>

Beberapa font family yang lain bisa sampeyan tampilkan dengan link CSS yang sesuai dan perubahan pada kode CSS. Berikut ini beberapa link kode CSS-nya:

<link href='http://fonts.googleapis.com/css?family=Cantarell&subset=latin' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Lobster&subset=latin' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Droid+Sans:bold&subset=latin' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Droid+Serif:regular,italic,bold,bolditalic&subset=latin' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Tangerine&subset=latin' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Reenie+Beanie&subset=latin' rel='stylesheet' type='text/css'>


Link CSS tersebut di atas untuk font-family: Cantarell, Lobster, Droid Sans, Droid Serif, Tangerine dan Reenie Beanie.

Jika ingin lebih banyak font lain yang berbeda, silahkan sampeyan klik link di bawah ini:



Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :





» Happy Blogging - gubhugreyot «


Bila tak pegal di tangan
silahkan tulis sebuah komentar!

gubhug reyot

 
GR | Edited by | gubhug reyot