インストールするだけで、簡単にすぐ使うことが出来て、ショートコードも使うことが出来ます。
WordPressプラグイン『Genericon'd』
このようなWebフォントアイコンが簡単に使える様になります。
プラグインページ
Genericon'dで検索しても出てきます。
インストールが完了しましたら、有効化します。
すると、ダッシュボードの外観のところにGenericon'dが出来ます。
『Genericon'd』の使い方
タグで書く事もできますし、ショートコードも使用できます。
タグを使用する場合は、
|
1 |
<div class="genericon genericon-github"></div> |
ショートコードを使用する場合は、
|
1 |
[genericon icon=tumblr] |
色を変更する場合は、
|
1 |
[genericon icon=twitter color=#4099FF] |
文字の大きさを変更する場合は、
|
1 |
[genericon icon=facebook size=4x] |
のように記載します。
詳細は、ダッシュボードのGenericon'dにも記載されています。
:beforeを使った例
使い方 -おまけ
下記のリンクへ行くと、HTMLとCSSコードをコピペすることが出来ます。
使用したいアイコンを選択します。（今回は、GitHubアイコン）
すると、上部左の絵がGitHubアイコンになります。
右の部分に書かれている
- Copy CSS ←:before要素
- Copy HTML ←htmlタグ
- Copy Glyph ←Photoshopのtextfiled
この部分をクリックするとコピペ出来るようコードが表示されるますので、あとは貼り付けるだけです。
とっても簡単にWebフォントアイコンがプラグインのご紹介でした。
