最近ブログカスタマイズにはまってる
桜母ちゃんです
難しい事は分からないよ！
設定の仕方だけ知りたいな!
そんな時はにゃん太が解決するなりよ♫
にゃん太はうっかり早とちりさんだし、桜母ちゃんは超初心者だから私もお手伝いするにゃ よろしくにゃん♪
疑問を解決！本日のテーマは
Font Awesomeを使う準備と使い方
はてなブログにも色々アイコンフォントあるけど、もっと沢山種類が欲しいな
それならFont Awesomeを使ってみるなりか？
無料版でもかなりのアイコンフォントが使えるなりよ！
うん！使ってみたい！！
少しだけ準備が必要なりョ♫
準備は簡単？
簡単にゃ♫自分専用のkitを取得してはてなブログの詳細設定に貼るだけにゃ♫
それなら簡単に出来そう！自分専用なんて何だか特別感があるね
ホントは方法が3つあるけど、桜母ちゃんには一番簡単な方法を伝えるにゃ♪
無料版ではこのkitは月間のPVが10，000までしか使えないなりよ！
月間10，000PVなんて夢みたい！いつかそうなったら･･･うふふ～
母ちゃん･･･（汗）大丈夫にゃ(超えないニャ）･･･簡単なやり方教えるなりよ
にゃん太 心の声が出てるにゃ
そんな時が来たらコチラの記事を参考にさせてもらうにゃ♪
※お名前分からずごめんなさい！コチラの記事を参考にさせて頂きました。ありがとうございます！
Font Awesomeを使う準備
まずはFontAwesomeアカウントを作るなりよ！
Font Awesomeのアカウントを作る
Font AwesomeのHPへ行くなり♪
メールは届いたなりか？
おしまいにゃ♪
さぁ！Font Awesomeにログインするなりよ！
Font Awesomeにログインする
母ちゃんのページに入るなりよ♪さっそくyour kitを見てみるにゃ♫
your kitを確認する
このコードをはてなブログの詳細設定に貼り付けるなりよ♫
your kitを自分のブログに貼り付ける
おしまいにゃ♫準備完了！
いつでもアイコンフォントを使えるにゃ～！
うそっ！ホントに簡単だった！！
Font Awesomeの使い方
さっそくアイコンフォントを使ってみるなりか！
うん！うん！！テンション爆上がり♫
使いたいアイコンを選択する
母ちゃんが使えるのはこの2種類なりよ♫
フォントアイコンのコードをコピーする
HTML編集に貼り付ける
ホントはこれでアイコンフォントが表示されるはずにゃんだけどニャ･･･
はてなブログではこのままでは表示されないのにゃ･･･
え それはいつか改善して欲しいね･･･はてな様お願いします
はてなブログでfontAwesomeのアイコンフォントを表示させる方法
大丈夫にゃ！ちゃんと方法があるにゃ♫
覚えてしまえば簡単なりよ♫
分かった！可愛いフォント使いたいから覚えるっ
HTMLでタグを書き換える
この二つだけにゃ！
この＆ｎｂｓｐ；って何？？？
「半角スペース」の意味なりよ これが無いとはてなブログではアイコンフォントを認識してくれないのにゃ･･･
慣れてきたら色々できる
え～これも改善してほしいなぁ まぁ その内慣れるかな！
めっちゃかわいい～～～♫こんなに色々出来るなら覚える価値ありそう！
じゃ ブログライフ楽しんでにゃ♪
まとめ
Font Awesomeのキットコードを使うにはアカウント登録が必要
キットコードは月間10,000pvを超えるサイトでは使えない（無料版）
キットコードは設定の詳細設定の中の＜head要素＞に貼り付ける
Font Awesomeの無料版で使えるアイコンフォントの種類は2種類
Font Awesomeのアイコンフォントは<i>タグで書かれているが、はてなブログで表示させたいときは<span>タグに書き換える必要がある
</span>の前に＆ｎｂｓｐ；を入れる必要がある
アイコンフォントは大きさ、色、角度、などを変えることが出来る
いかがでしたか。少しでも参考になる事が書いてあったら幸いです。
それではまた（＾＾）/
桜母ちゃんでした
桜母ちゃんのメインブログ
『桜の一歩！』はこちら
『sakura _nyans』もよろしくにゃ♪
ある日のにゃん太とにゃん子
母ちゃんの携帯見たことあるなりか？
にゃん太趣味わるっ！嫌われるなりよ
母ちゃんが心配なだけにゃ
何を見ちゃったなりか！
母ちゃん転職アプリが15個も入ってるなりよ！！
･･･。
