TumblrPocketWebページを見ていると、あちこちで見かけるのが、下のような様々なアイコンです。見てる分にはいいんですけど、実際に自分でWebページを作る時に、僕は、昔からこのアイコンにえらく悩みました。そもそも、センスのいいアイコンなんか僕には作れませんから・・・。銀行そうこうしているうちに、世の中には、フリーで使える、こういったアイコン画像をアップしてくれるサイトなんかも出てきました。自分で考えて作らなくてよくなっただけでも、随分、楽にはなりましたけど、実際にはめ込んでから、やっぱり色が合わないとか、大きさが違うとか、その都度、グラフィックソフトで、画像をいじらなければならず、めんどくさい事、この上なく、Webページを作る上で、最も嫌いな要素の一つでした。なんていう、Web上でよく利用するアイコンを、画像ではなく文字として表示できるフォントセットにしたものを提供してくれるサイトが出てきたりして、便利になったものです。アイコンを文字として扱えるから、色や大きさを変えたりってのが、画像をいちいち、いじっていた事を考えれば、とっても楽ちんです。Awesome!!(^^)導入も簡単で、一般的な導入方法を下記のページで丁寧に解説してくれていたので、よければ見てみて下さい。読み込んでもらうのが楽でいいと思います。その場合は、以下を<head>~</head>内に書き込んでもらうだけです。rel="stylesheet">あとはアイコンを表示させたい場所に、以下のような感じで書き込みます。fa-flag」こんな感じになります。ページで、お好みのアイコンを見つけて、上記の「fa-flag」部分を、お好みのものに変えてもらえばいいだけす。あとは、これをCSSを使って、大きくしたり、色を変えたり、位置を調整したりって感じですね。ページには、アイコンの大きさを変えたり、回転、囲み等のCSSが予め用意されているので、それを利用するのもいいかと思います。記事の本文中で使う場合は、上記と同じように、header.phpの<head>~</head>内に、font-awesome.min.cssを読み込んで、アイコンを表示させたい場所に、上記と同じように書き込むだけです。Icons」なんていうプラグインもあるみたいで、ショートコードも使えるみたいだし、そっちを使っちゃった方が楽かもしれませんけど・・・。Iconsの分かりやすい解説がありましたので、見てみて下さい。Menusっていうプラグインがあるみたいです。こちらも、以下のページに分かりやすい解説がありましたので、見てみて下さい。Awesomeを使うには?って思うわけで、そうなると、さすがに、プラグインじゃなくて、手動設定かと思うので、そのやり方を書いてみます。ようは、スタイルシートに「:before」とか「:after」の疑似要素を使って、入れてやるって感じです。color:#088f15}上記のulやliの手前の部分は、それぞれの項目で確認して下さいね。none」は、リストの手前に出る黒丸を非表示にしています。ここで肝心なのが、「content:”\f000′′」の部分です。WordPressのCSSの編集画面で半角の「\」を入力すれば表示されます。ページで、お好みのアイコンをクリックして開いて来たページで確認できます。下図の赤枠の中ですね。使えば、アイコンの変更も簡単だし、大きくしたり色を変えたり、角度を変えたりと、簡単にできてしまうので、超絶楽ちんです。コメントをキャンセルメールアドレスが公開されることはありません。*サイトコメントへの返信のメール通知をご希望の場合はチェックして下さい。ついてWordPress.orgドキュメンテーションサポートフォーラムフィードバックログイン。