WordPress アイコンのプラグイン「Visual Icon Fonts」で絵文字を表示しよう!

iconイメージ

いろんなサイトでよく見かける icon-check-square こんなようなチェックボックスを使いたくて、ネットで調べていたら見つけました!

ボタンをクリックするだけで、絵文字を表示させるプラグイン「Visual Icon Fonts

「Visual Icon Fonts」の良い点をいくつかあげてみます。

icon-pencil 簡単インストール

icon-pencil 種類が豊富(409種類)

icon-pencil ボタン一つでアイコン表示(コードの記述がいらない!)

icon-pencil 色も大きさも簡単に変えられる

コードの記述は全くいらないっていうのが一番ポイントが高いですね!

他にも絵文字を表示させるプラグインはあったんですが、コードを入力する必要があるなど、「Visual Icon Fonts」に比べて使い勝手が悪いです。

しかも、「Visual Icon Fonts」は使えるアイコンがなんと409種類もありますので、希望どおりのアイコンはだいたいあります。

スポンサーリンク

1.「Visual Icon Fonts」のインストール方法

以下のどちらかの方法でインストールしてください。WordPressの最新バージョンではテストは行われていないようですが、WordPress4.9.4では問題なく動作しています。

   方法1

①WordPressの管理画面から[プラグイン]-[新規追加]をクリックしてください。

②「Visual Icon Fonts」で検索します。

 うまく検索されない場合があります。その時は、方法2をお試しください。

③「今すぐインストール」をクリックしてください。

④「有効化」も忘れずに!

インストール方法①

   方法2

WordPress公式サイトから「Visual Icon Fonts」のzipファイルを任意の場所にダウンロードします。

公式サイトからダウンロード

zipファイルの保存

②ダウンロードしたzipファイルをアップロードして、「今すぐインストール」します。

アップロード

③「有効化」も忘れずに!

たったこれだけです!簡単にインストールできましたね。

2.使い方

非常に簡単です。

ビジュアルエディターで確認してみましょう。

iconボタン

「Visual Icon Fonts」をインストールすると、上の図のようにIconのボタンができます。
このボタンを押すと、利用できるアイコンが表示されます。

アイコン選択画面

お好きなアイコンを選択すると、ビジュアルエディターにアイコンが反映されます。

サンプル①

ただ、これではちょっと寂しい感じですね。

アイコンを大きくしたり、色をつけたりできますので、試してみましょう。

色・サイズ

記事に合わせて、装飾すると見栄えがよくなると思います。

3.アイコンの全種類

全部で409種類あります。

実際に使用するのはそのうちの数種類だと思いますが、参考までに全種類を載せておきますね。

アイコン全種類

お気に入りはありましたでしょうか?

まとめ

いかがでしたか?

こういったアイコンは好き嫌いがあるかもしれませんが、僕は文章にメリハリがついていいかなと思います。

例えば、箇条書きにする際に、単に「・」ではなく、「 icon-check 」にした方が、目立って見やすいのではないでしょうか。

あまりごちゃごちゃアイコンをつけるのもどうかと思いますので、適切な箇所にさりげなく表示させるのがおすすめです!

それでは。