Plugin/FontAwesome の変更点

• 追加された行はこの色です。
• 削除された行はこの色です。
• Plugin/FontAwesome へ行く。
• Plugin/FontAwesome の差分を削除

#author("2019-12-24T03:54:12+01:00","default:user","user")

*FontAwesome 

fontawesome.io が提供する Free Icon フォントを使用するためのプラグイン

http://fontawesome.io/examples/

~

CENTER:

&size(72){&fontawesome(fas fa-home);};

~


**書式

 &fontawesome( アイコンの class名 );

fontawesome で提供されているアイコンの「class名（後述）」を指定します。



-以下のサイトにあるフリーアイコンを使用することができます。

https://fontawesome.com/icons?d=gallery&m=free



-アイコンを選択すると、埋め込み用に以下のようなコードが提供されます。

 <i class="fas fa-home"></i>

-クラス名（ ''fas fa-home'' ）の部分のみを抜き出して、以下のように記述して下さい。

 &fontawesome(fas fa-home);

-記号の意味は以下のとおりです。 

--Fas：Font Awesome Solid

--Fad：Font Awesome Brand

~

~



**サンプル

 &fontawesome(fas fa-home);

&fontawesome(fas fa-home);



-事例：このサイトのヘッダー部分に使用しています。

[[SocialIcon]]

~

~



**応用

***アイコンに色をつけるには

以下のように &color(); プラグインと併用して下さい。

 &color(red){&fontawesome(fas fa-home);};

&color(red){&fontawesome(fas fa-home);};

~



***アイコンにリンクを設定するには

以下のように [ [ アイコン>リンク先 ] ] のリダイレクト表記で実現できます。

 [[&fontawesome(fab fa-instagram);>http://www.example.com/]]

-[[&fontawesome(fab fa-instagram);>https://www.instagram.com/explore/tags/%E4%B9%9D%E8%8A%B8/]]　← Click!

-[[&fontawesome(fab fa-twitter);>https://twitter.com/]]　← Click!

-[[&fontawesome(fab fa-facebook);>https://www.facebook.com/]]　← Click!

~

~