十大最佳图像热点 WordPress 插件

Nkenganyi Clovis Business Jan 5, 2023

你有没有想过如何让你的图像更具描述性和交互性? 不用担心,因为 WordPress 有一些插件既适用于 Gutenberg 编辑器和页面构建器以及Elementor可以帮助你使这项任务变得更容易。
Image Hotspot 插件可帮助您突出显示图像位置、描述或任何类型的带有动画工具提示等的内容。 您只需要获得完美的解决方案即可开始。 不要担心!

图像热点对于让您的视觉效果在客户眼中更有趣至关重要。 它有助于定义每个图像的用途、价格、历史记录或您可以通过使用图像热点以交互方式与客户分享的任何想法。
在此博客中,您将了解一些适用于 Gutenberg 的最佳 WordPress Image Hotspot 插件,WPBakery & Elementor。 让 ’s 开始吧。

1. 带灯箱的图像地图热点

适用于 WordPress 的图像地图热点可帮助您通过平滑的 CSS3 过渡显示工具提示或图像注释。 您可以选择在用户单击或鼠标悬停时显示弹出窗口,并轻松拖动图标以更新后端的 HotSpot’s 位置。 工作实时预览在后端可用,类似于 WYSIWYG(所见即所得)。

每个热点图标都支持可选的脉冲动画
热点图标可以数字显示,1.3.3版本后,热点还支持Lightbox ,可以点击图标打开YouTube或Vimeo Lightbox ,也支持图片或google map Lightbox

主要特征

  • 使用 WordPress 易于安装和设置
  • 后端可拖动图标
  • 反应灵敏
  • 同一页面上的多个 HotSpot 实例
  • CSS3 过渡支持
  • 可选的自动延迟幻灯片

2. 带有 Elementor 工具提示的图像热点

帮助您在 Elementor Page Builder 中为图像添加带有工具提示的热点图标,热点可以是图标、数字或单个点。

注意:此小部件包适用于Elementor Page Builder

您可以从Elementor Page Builder WordPress 插件的多合一小部件中获取此小部件。 It’s 建议购买 All In One 包,该包将在未来的更新中包含其他小部件/插件。

你可以看到来自 YouTube 的截屏视频,以及编辑的样子。

主要特征

  • 热点支持图标、数字或单点
  • Tooltip 支持丰富的内容,如 YouTube/Vimeo 视频、图片
  • 可以通过单击或悬停来触发工具提示
  • 仅在需要时才对 js 和 CSS 进行排队
  • 内置图标样式并支持自定义颜色
  • 热点的可选脉冲动画边框,可选的工具提示样式
  • 工具提示可以设置为默认显示。
  • 兼容最新的 Elementor 和最新的 WordPress。

3. WPBakery Page Builder 带有工具提示和灯箱的附加图像热点

帮助您在 WPBakery Page Builder 的图像中添加带有工具提示灯箱的热点图标。

注意:您可以从All In One Addons for WPBakery Page Builder获取此插件。 It’s 建议购买 All In One 包,该包还包含未来更新中的其他插件。

此插件是WPBakery Page Builder的插件,它需要在您的站点上安装并激活 WPBakery Page Builder。 还需要启用 Front Editor 才能拖动以更新图标位置。

如果您想在 Elementor Page Builder 中使用此插件:don’t 忘记查看Elementor 的多合一小部件,其中包括带有工具提示的图像热点。 快速视频演示,说明此插件的工作原理(1.2 版后,您可以拖动图标以更新其在前端编辑器中的位置):

主要特征

  • 热点支持灯箱
  • 热点图标支持任何颜色
  • 可选的工具提示样式:阴影、光、黑色、朋克
  • 您可以在 WPBakery Page Builder 前端编辑器中轻松自定义每个热点 icon’s 位置
  • 反应灵敏,视网膜就绪
  • 工具提示支持任何类型的内容,例如图像或视频
  • 可选的工具提示动画:增长、滑动、淡入淡出、下降
  • 扩展 WPBakery 页面构建器

4. GutenSpot - 古腾堡图片库热点

使用Gutenberg块创建自定义热点,使您的图像更具信息性和交互性。

Gutenspot帮助您以简单的交互方式展示 WooCommerce 产品、亚马逊产品、产品功能、视觉指南、图像地图、交互式图像图表或图形以及博客文章。

此外,还有一种功能可以定义工具提示的位置,如果它们放置得太近,则不会相互覆盖,并使其在悬停时、单击时或始终显示。

要点是您可以使用 Gutenberg Visual Builder 对其进行可视化编辑,而无需任何编码经验。

主要特征

  • 超级容易安装和使用
  • 根据需要在图像上添加任意数量的热点
  • 每个工具提示内容都可以单独定制
  • 在工具提示中显示 4 种类型的内容 – 简单文本、WooCommerce 产品、亚马逊产品 & 博客文章
  • 您可以添加单个图像或画廊以显示热点
  • 提供 3 种类型的图钉 – 方形、圆形或自定义图标
  • 更改/管理热点或删除图像
  • 对热点有很好的脉冲效果

5. Getwid – WordPress 古腾堡块

Getwid带有40+ Gutenberg 块,尤其是这个 WordPress Image Hotspot 块。 它提供免费和付费版本,让您的体验更加美好。 图像热点元素对 WordPress Gutenberg 用户免费提供。

至于工具提示样式,此块允许您使用 Font Awesome 图标作为指针、自定义颜色和大小以及更改默认的工具提示设计。

您可以自定义工具提示的外观和交互性,并轻松地在图像之间移动它们。
通过应用脉冲动画并在外观和悬停时添加动画,可以选择使热点图标动态化。

因此,只需点击几下,您就可以立即使您的图像信息丰富且具有交互性。

主要特征

  • 节块
  • Fontawesome 指针图标
  • 图像滑块
  • 自定义工具提示颜色

6.全景360°

iPanorama 360 Virtual Tour Builder是 WordPress 插件,无需高级编程知识,即可让您为客户创建出色的虚拟游览。 使用内置的生成器,您可以轻松上传全景照片、添加允许用户从一个场景导航到另一个场景的热点,以及添加弹出窗口以指出有关场景任何部分的重要信息。 您可以使用文本、图像、视频和其他在线媒体丰富热点或弹出窗口。

总的来说,这是一个很棒的插件,可以以大多数旅行者喜欢的方式宣传旅游景点(例如国家公园和酒店房间)。

主要特征

  • 兼容所有最新的浏览器
  • 视觉之旅
  • 弹窗系统
  • 弹出框显示 & 隐藏动画
  • 标记
  • 工具提示系统
  • 工具提示显示 & 隐藏动画
  • 场景过渡效果

7. WordPress Tooltips Ultimate & 图像热点

此图像热点插件可为您提供完全自定义的工具提示。 它实际上是最多样化和多用途的工具提示 WordPress 插件之一。

使用此插件,您甚至可以添加热点来触发您想要的工具提示,用于您自己的图像。 只需制作您的热点图片并将短代码粘贴到您的网站即可。

除了标准模式工具提示窗口外,该插件还适用于将 YouTube 或 Vimeo 视频添加到您的工具提示,在您的 Google 地图上使用时髦的地图样式,以及添加自定义 HTML 文本。

主要特征

  • 工具提示样式选项
  • 工具提示锚点选项
  • 动画选项
  • 多个工具提示位置选项
  • 工具提示箭头选项
  • 交互选项
  • 谷歌字体
  • 视频工具提示

8. DevVN 的图像热点

借助适用于古腾堡区块的 DevVN 插件的 WordPress Image Hotspot ,您可以轻松地向其添加图像和热点,而不会遇到任何麻烦。 您不必添加任何代码并使您的图像在网站访问者眼中令人惊叹且信息丰富。 它完全免费,并包含高级 jQuery PowerTip 功能。

该插件的明显优点之一是您可以通过支持基本排版设置、图像、链接等的默认文本编辑器添加格式化文本。所有这些设置使您能够制作出真正信息丰富且量身定制的图钉。

9. Straum(Elementor 的图像热点)

这是 Stratum 的Elementor图像热点小部件,可让您完全控制所有内容,包括其大小、颜色和图标。 此外,它可以显示动画效果,并且可以显示交互式图标。

借助 Stratum,您可以免费访问第三方 Elementor 扩展中常见的许多 Elementor 插件功能。

该插件还允许您集成自定义图标库以跨热点使用。 工具提示可以在点击和悬停时触发。

主要特征

  • 自定义图标
  • 访问元素插件
  • 动画效果
  • 显示交互式图标

10. Image Hotspot –地图图像标注

Image Hotspot 有几个自定义选项。 有数百个不同颜色和大小的图标,您还可以自定义这些图标。 除了具有不同颜色的可用图标外,还有很多字体。

图像地图热点支持任何帖子、页面、小部件、所有最新的主题和页面构建器。 它还支持最新版本的 WordPress。 您还将获得带有自定义 CSS 的无限短代码。

主要特征

  • 指针有三种样式
  • 图像注释可用
  • 1600+ 内置字体-超棒的图标
  • 包括指针文本选项

结论

您决定选择的工具提示取决于您拥有的网站类型或元素和内容的类型,无论是地图、产品还是房屋。 上面列出的所有十大图像热点插件将为您提供多种选择。

您可以选择要在下一个项目中使用的那个。

Divi WordPress Theme