WordPress的图像地图是展示您美丽的图片和有效添加大量细节的最佳方式，而且不会破坏效果。您可以在最小的互联网空间里得到最大的信息压缩–而且可以做得很好。下面我们来看看如何在几分钟内创建您的图片。要传达大量重要的小产品细节，而又不至于用一堵详细的文字墙来疏远您的客户是很难的。如果您想精确定位一个物体、房间或区域–再加上为客户提供详细信息，并把他们送到网站的不同部分–那么使用WordPress图片地图就是您的答案。bluehost网站定制化服务商分享如何在WordPress中创建一个交互式图像地图
WordPress图片地图是展示美丽的图片和有效添加大量细节的最佳方式，而不会破坏效果。您在最小的互联网空间里得到最大的信息压缩–而且可以做得很好。
电子商务商店的图片放大功能以一种优雅的方式处理这个问题，但安装WooCommerce商店并不是那些需要为他们的照片提供额外 “动力 “的企业的方案。
阅读我们的深度指南，您能够了解用WP Draw Attention插件在WordPress中创建交互式图像地图是多么容易。
WordPress图片地图和WP Draw Attention的概述
WordPress图片地图是一个包含可点击区域的互动图形元素。
它的一个明显用途是提供给房地产开发商、房地产经纪人和宾馆或酒店业主使用。他们使用图像地图来展示交互式的平面图，并在每个区域附上美丽的图像。
然而，WordPress中的图像地图还有更多的优势——正如WP吸引注意力图像地图工具所证明的那样。它正迅速成为杂工、手艺人、工匠、艺术家和其他互联网商人的首选秘密营销工具。
WP Draw Attention的交互式图像(如平面图)可以将您的客户放大到难以置信的细节。您可以为每个区域添加详细的解释、文字、数字、图片、甚至视频，以突出产品的独特功能。您可以详细说明产品的所有优点，而不需要用一堵墙的文字来压倒访客。推荐阅读：《什么是站点地图以及为什么需要它》
用WP吸引注意力插件创建的响应式图像地图将根据您的输入生成自己的元数据，因此从一开始它就对搜索引擎十分友好。
我们将在下面提到免费和高级WP Draw Attention计划之间的区别，但我们必须告诉您免费插件的这一神奇功能……您在每个网站上只能得到一张互动图，但不可抗拒的因素是您可以在该图上添加任何数量的细节区域。
让我们用一个平面图作为例子。您可以将平面图上的区域与每个房间的照片联系起来，但您也可以在总平面图上勾勒出感兴趣的具体项目。您最终可以用艺术品、古董、插花和肥皂的详细照片……所有这些都与您的一张免费基础图片相联系。
让我们开始说明指南!
如何在WordPress中用WP Draw Attention创建一个图片地图
使用WP Draw Attention插件来建立一个互动的作品集是非常容易的，您会在每张图中都处理好造型。
第一步：安装WP Draw Attention
从WordPress的插件库或您的WordPress仪表盘上获取免费的Draw Attention插件。
在WordPress，导航到插件→添加新的。搜索 “Draw Attention”。安装并激活该插件。激活后，从左边的菜单中访问它(设置→WP Draw Attention)。
第二步：创建第一个图像地图
安装完毕后，点击 “吸引注意力 “菜单项，就可以开始了。
由于免费版只允许您创建一张图片地图，您会看到一个 “编辑图片 “的选项，我们将在下面仔细看一下。
在这个 “编辑图像 “页面上，为您的新互动图像输入一个标题(名称)。它将在您的网站上可见，所以请选择一个描述性的、有利于SEO的名字。
第三步：上传基础图片并添加一个热点区域
点击屏幕右侧的 “将图片放在这里 “部分，选择或上传您的基本图片。
在我们下面的案例中，我们上传了一个公寓平面图，作为开发商、建筑师、甚至室内设计师展示特定物业设计的例子。
在 “热点 “部分，您现在会看到您刚刚上传的图片，并带有 “绘制我们图片的可点击区域 “的指示。
接下来，突出显示您想链接到更多信息的每个部分。要做到这一点，请点击您想在交互式图像地图上突出显示的区域的每个点，就像我们下面做的那样。
您可能想本能地用鼠标拖动光标来追踪图像，但您需要创建一个点的轮廓，而不是一个图。把您的光标放在您想突出显示的区域的第一个点上，点击并移动到下一个点。重复以上步骤，直到您创建了该区域的轮廓。
一旦您标记了三个点，您就可以抓住轮廓的一个角，为轮廓添加更多的点、移动块以及以其他方式本能地玩弄您的图表。推荐阅读：《企业网站如何制作网站地图》
移动到绘图下方的 “标题 “框，输入高亮区域的名称(在上面的例子中是公寓的卧室)。
接下来，添加房间或物体的更详细描述。然后，在媒体库中添加照片的链接(或一个外部的URL)，当有人点击您的图像地图时，将会弹出这个链接。
在您继续下一步之前，保存图像地图(去右上角的WordPress发布部分)。
就是这样–您已经在基础图片上添加了第一个可点击的区域
第四步：添加更多的热点区域和预览
保持在 “热点区域 “部分。现在点击下一个下拉区域，称为 “可点击区域#2”
重复步骤，沿着您想突出的区域的轮廓进行一系列的点击。命名地图图像(在这种情况下是 “浴室”)，将该区域与您选择的照片链接并保存。
继续，直到您覆盖了所有的区域，并且命名和链接了所有的热点。保存并发布您的图像。
您现在可以预览图像地图，看看它在网站上会是什么样子。
第五步：为您的交互式图像设计风格
点击 “编辑交互式图像”，按照出现在页面顶部的图像名称下的自动链接。它将打开一个带有互动图像的新页面。该图片最初具有默认的WP吸引注意力的风格。
在页面上打开/展开 “更多信息框造型 “功能。选择图像背景颜色，并将出现在链接图像上方的标题颜色以及文本描述进行填色。
“更多信息背景颜色 “框指的是包含额外信息的WordPress块的颜色。您也可以编辑 “高亮 “造型。那将是高亮区域的颜色，因为它出现在基础的图片上。高级版本带有一系列良好的预设主题，使您可以快速进行造型。
更新变化。接下来，我们将把全新的WordPress图像地图添加到一个新的页面。
第六步：将交互式图像地图添加到网站上
短码将出现在编辑屏幕的右侧，即”添加图片 “框下面。它简单地写着 “复制短码”，因为免费插件只提供一个互动图。如果您使用高级插件并拥有一个以上的互动图片，情况就会改变。
复制短码，在网站上创建一个新的页面，并在短码块中插入它。
这就是了。
图像地图现在在您的WordPress网站上是可见的，访问者可以随意与它互动，正如您在下面的视频中看到的那样。
升级到WP Draw Attention Pro以获得更多的功能
除了WP Draw Attention Pro中无限数量的图片地图之外，这三个特殊的功能可以让精明的数字营销人员成交。
您可以将互动的类型改为 “悬停 “或 “点击”。
您可以 “始终显示 “图片的热点。突出显示的区域将保持突出显示，因此访问者可以立即看到他们正在探索哪个区域。
此外，您可以在图像的不同部分使用不同的高亮颜色。它将使您的图像地图能立即被识别为互动图像。
看看下面的额外造型选项，并注意到仪表板菜单的左边有一个 “所有图像 “的选项。您已经解锁了在WordPress中创建无限图像地图的选项。
一般的造型选项增加了，并且在几个预设主题的选择下变得更容易了。您还可以在网页上固定每个图像地图的排列。
如果您有几个不同的平面图或单元想突出显示，WP吸引注意力专业版是一项很好的选择。它不仅提供给您无限数量的图像地图，而且也会比基本版本看起来更好。
以上就是全部了。您看，用WP Draw Attention在WordPress中创建图片地图就是这么简单。推荐相关阅读：《详解WordPress制作网站地图的操作步骤》
