WordPress アイコン ボックス プラグイン ベスト 7 (無料および有料)

アイコン ボックスのデザインは、製品やサービスの簡潔な概要を紹介する最適な方法です。 ボックス型のデザインで情報を表示すると、コンテンツを魅力的に見せることができます。 ただし、WordPress Web サイトでこのデザインを作成する場合は、アイコン ボックス プラグインの支援が必要です。

ただし、プラグインに関しては、多くのオプションがあります。 そして、それがまさにこの投稿の内容です。最高の WordPress アイコン ボックス プラグインについて学び続けてください。

アイコンボックスとは何ですか?

アイコン ボックスは機能ボックスに似ています。 基本的に、ボックス型のカード上で重要な情報を表示できるようになります。

通常、Web サイト ユーザーは、サービスや製品の詳細な説明を歓迎しません。 ただし、アイコン ボックス プラグインを使用すると、WordPress Web サイトでのこの面倒な作業を簡単に簡素化できます。

コンテンツのボックスを表示でき、その中には通常、タップしたままのアイコンや、タイトル、説明、ボタンなどのその他の要素が表示されます。 また、優れたプラグインを使用すると、アイコン ボックスの要素をカスタマイズして、基本的なUSP (Unique Selling Point) を直感的に強調表示できます。

それでは、最高のアイコン ボックス プラグインについて学びましょう…

トップ7のWordPressアイコンボックスプラグイン

ここでは、厳選したアイコン ボックス プラグインのコレクションをご紹介します。 これらのプラグインをテストし、すべての機能を使用してみました。 ここで紹介するプラグインには、無料オプションと有料オプションが混在していることに注意してください。

1.ElementsKitアイコンボックスウィジェット

プラグインの統計:

• アクティブなインストール: 100 万以上 (無料版)
• 評価： 5.0以上
• 最適な用途: 多目的アイコンボックス。

ElementsKit は、WordPress Web サイトのどこにでも視覚的に魅力的な情報や機能ボックスを提供するために使用できる、完全かつ多目的のアイコン ボックス プラグイン オプションです。 この機能は、ElementsKit プラグインの下にウィジェットとして表示されます。

ElementsKit アイコン ボックス ウィジェットは、アイコン、タイトル、説明、ボタン、およびバッジや透かしなどのその他のユニークな機能などのすべてを容易にします。 アイコン ボックスの機能に関するこのプラグインの大きな利点は、アイコンの膨大なコレクションであることです。 Font Awesome- Regular、Font Awesome- Solid、Font Awesome- Brands、ElementsKit Icon Pack にアクセスできます。

さらに、ElementsKit はホバー効果に関するいくつかのアニメーション効果も提供します。 アイコンに個別に適用することも、アイコン ボックス全体に適用することもできます。 そのため、製品やサービスの重点部分を表示しながら、さらに強力な機能を利用できるようになります。

長所:

• デバイスから SVG アイコンをアップロードします。
• ページ レイアウト内に簡単に配置できます。
• 豊富なアイコンコレクション。
• アイコンボックスの透かしを有効にします。
• バッジと枠線を追加してカスタマイズします。
• ボタンをホバー時のみ有効にします。
• 背景オーバーレイを使用してアイコン ボックスのスタイルを設定します。
• ElementsKit プラグインの無料ウィジェットとして利用できます。

短所:

• サードパーティのアドオンとして提供されます。

2.Elementorアイコンボックスウィジェット

プラグインの統計:

• アクティブなインストール: 500 万以上 (無料版)
• 評価： 4.6以上
• 最適な用途: 多目的アイコンボックス。

WordPress サイトで使用できるもう 1 つの無料プラグインは、Elementor Icon Widget です。 このプラグインの気に入った点は、ElementsKit のように追加のプラグインをインストールする必要がないことです。 Elementor と ElementsKIT の両方をインストールする必要がある場合。 そして、ユーザーインターフェイスは初心者にも優しいです。

ただし、ボタン、バッジ、透かしなどの ElementsKit のいくつかの強力な機能が Elementor にはありません。 最小限のアイコン ボックスを表示する場合に適しています。 ボタン機能がないため、訪問者をどこにもナビゲートできないのと同じです。

Elementor Builder を使用してアイコン ボックスにホバー効果を追加する場合、少しサポートが得られます。 また、私たちの最有力候補である ElementsKit のようなホバー効果には、オープニング アニメーション効果はありません。 ただし、Elementor アイコン ボックスは作業に便利で、十分なカスタマイズ機能を備えています。

長所:

• アイコンをカスタマイズし、その場所を定義します。
• ホバー時にアニメーション効果を適用します。
• タイポグラフィのスタイル オプションを取得します。
• モバイル対応のアイコン ボックス。

短所:

• バッジ、透かし、ボタンは追加できません。

3. カラーボックスパネルと情報ボックス

プラグインの統計:

• アクティブなインストール数: 1,000+
• 評価： 4.6以上
• 最適な用途: 多目的アイコンボックス。

このブートストラップ ベースのプラグインをテストしたところ、すべてのタイプのデバイスと互換性がありました。 私が感じた最大の欠点は、ユーザー インターフェイスが非常に複雑なことです。 WYSIWYG 機能を提供しますが、直感的なエクスペリエンスを実現できます。

ただし、このプラグインを使用すると、チーム ボックス、情報ボックス、機能ボックスなどのアイコン ボックスを作成できます。

長所:

• 豊富なカラーオプションが付属しています。
• 5 つのボックス レイアウトを容易にします。
• Font Awesome アイコンをサポートし、アイコン ピッカーと統合されています。
• ドラッグアンドドロップビルダーと統合されています。
• 石積み効果と同位体効果が利用可能です。
• アイコン表示の 2 つの異なるオプション。

短所:

• タイポグラフィーやアイコンのカスタマイズは付属しません。
• 自分のアイコンをアップロードすることはできません。
• ほとんどの機能はプロ版で利用できます。

4.ベテーマアイコンボックス

プラグインの統計:

• 最適な用途: 多目的アイコンボックス。

このアイコン ボックス要素は、Betheme ビルダー プラグインによって強化されています。 ボックス内の別の場所にアイコンを配置したい場合は、このプラグインがそれを実行します。 また、アイコン ボックスに直感的なホバー効果を適用することもできます。 特定のアニメーション効果の 1 つは、ボックス上にマウス カーソルを置くとボックス全体が動くことです。

ただし、このプラグインには無料版が付属していないため、これらの機能をすべて利用するには料金を支払う必要があります。 また、同じ価格で無料の代替品があるため、投資する価値はありません。

長所:

• ライブラリからアイコンを選択するか、カスタムアイコンを追加します。
• アイコンの異なる位置を設定します。
• すべてのデバイスに対して応答性の高いアイコン ボックスを作成します。
• 多彩なホバー アニメーション効果を適用します。
• ホバーするとアイコン ボックス全体が移動します。

短所:

• フルプランの料金を支払う必要があります。

5.サービスボックスショーケース

プラグインの統計:

• アクティブなインストール数: 5,000+
• 評価： 4.8以上
• 最適な用途: サービスベースのアイコン ボックス。

Service Box Showcase プラグインは、事前に構築されたテンプレートを使用してアイコン ボックスを簡単にデザインする方法を提供します。 名前の通りサービスを魅力的に表示するために使用できます。

このプラグイン ダッシュボードにはさまざまな便利な設定が含まれていますが、無料版で利用できるのはほんの一部だけです。 最終的には、すべてのブラウザーと互換性のあるレスポンシブなアイコン ボックスをデザインできます。

Service Box Showcase プラグインのもう 1 つの優れた点は、以前のプラグインのプロ バージョンでのみ使用できる「続きを読む」ボタンを追加できることです。

長所:

• Font Awesome アイコンとアイコン ピッカーをサポートします。
• ドラッグアンドドロップ API と統合されています。
• FAQ 項目をドラッグして簡単に並べ替えることができるようになります。
• アイコンと「続きを読む」ボタンを表示することを選択します。
• アイコン ボックスのカルーセル スタイルを提供します。
• タイトルとボタンのテキストのカスタマイズ オプションを提供します。

短所:

• 単一の目的のために開発されました。
• ほとんどの機能はプロ版で利用できます。

6.サービスボックス

アクティブなインストール: 500+

評価: 5.0

最適な用途: サービスベースのアイコン ボックス。

Service Box は、アイコン ボックスのシンプルなプラグインです。 サービス情報を表示するのに非常に適しています。 多彩なサービス スタイルを表示するだけでなく、サービスをグリッド ビューとスライダー ビューで表示することもできます。 また、サービスボックスをグループ化することもできます。

長所:

• サービスをグリッド ビューとスライダー ビューで紹介します。
• 16種類のスタイルからお選びいただけます。
• サービスボックスをグループ化します。
• 背景色と画像を追加します。
• アイコンボックスを使用してボタンを追加します。
• アイコン ボックスのタイポグラフィのスタイルを設定します。

短所:

• 主にサービスベースのアイコンボックスを作成するために開発されました。
• バッジや透かしは追加できません。

7. 情報ボックス（グーテンベルクブロック）

アクティブなインストール数: 1000+

評価: 5.0

最適な用途: 多目的アイコンボックス。

このリストに追加する最後のプラグインは Info Box です。この WordPress プラグインは Gutenberg エディター用に開発されました。 Gutenberg Web サイト用に完全にカスタマイズされたアイコン ボックスを作成できます。

さまざまなプリセット レイアウトを使用して、アニメーション化されたアイコン ボックスの作成を開始できます。 これは、すべてのコンテンツ要素の位置を個別に設定するためのコントロールを提供します。 また、アイコン ボックス内の各要素のすべてのカスタマイズ機能も容易になります。 全体として、これはアイコン ボックスの完全なソリューションです。

長所:

• Gutenberg ベースの直感的なインターフェイス。
• アイコンの代わりに画像を表示できます。
• アイコンのスタイルを設定するためのカスタマイズ機能を入手します。
• タイトル、サブタイトル、ボタンなどのすべての要素をスタイル設定するためのコントロールを取得します。

短所:

• バッジや透かし機能はありません。

最高のWordPressアイコンボックスプラグインを選ぶ方法

アイコンボックスのデザインに最適な WordPress プラグインの選択についてまだ迷っていますか? 通常、WordPress の要件に応じて複数のプラグイン オプションが提供されます。 ただし、すべてのプラグインが特定の要件や設定を提供しているわけではありません。

そこで、情報ボックスを表示する適切なプラグインを選択する際の基本的な最小要件を以下に示します。

要件を設定する

すでにご存知のとおり、アイコン ボックスはいくつかの要素で構成されています。 ただし、これらすべてを 1 つのバケット内に収めることは、ほとんどの場合困難です。 さらに、デザインにはバッジや透かしの表示など、特定のニーズがある場合があります。 そして、最も重要なことは、プラグイン アイコン ライブラリに好みのアイコンが含まれ、アイコンの代わりに画像をアップロードするオプションをサポートする必要があることです。

カスタマイズオプション

アイコン ボックス プラグインを使用する主な目的の 1 つは、特定の情報をより魅力的にすることです。 そして、すでにいくつかのスタイリングのアイデアが頭の中にあるかもしれません。 したがって、カスタマイズが重要な役割を果たします。 たとえば、ホバー効果をボックス全体ではなくアイコンのみに適用したい場合があります。 したがって、このアイコンをインストールする前に、カスタマイズ機能が利用できるかどうかを確認する必要があります。

ユーザーインターフェース

ダッシュボードが複雑になると、アイコン ボックスのデザインが難しくなる可能性があります。 このためには、設定を簡単に制御できるユーザー インターフェイスが必要です。 WYSIWYG 構築の経験を持つプラグインが必要です。 Elementor または ElementsKit プラグインは、このような機能を容易にします。

既製のレイアウト

あらかじめ作成されたレイアウトを使用すると、デザインのインスピレーションが簡単に得られ、数分以内に作業を開始できます。 一部のプラグインは、作業を容易にするために専門的に設計されたレイアウトを提供します。 そのため、そのアイコン ボックス プラグインのレイアウト キットが利用可能かどうかを確認する必要があります。

レスポンシブデザイン

アイコン ボックスはすべてのデバイスで完全に表示される必要があるため、その応答性は重要です。 レスポンシブ設定をより深く理解するには、ドキュメントまたはチュートリアルを参照してください。

プラグインの競合

アイコンボックスのようなデザインが必要な場合は、単一目的のプラグインをインストールすることがよくあります。 そうするとプラグインの数が増え、プラグイン間で競合が発生する可能性もあります。 では、解決策は何でしょうか? ベスト プラクティスは、さまざまな機能を備えたプラグインを用意することです。 たとえば、ElementsKit を使用すると、アイコン ボックスなどの Web サイト デザインのさまざまなニーズを満たすことができます。

最後の言葉

このリストのすべてのプラグインは、それぞれの点で有益です。 これらはすべて、WordPress Web サイト用の魅力的なアイコン ボックスを作成するのに役立ちます。 次に、機能とユーザー インターフェイスに関する個人的な好みになります。

このリストにあるプラグインのほとんどは無料なので、実際に試してみて、実際に使いやすいプラグインを見つけてください。 そして、これは最高の WordPress アイコン ボックス プラグインを見つける適切な方法になります。