Awesomeを使いたいのに、何故か表示されないんです。猫と歩けば壁にあたる。Awesomeを使いたいのに、何故か表示されないんです。Awesomeを使いたいのに、何故か表示されないんです。—ナカいろんなサイトさんにお邪魔させていただいていると、文字の前にアイコンみたいなマークが入っていることがあります。あれ、自分のサイトでも使いたいなぁ......とぼんやり思っていただけなのですが、一度使いたいと意識してしまったら、そのアイコンが無いだけでなんかずいぶんさみしいと感じるようになってしまいまして。当サイトでも使えるようにとカスタマイズしていくことにしました。Awesomeは無料版と有料版がある。Awesomeから必要なコードをコピーしてくる。コードをコピーしたら、head.phpに追加する。アイコンを使いたい場所にアイコンを追加してあげる。表示されないなと思ったら、無いといけない記述が抜けていた。Awesomeと言うものなんだそうです。Awesomeは、Web上でアイコンをアイコンフォントという形で使えるようにしているツールなんだとか。Awesomeを自分のサイトに表示させるための手順はそんなに難しくないのようなので、サクッと設定をしていくことにします。Awesomeは無料版と有料版がある。Awesomeを使用したい場合、無料で使う方法と、有料で使う方法があります。何が違うのかというと、使えるアイコンの種類の多さ。当たり前ですが、有料版の方が無料版に比べて使えるアイコンの数はむちゃくちゃ多いです。/yrに値上がりするそうです。言え、無料版でも、かなり多くのアイコンを使用することが出来ます。しても使わないといけない特殊なアイコンがあるんだ!っていうパターンじゃ無い限り、無料版でもサイトを賑やかにカスタマイズすることは可能です。Awesomeから必要なコードをコピーしてくる。Awesomeを追加するという作業情報は、2019年5月に追加したものです。Awesomeのサイトに移動しましょう。Awesomeさんは、日本語サイトじゃありません。サイトの言語は英語になります。サイトに移動したら、TOPページの左上にあるstartという文字をクリックします。Projectと書かれたページに移動しますので、このページの中央で一番目立っているコードをコピーします。設定は、無料で使う場合は変更する必要は無いと思います。有料で使いたい場合は、Proを選択して下さい。それ以外の設定は、使いたい用途に応じて調べて下さいです。右側にあるバージョンですが、アイコンごとに対応しているバージョンがあるため、コードの内容が若干異なります。現在の最新バージョンは5.8.2なので、コードの内容はこのような感じです。crossorigin=”anonymous”>これを以前のバージョンである5.7.2に変更する場合、コードの内容はこのようになるようです。crossorigin=”anonymous”>このように、バージョンによってコードの内容に違いがあるので、使用したいバージョンにあったコードをコピーする必要があります。分からなければ最新をコピーしておけば問題無いはず。アイコンごとの対応バージョンは、アイコンのページから確認できます。コードをコピーしたら、head.phpに追加する。Awesomeのサイトから必要なコードをコピーしてきたら、自分のサイトのhead.phpを開きます。htmlで作られているサイトの場合は、アイコンを追加したいhtmlを開いて下さい。コードを追加する場所は、<head>〜</head>の間です。</head>の前に追記してあげてくださいと説明されているサイトさんが多いので、その辺りに追加してあげれば良いかと思います。<head>〜</head>の修正が終わったら、保存したphp、またはhtmlをサーバーにアップします。アイコンを使いたい場所にアイコンを追加してあげる。これで、アイコンフォントを使う準備が出来ました。Awesomeで探します。サムネの一覧表示から根気よく探すのも良いですが、検索ボックスを使ってピンポイントで探してあげた方が、効率よく見つけることが出来ます。日本語は非対応なので、英語で探す必要はありますが。使用したいアイコンを見つけたら、アイコンのページに移動します。すると、アイコンの詳細(左)とサイズ・種類(右)が表示されているページが出てくると思いますが、ここの水色枠と赤枠で囲んだ部分が、アイコンを表示する為に必要な記述になります。スタイルシートを使って決まった場所にアイコンを表示させたい場合は、水色枠にあるユニコードを。記事の本文に直接書き込みたい場合は、赤枠にあるタグをコピーします。fa-archive”></i>となっています。“\f187”;}と言うように記述するようです。“\f187”;}となります。idで指定する場合は、.listの「.」を「#」に変更すればOKです。アイコンを追加してみたよ。アイコンを追加してみたよ。←すると、こうなるわけです。Animation」でさまざまなアニメーション効果を加える方法まで丁寧に解説します。Awesomeのサイトからコードをお借りしなくても、自分のサイトに必要な材料をアップして使うやり方もあります。してもアイコンが表示されないなどあれば、自分のサイトだけで動かしてみると表示されることもあるかもしれません。Awesomeとはアイコンを文字として扱うことを可能にしたツールです。画像ではなく文字なので、大きさや色などを変更することが可能!ところが説明は英語でかつ、ソースをコピーしてHTMLに書き込むなど、初心者にはなかなか難しいツール。peraichi.comで、ある程度設定が終わったところで躓きました。スポンサーリンク表示されないなと思ったら、無いといけない記述が抜けていた。※ここから先は、Surfaramaをカスタマイズしていた時のものです。設定すべきことは全部終わって、スタイルシートも必要なコードを追加したのに、何故かアイコンが表示されないんですけど......でも、その原因が全然分からなくて、結構長い間cssファイルとにらめっこしてました。気付いた表示されない理由。そもそもそこで躓くかよっていうところが間違っていました。"FontAwesome";という記述が抜けてたから。アイコンをどのフォントで表示するよという指定がすっぽ抜けていたのだから、どんなにコードを修正しても表示されるわけ無いですよね。使いたいアイコンのサイズ;(古いバージョンのアイコンだと、無くても表示されます)などがあります。この中の一つでも欠けてしまうとアイコンフォントは正常に表示されないので、どうやっても表示されない場合はこの辺りを疑ってみるといいのかもしれません。そんなわけで、タグの前にをつけて、目次の見た目をちょっとだけ変更。見栄えが悪いところはあるけれども、今日の所はここまで。post組み立てていたら、パーツが足りない!とりあえず問い合わせ中です。posthttpからhttpsに。descriptionというものを、ようやく設定したんですよという話。SSL設定がスクロールすると外れてしまったので修正してみた。ファビコンの設定ってカスタマイザーから出来るはずだよね?確か。国産のテーマが良いのか、海外産のテーマが良いのか。Lightboxで、特定の画像のみLightboxの設定をオフにする。子テーマを自作する前にちょっと待った!もしかしたら、子テーマも配布してくれているかも。postsそろそろやってくる確定申告。申告には種類があるっぽい。どんな種類があるんだろう?【パラサイト】全てを狂わせたその名は......。其処に有るのは格差社会の壁だった。モバイル側の表示速度が低速に。調べてみたら、第三者コードの影響を抑えてくださいって出てた。この言葉の中にどんな意味が含まれているんだろう?コンテナ式のキャリーを買ったら、コレが結構使えるやつだった。posts1Q.同人小説本のページ数って何ページからなんだろうね?同人あれこれ2結構アクセスが多いので、同人小説の文字数とレイアウトを調べてみた。同人あれこれ3Huluプレミアにあるノーエンドハウスってどんなドラマ?ドラマとか4httpからhttpsに。猫と歩けば壁にあたる。