使用方法
ツールを使用すると、自動的にクリップボードにアイコン用のショートコードが記憶されます。
あとは、投稿記事の編集中にコピペすればアイコンが表示されます。
基本的にswellで動作確認をしていますが、おそらく他のwordpressテーマでも利用可能。
FontAwesomeの初期設定は忘れずにしてください。
swellの場合は、最後にリンクを載せてる記事で初期設定ができると思います。
アイコンパターン(一部を抜粋)から、使いたい「アイコン名」をコピー
アイコン名 | 基本 |
---|---|
0 | |
camera-retro | |
hippo | |
calendar-days | |
paperclip | |
bell | |
cart-shopping | |
arrow-up-from-bracket | |
bolt | |
car | |
ghost | |
gift | |
headphones | |
font | |
hand | |
lemon | |
paper-plane | |
globe | |
city | |
handshake |
アイコン名 | 基本 |
---|---|
bomb | |
xmark | |
youtube | |
face-smile | |
snowflake | |
users | |
gamepad | |
mug-saucer | |
shirt | |
phone-volume | |
copy | |
forward | |
network-wired | |
hand-point-up | |
shield | |
address-card | |
restroom | |
toggle-on | |
scale-balanced | |
trophy |
アイコン名 | 基本 |
---|---|
poo | |
cloud | |
comment | |
wrench | |
robot | |
hospital | |
square-check | |
square-xmark | |
crown | |
lightbulb | |
dice | |
volume-high | |
user-large | |
tower-broadcast | |
snowman | |
scissors | |
sack-dollar | |
person-military-pointing | |
microphone-lines | |
hand-peace |
アイコン名 | 基本 |
---|---|
truck-fast | |
pen-nib | |
arrow-up | |
folder-tree | |
face-laugh-beam | |
dice-one | |
dice-six | |
computer | |
child-reaching | |
cat | |
discord | |
sketch | |
internet-explorer | |
fedex | |
amazon | |
steam | |
line | |
※紹介したのは一部のみ。全種を確認したい場合はFont Awesomeサイトにて(記事時点で2020種)
※上の表からコピーするか、Font Awesome公式(こちらなら全種あります)から「アイコン名」をコピーして下さい。
【 ファミリー 】:
【 スタイル 】:
【アニメーション】:
【 回転 】:
【 サイズ 】:
-------------------------
※無料版では、ファミリー「Classic」、スタイル「Solid」以外はほぼ非対応。
ただし、ブランド固有のアイコンは「brands」スタイルを選択する必要があります。
※「アニメーション/回転」 に関してはアイコンイラスト種類によって対応していない場合があります。
また、「アニメーション/回転」は基本的にどちらか片方のみしか対応していないケースが多いです。
備考(よくわからない人用)
swellでは、デフォルトのアイコン以外にFont AwesomeSwellのアイコンも使用でき、アニメーションなども付けることが出来ます。
swellで基本対応しているのは、無料部分のみなのですべてのアイコンを利用したい場合は、Font Awesomeの有料会員になる必要があります(使用できるアイコンが2020⇒2万以上 ※本記事作成時 調べ)。
今回使用しているのは、すべて無料部分となります。
swellテーマでのFont Awesome導入に関しては、別ページにて(そちらでもツールを載せてますが少し仕様が異なります)。