環境
2022/04/30
・Linux CentOS7
ダウンロードするもの
・Font Awesome 6.1.1
ダウンロード方法
FontAwesomeのダウンロード
FontAwesomeのダウンロード先からダウンロードしてきます。
私の時にはこのようなスクショの画面でした。
ここにチラ見えしている6.1.1 For The Webをダウンロードします。
Proにはお値段のかかる会員登録が必要になります。
今回はFree For Webをダウンロードしていきます。
Free For Webを右クリックして、リンクのアドレスをコピーします。
今回とれたURL。
https://use.fontawesome.com/releases/v6.1.1/fontawesome-free-6.1.1-web.zip
当然、バージョンが違えばこのURLは異なりますのでご注意。
$ wget https://use.fontawesome.com/releases/v6.1.1/fontawesome-free-6.1.1-web.zip
ちゃんとインストールされたか一応確認しましょう。
$ dir
fontawesome-free-6.1.1-web.zip
zipファイルなのでunzipで解凍しましょう。
LinuxではOSの環境によってzip関連のコマンドをインストールされていない場合があります。その場合はunzipのインストール方法を参考にインストールしてください。
$ unzip fontawesome-free-6.1.1-web.zip
解凍するファイル名はインストールするバージョンに合わせて変更してください。
解凍したファイルがあるかどうかの確認。
$ dir
fontawesome-free-6.1.1-web.zip
fontawesome-free-6.1.1-web
$ cd fontawesome-free-6.1.1-web
$ dir
LICENSE.txt css js less metadata scss sprites svgs webfonts
Example
FontAwesomeに必要なソースはこれでダウンロードし終えましたが、FontAwesomeがこれで使えるのかといわれるとなんだか不安な気もします。
そのため、例を使って確認してみましょう。
HTMLの表示の仕方については指定しないので整っている環境で試してみてください。
<img src="fontawesome-free-6.1.1-web/svgs/solid/font.svg">
表示されていればOKですね。
例では(たぶん)一番わかりやすいタグでsvgファイルを直接表示しましたが、
<i class="fa-solid fa-font"></i>
このような使い方がしたいのでしたら、linkタグをheadに書いて、
<head>
...
<link rel='stylesheet' href='fontawesome-free-6.1.1-web/css/all.min.css'>
...
</head>
とすればいいでしょう。
いじょう！