素敵なサムシングを独断と偏見で一方的に紹介するブログ(´・ω・`)

IT

投稿日:

【デザイン向上】WordPressのカテゴリにアイコンを設定出来る「Easy Category Icon」【プラグイン】

Anker PowerCor

created by Rinker
Anker
¥4,990 (2024/04/03 21:42:08時点 Amazon調べ-詳細)

旅行には必須の大容量モバイルバッテリー!

[ノースフェイス] THE NORTH FACE メンズ アウター マウンテンライトジャケット

created by Rinker
THE NORTH FACE(ザノースフェイス)
¥33,430 (2024/04/03 21:42:09時点 Amazon調べ-詳細)

防水暴風で耐久性抜群なので旅行で大活躍です!

ペヤング ソースやきそば 120g×18個

created by Rinker
ペヤング
¥2,600 (2024/04/03 21:42:16時点 Amazon調べ-詳細)

とりあえず保存食として買っておけば間違いなし!

レッドブル エナジードリンク 250ml×24本

created by Rinker
Red Bull(レッドブル)
¥4,000 (2024/04/03 21:42:12時点 Amazon調べ-詳細)

翼を授けよう!

Bauhutte ( バウヒュッテ ) 昇降式 L字デスク ブラック BHD-670H-BK

created by Rinker
Bauhutte(バウヒュッテ)
¥14,935 (2024/04/03 21:42:10時点 Amazon調べ-詳細)

メインデスクの横に置くのにぴったりなおしゃれな可動式ラック!

BANDAI SPIRITS ULTIMAGEAR 遊戯王 千年パズル 1/1スケール

created by Rinker
BANDAI SPIRITS(バンダイ スピリッツ)
¥7,500 (2024/04/03 21:42:14時点 Amazon調べ-詳細)

もう一人の僕を呼び覚ませ!!

サンディスク microSD 128GB

スマホからSwitchまで使える大容量MicroSDカード!

スポンサーリンク

336×280




カテゴリーにアイコンをつけたい

複数カテゴリーの記事を執筆しているブログでは、Wordpressのウィジェット機能を使ってサイドバー等にカテゴリメニューを表示していると思います。

しかし、デフォルトだと文字リンクだけが表示されなんかパッとしないですよね。。。

アイコンとかが出るとそれだけで良くなるのになー。と思っていたところ、ぴったりなWordpressプラグインを見つけました!

EasyCategoryIcons

コチラのプラグインは、管理画面からカテゴリ毎にアイコンを設定する事が可能になります。

また、その設定は管理画面側やブログ側でも表示されるので、サイトデザインの向上にも良さそうですね。

使い方もとても簡単でしたのでご紹介します。

手順

インストール

まずはプラグインをインストールしましょう。

プラグイン>新規追加にて、検索ボックスにEasy Category Iconsと入れると、対象のプラグインがヒットするので今すぐインストールボタンをクリックします。

インストールが完了したら、有効化ボタンをクリックしましょう。

これでプラグインのインストールは完了です。

アイコンの設定

では、実際にカテゴリにアイコンを紐付けてみましょう。

カテゴリ編集画面を開くと、下部にCategory Iconsエリアが追加されていると思います。

ここでは任意の画像Fontawesomeの2種類からアイコン画像を選ぶ事が出来ます。
今回はFontawesomeを設定してみます。

Fontawesomeについては、以下の記事でご紹介をしているので宜しければご覧ください。

Add Font Awesome Iconにチェックを入れ、<i class="fa {対象アイコンクラス}"></i>の形式で入力し、更新ボタンをクリックします。

設定はたったこれだけです。

確認

では、確認をしてみましょう。

管理画面上では、対象のカテゴリにIcon画像が紐づいた事がわかります。

ブログ上のウィジェットにも表示されるようになりましたね!

終わりに

以上のように、自前で対応をするととても大変な作業も、プラグインを使えば簡単に実現することが出来ました。

文字だけのブログは読み手にも負担がかかってしまうので、バランス良くアイコンを使って見やすいブログを目指していきましょう。

336×280




336×280




CATEGORIES & TAGS

IT, , , , , , , , , ,

blogenist

Author: blogenist

関連記事

YouTubeも見てね♪

お名前.comサイドバー