wordpress|如何在WordPress中创建一个交互式图像地图( 二 ) 高亮|美丽

第三步：上传基础图片并添加一个热点区域
点击屏幕右侧的 \"将图片放在这里 \"部分，选择或上传您的基本图片。
在我们下面的案例中，我们上传了一个公寓平面图，作为开发商、建筑师、甚至室内设计师展示特定物业设计的例子。
在 \"热点 \"部分，您现在会看到您刚刚上传的图片，并带有 \"绘制我们图片的可点击区域 \"的指示。
接下来，突出显示您想链接到更多信息的每个部分。要做到这一点，请点击您想在交互式图像地图上突出显示的区域的每个点，就像我们下面做的那样。
您可能想本能地用鼠标拖动光标来追踪图像，但您需要创建一个点的轮廓，而不是一个图。把您的光标放在您想突出显示的区域的第一个点上，点击并移动到下一个点。重复以上步骤，直到您创建了该区域的轮廓。
一旦您标记了三个点，您就可以抓住轮廓的一个角，为轮廓添加更多的点、移动块以及以其他方式本能地玩弄您的图表。
移动到绘图下方的 \"标题 \"框，输入高亮区域的名称(在上面的例子中是公寓的卧室) 。
接下来，添加房间或物体的更详细描述。然后，在媒体库中添加照片的链接(或一个外部的URL) ，当有人点击您的图像地图时，将会弹出这个链接。
在您继续下一步之前，保存图像地图(去右上角的WordPress发布部分) 。
就是这样--您已经在基础图片上添加了第一个可点击的区域

第四步：添加更多的热点区域和预览
保持在 \"热点区域 \"部分。现在点击下一个下拉区域，称为 \"可点击区域#2\"
重复步骤，沿着您想突出的区域的轮廓进行一系列的点击。命名地图图像(在这种情况下是 \"浴室\") ，将该区域与您选择的照片链接并保存。
继续，直到您覆盖了所有的区域，并且命名和链接了所有的热点。保存并发布您的图像。
您现在可以预览图像地图，看看它在网站上会是什么样子。
第五步：为您的交互式图像设计风格
点击 \"编辑交互式图像\" ，按照出现在页面顶部的图像名称下的自动链接。它将打开一个带有互动图像的新页面。该图片最初具有默认的WP吸引注意力的风格。
在页面上打开/展开 \"更多信息框造型 \"功能。选择图像背景颜色，并将出现在链接图像上方的标题颜色以及文本描述进行填色。
\"更多信息背景颜色 \"框指的是包含额外信息的WordPress块的颜色。您也可以编辑 \"高亮 \"造型。那将是高亮区域的颜色，因为它出现在基础的图片上。高级版本带有一系列良好的预设主题，使您可以快速进行造型。
更新变化。接下来，我们将把全新的WordPress图像地图添加到一个新的页面。
第六步：将交互式图像地图添加到网站上
短码将出现在编辑屏幕的右侧，即\"添加图片 \"框下面。它简单地写着 \"复制短码\" ，因为免费插件只提供一个互动图。如果您使用高级插件并拥有一个以上的互动图片，情况就会改变。
复制短码，在网站上创建一个新的页面，并在短码块中插入它。
这就是了。

图像地图现在在您的WordPress网站上是可见的，访问者可以随意与它互动，正如您在下面的视频中看到的那样。
升级到WP Draw Attention Pro以获得更多的功能
除了WP Draw Attention Pro中无限数量的图片地图之外，这三个特殊的功能可以让精明的数字营销人员成交。
您可以将互动的类型改为 \"悬停 \"或 \"点击\" 。
您可以 \"始终显示 \"图片的热点。突出显示的区域将保持突出显示，因此访问者可以立即看到他们正在探索哪个区域。