Tampilkan postingan dengan label font. Tampilkan semua postingan
Tampilkan postingan dengan label font. Tampilkan semua postingan

Kamis, 04 September 2014

Mengganti & Memasang Font Di Artikel Blog Lebih Banyak

Mengganti & Memasang Font Lebih Banyak Di Artikel Blog terkadang perlu dilakukan dan terkadang sangat tidak perlu dilakukan karena jika kita terlalu banyak memasang font di blog atau pun sering mengganti font blog maka juga tidak baik untuk keadaan blog. Lalu berapa kali seharusnya mengganti dan memasang font di blog? 6 bulan atau 1 tahun sekali mungkin juga bisa atau tergantung sesuai keinginan pemilik blog itu, yang pastinya jangan terlalu sering-sering mengganti font blog

Baca juga Hanya mengganti font blog yang ada di artikel blog

Kemarin saya juga membuat artikel tentang mengganti font dan sekarang saya membuat artikel dengan judul yang sama. Apa perbedaan artikel yang kemarin dengan artikel yang sekarang? Meski memiliki judul yang sama tapi isinya berbeda. Jika pada artikel sebelumnya untuk mengganti font di artikel blog cuku dengan memilih font-font yang ada di menu Font yang telah tersedia dan font yang disediakan hanya ada 7 font yang disediakan oleh Blogger yaitu Arial, Courier, Georgia, Helvetica, Times, Trebuchet, dan Verdana

Mengganti & Memasang Font Di Artikel Blog Lebih Banyak

Dengan adanya 7 font yang disediakan tersebut sebenarnya sudah cukup untuk memperindah tampilan font artikel. Namun bukan Blogger pandainya jika tidak ingin sesuatu yang beda didalam blognya. Merak pun berramai-ramai mengganti font di blognya dan rata-rata mereka menggunakan font yang disediakan oleh Google font

Lalu apa maksud dan tujuan dari artikel ini? Sama seperti pada artikel sebelumnya, dalam artikel ini juga mengganti font hanya di artikel blog saja dan tentunya font-font yang digunakan lebih banyak dan berbeda dari font yang telah ada. Caranya pun hampir sama, cukup meletakkan kode font didalam artikel maka font artikel pun langsung berganti

Cara Mengganti & Memasang Font Di Artikel Blog Lebih Banyak
Untuk mengganti font yang berbeda dengan banyak pilihan yang menyesuaikan dengan keinginan maka cukup memilih font yang ada didalam Google Fonts atau seperti yang telah saya jelaskan di artikel sebelumnya

Baca juga Cara lengkap memasang Google font di blog

Setelah menemukan font yang diinginkan, salin url font tersebut dan gunakan kode css font dibawah ini untuk mengganti font didalam artikel blog

<style type="text/css">
@import url(link google font);
</style>

Keterangan: Ganti link google font dengan link font yang telah didapat di Google font

Contoh:
Di Google fonts, saya memilih jenis font Comfortaa, maka saya memiliki link font tersebut seperti berikut ini
http://fonts.googleapis.com/css?family=Comfortaa

Maka dengan menggunakan kode css font diatas, salin kode berikut ini sebelum artikel blog dengan format penulisannya adalah sebagai berikut:
<style type="text/css">
@import url(http://fonts.googleapis.com/css?family=Comfortaa);
</style>

Untuk menerapkan font Comfortaa kedalam artikel gunakan fungsi SPAN untuk memanggil kode font yang telah disediakan
<span style="font-family:'Comfortaa', san-serif;font-size:22px;">
Tulisan Disini
</span>

Hasilnya adalah sebegai berikut ini
Ini adalah hasil tulisan yang menggunakan font Comfortaa dan memiliki tampilan font yang berbeda dengan tulisan yang lainnya yang ada didalam artikel ini

Bagaimana jika fontnya banyak?
Jika font yang digunakan banyak maka font yang dipilih di Google font juga banyak, sehingga link fontnya adalah seperti berikut ini
@import url(http://fonts.googleapis.com/css?family=Quicksand:700|Lobster);

Dengan menggunakan fungsi SPAN, maka hasil dari penggunaan font yang banyak di artikel blog adalah seperti berikut ini
Tulisan ini menggunakan font Quicksand Tulisan ini menggunakan font Lobster Tulisan ini menggunakan font Comfortaa

Bagaimana keren bukan penggunaan font Comfortaa diatas, jika tertarik untuk mengganti & memasang font di artikel silahkan gunakan cara diatas :)

Rabu, 03 September 2014

Mengganti Font Hanya Di Artikel Blog

Mengganti Font Hanya Di Artikel Blog adalah pekerjaan yang agak terlalu rumit jika harus menyangkut kode-kode css dalam pemasangannya namun hal tersebut harus tetap dilakukan jika menginginkan tampilan font blog lebih bagus dari biasanya

Jika kita kesulitan mengganti font dengan menggunakan kode css untuk font, maka kita bisa menggunakan fitur yang sudah ada didalam kolom penulisan artikel blog dengan cara memilih langsung font yang kita inginkan

Baca juga Cara lengkap memasang Google font di blog

Lihat tampilan kolom entri penulisan artikel di Blogger berikut ini

Mengganti Font Hanya Di Artikel Blog

Keterangan:
  1. Tulis artikel dalam mode Compose
  2. Blok seluruh artikel yang telah ditulis. Jika ingin mengganti semua font dalam artikel, blok seluruh artikel
  3. Klik menu Font dan pilih font yang tersedia sesuai dengan keinginan

Mengganti font artikel blog dengan cara diatas hanya bisa mengganti font-font yang hanya terbatas disediakan oleh Blogger yang terdapat didalam menu Font yang hanya memiliki 7 jenis font

Untuk mengganti font artikel blog yang lebih keren dan bagus dengan banyak pilihan jenis dan bentuk font, tunggu update artikel berikutnya :) atau baca dulu Beberapa font blog yang biasa digunakan oleh para Blogger

Cara Lengkap Memasang Google Font di Blog

Cara Lengkap Memasang Google Font di Blog - Jika didalam blog tidak ingin terpasang font yang aneh-aneh maka cukup menggunakan font yang umum dikenal oleh browser yang tidak perlu memasang kode font tersebut kedalam template. Namun jika ingin memasang font-font tertentu yang tidak bisa di load oleh web browser yang digunakan maka diperlukan penambahan kode font tersebut kedalam template

Baca juga Beberapa font yang biasa digunakan

Cara Lengkap Memasang Google Font di Blog

Cara Lengkap Memasang Google Font di Blog

Untuk memasang font di blog, langkah pertama yang perlu dilakukan adalah memilih dan menentukan font itu sendiri dan memilih font yang dipasang, anjuran saya adalah memilihnya di Google fonts dengan mengunjungi http://www.google.com/fonts
Kenapa harus menggunakan Google fonts? Karena font-font yang disediakan oleh Google tersebut sifatnya bebas dan mudah digunakan yang telah dilengkapi dengan kode-kode css/script untuk dipasang kedalam blog

Cara Lengkap Memasang Google Font di Blog

Di Google font terdapat 600 font yang bisa digunakan dan bisa digunakan secara bebas. Selain itu, juga terdapat pengaturan-pengaturan yang sudah disediakan untuk menggunakan font-font yang telah dipilih. Misalnya di menu bagian sebelah kiri, bisa mengetahui bentuk font tersebut yang terdapat pada menu Show all styles dan di bagian atas, bisa diketahui bentuk font yang digunakan dengan menuliskan teks atau kalimat di kolom Preview Text

Cara Lengkap Memasang Google Font di Blog

Memasang Google Font di Blogger
Untuk memasang font di blogger lebih mudah dilakukan daripada memasangnya di WordPress yang masih memerlukan plugin untuk di upload. Pilih fonta yang akan digunakan dan klik tombol Quick-use

Cara Lengkap Memasang Google Font di Blog

Pada halaman berikutnya akan terlihat tampilan beberapa bentuk dari font yang telah dipilih tadi, scroll kebawah sampai pada kolom seperti berikut ini

Cara Lengkap Memasang Google Font di Blog

Salin kode <link href='http://fonts.googleapis.com/css?family=Comfortaa' rel='stylesheet' type='text/css'>
dan jangan lupa menambahkan string dibelakang kode, sehingga menjadi seperti berikut ini
<link href='http://fonts.googleapis.com/css?family=Comfortaa' rel='stylesheet' type='text/css' /> kedalam template blog

Sekarang bukalah akun blogger Anda....
Didalam dashboard akun blogger, pilih salah satu blog yang ingin dipasang kode font, selanjutnya ikuti langkah berikut ini :
Pilih menu Template >> Edit HTML
Cari kode <head> atau </head> dan salin kode font seperti berikut ini setelah atau sebelum <head> atau </head>
<link href='http://fonts.googleapis.com/css?family=Comfortaa' rel='stylesheet' type='text/css' />
Simpan template

Untuk mengganti tampilan font blog....
Masih didalam pengeditan template blog, carilah element atau bagian blog yang ingin diganti fontnya, misalnya Anda akan mengganti seluruh font artikel blog, maka kodenya seperti berikut:

.post-body {
font-family: Arial;
font-size: 22pxk;
line-height: 1.4em;
}

Element pada post-body tersebut akan menghasilkan bentuk tulisan artikel seperti berikut ini dengan menggunakan font Arial

Cara Lengkap Memasang Google Font di Blog - Jika didalam blog tidak ingin terpasang font yang aneh-aneh maka cukup menggunakan font yang umum dikenal oleh browser yang tidak perlu memasang kode font tersebut kedalam template. Namun jika ingin memasang font-font tertentu yang tidak bisa di load oleh web browser yang digunakan maka diperlukan penambahan kode font tersebut kedalam template

.post-body {
font-family: 'Comfortaa', san-serif;
font-size: 22pxk;
line-height: 1.4em;
}


Element pada post-body tersebut akan menghasilkan bentuk tulisan artikel seperti berikut ini dengan menggunakan font Comfortaa

Cara Lengkap Memasang Google Font di Blog - Jika didalam blog tidak ingin terpasang font yang aneh-aneh maka cukup menggunakan font yang umum dikenal oleh browser yang tidak perlu memasang kode font tersebut kedalam template. Namun jika ingin memasang font-font tertentu yang tidak bisa di load oleh web browser yang digunakan maka diperlukan penambahan kode font tersebut kedalam template

Itulah cara lengkap memasang google font di blog. Dengan memasang font seperti cara diatas, maka font tersebut akan berlaku untuk semua element yang menggunakan font tersebut. Bagaimana jika hanya artikel tertentu saja yang memiliki font berbeda dengan yang lainnya? Atau seperti yang terlihat pada artikel ini. Untuk itu akan saya update pada artikel berikutnya :)

Beberapa Font Blog Yang Biasa Digunakan

Beberapa Font Blog Yang Biasa Digunakan - Agar blog kelihatan lebih bagus, tidak hanya dilakukan dengan cara merubah atau mengganti tampilan blog dengan bentuk sedemikian rupa bahkan terlihat banyak warna disana-sini. Keindahan blog akan lebih terlihat jika dikombinasikan dengan beberapa font blog yang biasa digunakan untuk memperindah tampilan blog, khusus artikel blog yang terlihat semakin elegant

Beberapa Font Blog Yang Biasa Digunakan

Namun perlu juga diingat, sama seperti mendesain tampilan blog dengan penggunaan warna disana-sini serta pemasangan widget, jika terlalu berlebihan maka loading blog juga akan berpengaruh dan kenyamanan pengunjung blog juga akan terganggu jika loading blog terlalu lama untuk membuka halaman blog atau halaman artikel. Begitu juga dengan penggunaan font untuk blog, menggunakan font yang terlalu berlebihan juga akan mempengaruhi loading blog

Silahkan baca Mengetahui berat loading font blog

Berikut beberapa font yang telah biasa digunakan dan membuat tampilan blog lebih bagus dan nyaman dilihat. Jika Anda tertarik untuk memasangnya kedalam blog, sebagai saran yang terlalu berlebihan cukup gunakan tiga font saja. Beberapa font blog yang biasa digunakan ini merupakan font-font yang telah banyak digunakan oleh para blogger kreatif di Indonesia


Droid Sans
Lato
Ubuntu
Open Sans
Roboto
Oswald
Milonga
Comfortaa

Tertarik untuk menggunakan font-font seperti diatas? Silahkan ke http://www.google.com/fonts/

Di Google fonts, Anda bisa mencari beberapa font blog yang biasa digunakan untuk memperindah tulisan artikel blog dan sekali lagi, jangan terlalu berlebihan dalam menggunakan font untuk blog Anda

Minggu, 31 Agustus 2014

Mengetahui Berat Loading Font Blog

Mengetahui Berat Loading Font Blog Yang Digunakan - Percaya tidak kalau font yang dipasang dan digunakan di dalam blog ternyata mempengaruhi loading blog? Semakin banyak font yang digunakan didalam blog, maka loading blog akan semakin lambat. Baik jenis maupun tipe font yang digunakan juga akan mempengaruhi loading blog

Mengetahui Berat Loading Font Blog

Tidak hanya memasang banyak widget blog yang akan memperberat loading blog tapi jenis dan tipe font blog seperti tebal, miring, garis bawah dan jenis font yang biasa digunakan oleh beberapa teman-teman blogger seperti Droid font, Oswald font, Comfortaa font, Open sans font, Roboto font, Ubuntu font dan Lato font

Untuk tipe font blog seperti tebal, miring atau garis bawah bukan penandaan dari penggunaan setiap huruf yang ditulis didalam artikel yang biasa digunakan sebagai penandaan kata kunci atau keywords tapi tipe dari font itu sendiri yang memang memiliki bentuk tebal, miring atau garis bawah

Lalu bagaimana cara mengetahui berat loading blog
  • Buka https://www.google.com/fonts
  • Lihat, pilih, atau cari font yang ingin diketahui loadingnya, Misalkan disini saya memilih font Open Sans
    Mengetahui Berat Loading Font Blog
  • Pilih font tersebut dan masukkan kedalam koleksi font dengan cara klik tombol Add to Collection
  • Maka font akan terpilih dan masuk kedalam kolom koleksi seperti berikut ini
    Mengetahui Berat Loading Font Blog
    selanjutnya klik Use
  • Maka akan muncul keterangan bentuk font yang digunakan. Lihat bagian kanan, akan terdapat barometer yang menunjukkan berat loading font yang akan di load oleh blog
    Mengetahui Berat Loading Font Blog
  • Coba pilih berbagai bentuk font pada pilihan yang disediakan dan lihat hasilnya, maka semakin banyak bentuk dari font yang dipilih maka loading blog akan bertambah berat

Jadi, gunakanlah font blog sesuai kebutuhan agar loading blog tetap terjaga, terimakasih