Cara Menggunakan Font Dari Komputer Di Blog
Cara Menggunakan Font Dari Komputer Di Blog - Sebenarnya postingan kali ini adalah request dari salah satu teman blogger kita. Yah, namanya tidak usah disebutkan, palingan entar juga nongol di kotak komentar :)
Mungkin dari kalian sudah tau bagaimana cara menambahkan font di blog dengan Google Font. Tetapi bagaimana jika anda belum puas dengan font yang sudah tersedia di layanan font gratis dari google itu? Nah disinilah anda membutuhkan cara ini. Mungkin kalian punya font yang keren-keren di komputer tapi tidak tau bagaimana cara menggunakanya di blog. Kalo mau tau caranya simak tutorial berikut ini.
Langkah 1 : Cara Mendapatkan @font-face Kit
1. Buka http://www.fontsquirrel.com/fontface/generator
Mungkin dari kalian sudah tau bagaimana cara menambahkan font di blog dengan Google Font. Tetapi bagaimana jika anda belum puas dengan font yang sudah tersedia di layanan font gratis dari google itu? Nah disinilah anda membutuhkan cara ini. Mungkin kalian punya font yang keren-keren di komputer tapi tidak tau bagaimana cara menggunakanya di blog. Kalo mau tau caranya simak tutorial berikut ini.
Langkah 1 : Cara Mendapatkan @font-face Kit
1. Buka http://www.fontsquirrel.com/fontface/generator
2. Pilih Add Fonts
3. Pilih Font yang ingin digunakan
4. Jika sudah menemukan font yang diinginkan pilih Open
5. Tunggu prosses upload font, lalu pilih Download Your Kit
6. Tunggu prosses loading pembuatan Kit-nya, jika sudah selesai akan langsung terdownload
Langkah 2 : Cara Upload @font-face Kit ke Hosting
1. Extract file yang sudah terdownload2. Buka Google Site lalu klik Create Site3. Isikan Tittle Site pada form yang tersedia, lalu klik Buat
4. Pilih Tab Create Page / Buat Laman pada pojok kanan atas site yang telah kamu buat tadi
5. Beri Judul Halaman, lalu klik Buat6. Pada laman baru kamu tadi klik Tambahkan File, pilih file type EOT, TTF, SVG, WOFF, dan CCS yang telah di extract, lalu klik Open
Langkah 3 : Cara Menambahkan Kode CSS Ke Template
Letakkan kode CSS dibawah kode ]]></b:skin>, Contohnya begini :
Sekian sedikit tutorial dari saya, semoga tutorial ini bisa bermanfaat bagi teman-teman blogger. Baca juga artikel tentang Cara Menambah dan Mengganti Jenis Font di Blog.
Sumber : BlogMasHanif
Langkah 2 : Cara Upload @font-face Kit ke Hosting
1. Extract file yang sudah terdownload2. Buka Google Site lalu klik Create Site3. Isikan Tittle Site pada form yang tersedia, lalu klik Buat
4. Pilih Tab Create Page / Buat Laman pada pojok kanan atas site yang telah kamu buat tadi
5. Beri Judul Halaman, lalu klik Buat6. Pada laman baru kamu tadi klik Tambahkan File, pilih file type EOT, TTF, SVG, WOFF, dan CCS yang telah di extract, lalu klik Open
7. Salin URL file yang bernama stylesheet.css pada link unduh
https://sites.google.com/site/adobecaslonpro/blog-mas-hanif/stylesheet.css?attredirects=0&d=18. Letakkan kode css itu pada template kamu, dengan menghilangkan kode yang berwarna merah
Langkah 3 : Cara Menambahkan Kode CSS Ke Template
Letakkan kode CSS dibawah kode ]]></b:skin>, Contohnya begini :
]]></b:skin><link rel='stylesheet' href='https://sites.google.com/site/adobecaslonpro/blog-mas-hanif/stylesheet.css' type='text/css'/>Langkah 4 : Cara Menggunakan Font
Sekarang setelah selesai melakukan langkah langkah sebelumnya anda tinggal memakai font itu. Contohnya seperti di bawah ini :
#outer-wrapper {margin:0 auto;padding:0px;text-align:$startSide;font-family:"adobe_caslon_proregular";font-size:13px;margin:10px auto;}
#header { max-width: 450px; text-align: left; color:#fff;float: left; font-weight: 700; font-family: adobe_caslon_proregular;}Catatan : Untuk mendapat nama font anda bisa membuka file yang bernama stylesheet.css dan menemukan kede seperti berikut ini :
@font-face { font-family: 'adobe_caslon_proregular';Huruf warna merah adalah nama font anda.
Sekian sedikit tutorial dari saya, semoga tutorial ini bisa bermanfaat bagi teman-teman blogger. Baca juga artikel tentang Cara Menambah dan Mengganti Jenis Font di Blog.
Sumber : BlogMasHanif
0 Response to "Cara Menggunakan Font Dari Komputer Di Blog"
BACA DULU SEBULUM BERKOMENTAR PERATURAN BERKOMENTAR DI BLOG INI :
- Di Wajibkan Berkomentar Dengan OpenID,supaya mimin bisa berkunjung balik
- Berkomentarlah sesuai artikel diatas,Jika diluar artikel gunakanlah tag [ OOT ].
- Berkomentar Disaran kan Sesuai Artikel
- Untuk Menyisipkan Kode Gunakan <i rel="code">Tulis kode yang sudah diparse di sini</i>
- Untuk Menyisipkan pre Gunakan <i rel="pre">Tulis kode yang sudah diparse di sini</i>
- Untuk Menyisipkan Catatan/Blockquote Gunakan <b rel="quote">Tulis catatan di sini</b>
- Untuk Menyisipkan Link Gunakan <i rel="anchor">URL DISINI</i>
- Untuk Menyisipkan Gambar Langsung Saja Tulis URL Imagenya
- Untuk Menyisipkan Video Youtube Langsung Saja Tulis URL Videonya
Konversi KodeEmoticon