トップ10の最高の画像ホットスポットWordPressプラグイン

1. Lightbox を使用したイメージ マップ HotSpot

WordPress のイメージ マップ ホットスポットは、スムーズな CSS3 トランジションでツールチップまたはイメージの注釈を表示するのに役立ちます。 ユーザーがクリックまたはマウスオーバーしたときにポップオーバーを表示するように選択し、アイコンを簡単にドラッグして、バックエンドの HotSpot’s の位置を更新できます。 WYSIWYG (What You See Is What You Get) のような動作中のライブ プレビューは、バックエンドで利用できます。

各ホットスポット アイコンは、オプションのパルス アニメーションをサポートしています。
ホットスポット アイコンは数字で表示できます。バージョン 1.3.3 以降、ホットスポットはLightboxもサポートしています。アイコンをクリックしてYouTube または Vimeo Lightboxを開くことができ、画像または Google マップの Lightboxもサポートしています。

主な機能

2.Elementorのツールチップ付き画像ホットスポット

Elementor Page Builder の画像にツールチップ付きのホットスポット アイコンを追加するのに役立ちます。ホットスポットは、アイコン、数字、または単一のドットにすることができます。

注: このウィジェット バンドルはElementor Page Builder用です。

このウィジェットは、Elementor Page Builder WordPress Plugin の All In One Widgetから取得できます。 It’s は、将来のアップデートで他のウィジェット/アドオンを含む All In One パッケージを購入することをお勧めします。

YouTube のスクリーンキャストと編集の様子を見ることができます。

主な機能

3.ツールチップとライトボックスを備えたWPBakeryページビルダーアドオン画像ホットスポット

WPBakery Page Builder の画像にツールチップとライトボックスを含むホットスポット アイコンを追加するのに役立ちます。

注:このアドオンはAll In One Addons for WPBakery Page Builderから取得できます。 It’s は、将来のアップデートで他のアドオンも含むオールインワン パッケージを購入することをお勧めします。

このプラグインは WPBakery Page Builder のアドオンです。WPBakery Page Builderをサイトにインストールして有効にする必要があります。 ドラッグしてアイコンの位置を更新するには、Front Editor も有効にする必要があります。

このアドオンを Elementor Page Builder で使用したい場合: don’t Elementor のAll in One ウィジェットを確認することを忘れないでください。これには、この Image Hotspot with Tooltip が含まれています。 このアドオンがどのように機能するかの簡単なビデオ デモ (バージョン 1.2 以降では、アイコンをドラッグしてフロントエンド エディターでの位置を更新できます):

主な機能

4. GutenSpot - Gutenberg の画像ギャラリー ホットスポット

Gutenbergブロックを使用してカスタムホットスポットを作成し、画像をより有益でインタラクティブなものにします。

Gutenspotは、WooCommerce 製品、Amazon 製品、製品機能、ビジュアル ガイド、イメージ マップ、インタラクティブなイメージ チャートまたはグラフ、ブログ投稿を簡単かつインタラクティブな方法で表示するのに役立ちます。

さらに、ツールチップが近すぎてホバー、クリック、または常に表示される場合に、ツールチップの位置を定義して、互いに重ならないようにすることができます。

重要な点は、コーディングの経験がまったくなくても、Gutenberg Visual Builder を使用して視覚的に編集できることです。

主な機能

5. WordPress の Getwid – Gutenberg ブロック

Getwidには40+ Gutenberg ブロックが付属しており、特にこの WordPress Image Hotspot ブロックが付属しています。 無料版と有料版の両方が付属しており、エクスペリエンスがさらに向上します。 また、WordPress Gutenberg ユーザーは画像ホットスポット要素を無料で利用できます。

ツールチップのスタイリングに関しては、このブロックを使用すると、ポインターに Font Awesome アイコンを使用したり、色とサイズをカスタマイズしたり、デフォルトのツールチップのデザインを変更したりできます。

ツールチップの外観とインタラクティブ性をカスタマイズし、画像間で簡単に移動できます。
ホットスポット アイコンは、オプションで、パルス アニメーションを適用し、外観とホバー時にアニメーションを追加することで、動的にすることができます。

そのため、数回クリックするだけで、すぐに画像を有益でインタラクティブなものにすることができます。

主な機能

6. パノラマ 360°

iPanorama 360 Virtual Tour Builderは WordPress プラグインで、高度なプログラミング知識がなくても顧客向けの素晴らしいバーチャル ツアーを作成できます。 組み込みのビルダーを使用すると、パノラマ写真を簡単にアップロードしたり、ユーザーがあるシーンから別のシーンに移動できるようにするホットスポットを追加したり、ポップオーバー ウィンドウを追加してシーンの任意の部分に関する重要な情報を指摘したりできます。 テキスト、画像、ビデオ、およびその他のオンライン メディアを使用して、ホットスポットまたはポップオーバー ウィンドウを充実させることができます。

全体として、これはほとんどの旅行者が見たいと思う方法で観光地 (国立公園やホテルの部屋など) を宣伝するための優れたプラグインです。

主な機能

7. WordPress ツールチップ Ultimate & Image Hotspot

この画像ホットスポット プラグインを使用すると、ツールチップを完全にカスタマイズできます。 実際には、最も多様で多目的なツールチップ WordPress プラグインの 1 つです。

このプラグインを使用すると、独自の画像に必要なツールチップをトリガーするホットスポットを追加することもできます. ホットスポットの画像を作成し、ショートコードをサイトに貼り付けるだけです。

標準のモーダル ツールチップ ウィンドウに加えて、このプラグインは YouTube または Vimeo ビデオをツールチップに追加したり、Google マップでおしゃれなマップ スタイルを使用したり、カスタム HTML テキストを追加したりするのに適しています。

主な機能

8.DevVNによる画像ホットスポット

Gutenberg ブロック用のDevVN プラグインによる WordPress Image Hotspotの助けを借りて、手間をかけずに画像とホットスポットを簡単に追加できます。 コードを追加して、ウェブサイトの訪問者の目に魅力的で有益な画像を作成する必要はありません。 完全に無料で、高度な jQuery PowerTip 機能が含まれています。

このプラグインの明白な利点の 1 つは、基本的なタイポグラフィ設定、画像、リンクなどをサポートするデフォルトのテキスト エディターを介して、書式設定されたテキストを追加できることです。これらのすべての設定により、ピンを非常に有益でカスタマイズされたものにすることができます。

9. Straum (Elementor の画像ホットスポット)

これは Stratum によるElementor画像ホットスポット ウィジェットで、サイズ、色、アイコンなど、すべてを完全に制御できます。 さらに、アニメーション効果を表示したり、インタラクティブなアイコンを表示したりできます。

Stratum を使用すると、サードパーティの Elementor 拡張機能に通常見られる多くの Elementor プラグイン機能に追加料金なしでアクセスできます。

このプラグインを使用すると、カスタム アイコンのライブラリを統合して、ホットスポット全体で使用することもできます。 ツールチップは、クリックとホバリングでトリガーできます。

主な機能

10. 画像ホットスポット – マップ画像注釈

画像ホットスポットには、カスタマイズするためのいくつかのオプションがあります。 さまざまな色とサイズのアイコンが何百もあり、これらのアイコンをカスタマイズすることもできます。 さまざまな色の利用可能なアイコンに加えて、多くのフォントがあります。

イメージ マップ ホットスポットは、あらゆる投稿、ページ、ウィジェット、すべての最新のテーマ、およびページ ビルダーをサポートしています。 また、WordPress の最新バージョンにも対応しています。 また、カスタム CSS で無制限のショートコードを取得できます。

主な機能