LogoMarkWhite.png

Plugin/FontAwesome の変更点


#author("2022-07-12T12:06:47+09:00;2020-03-17T17:29:46+09:00","default:inoue.ko","inoue.ko")
#author("2022-07-12T12:07:57+09:00;2020-03-17T17:29:46+09:00","default:inoue.ko","inoue.ko")
#navi(../)
~

*Plugin FontAwesome
[[fontawesome.io>http://fontawesome.io/examples/]] の iconフォントを使用するためのプラグイン
~

***プラグインの活用方法
-引数 fontawesome で提供されるアイコンの class名
-記述例
 &fontawesome(fas fa-home);
 &color(red){&fontawesome(fas fa-home);};
&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/]] [[&fontawesome(fab fa-twitter); >https://twitter.com/]] [[&fontawesome(fab fa-facebook); >https://www.facebook.com/]] ← Click!
~

***利用できるアイコン
-以下のサイトでアイコンのクラス名を確認できます。
https://fontawesome.com/v5/icons/twitter?s=brands

-HTML埋め込み用に以下のようなコードが提供されています。
 <i class="fas fa-home"></i>
-クラス名( fas fa-home )の部分のみ抜き出してご利用下さい。
 &fontawesome(fas fa-home);
-記号の意味は以下のとおりです。 
--Fas:Font Awesome Solid
--Fad:Font Awesome Brand
--Fab:Font Awesome Brand
~

***利用例
-このサイトのヘッダー、フッターのアイコン表示に使っています。
[[SocialIcons]]
~
~

#navi(../)
~