# 图片热点横幅

图片热点横幅模块用于在图片上标记特定的产品热点，并提供快速链接以引导用户浏览这些产品。此功能特别适用于展示带有多个产品的场景图，用户可以通过点击热点直接跳转到相关产品详情页。

### **配置选项**

* **启用全宽**
  * **用途**: 启用后，横幅将占据页面的全宽，提供更具视觉冲击力的效果。
* **背景图片**:
  * **用途**: 设置横幅的背景图片，作为热点展示的基础。
* **默认打开第一个热点**:
  * **用途**: 如果启用此选项，当页面加载时，第一个热点将自动打开，显示关联的产品信息。
  * **注意**: 如果未启用，用户需要手动点击热点才能查看相关信息。
* **图像比例**:
  * **用途**: 设置背景图片的显示比例。
  * **选项**:
    * 正方形
    * 纵向
    * 全景

### **热点单元设置**

每个热点可以设置在图片中的位置，并关联到一个产品。最多可以添加5个热点。

* **垂直位置**:
  * **用途**: 调整热点在图片中垂直方向的位置。
  * **操作**: 通过滑块设置，调整位置百分比。
* **水平位置**:
  * **用途**: 调整热点在图片中水平方向的位置。
  * **操作**: 通过滑块设置，调整位置百分比。
* **选择产品**:
  * **用途**: 选择与热点相关联的产品，用户点击该热点时将跳转到此产品页面。
  * **操作**: 点击“选择产品”按钮，在弹出的产品选择器中进行选择。

### **使用注意事项**

* **热点位置**: 热点的位置应根据背景图片中的产品实际位置进行调整，以确保用户点击热点时能够准确定位相关产品。
* **图片选择**: 背景图片应清晰、具备良好的视觉引导性，使用户能够轻松发现热点。
* **SEO优化**: 在热点关联的产品页面中，确保填写详细且相关的产品描述，有助于提升搜索引擎优化效果。

### **常见问题**

* **热点不准确**: 如果热点显示的位置不准确，请重新调整垂直和水平位置的百分比，以使热点对齐到正确的产品位置。
* **热点数量超出限制**: 模块最多支持5个热点，请确保热点数量在此范围内。如果需要更多热点，建议拆分图片或重新规划展示内容。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ascent.webvista.studio/webvista-studio-docs/sections/tu-pian-re-dian-heng-fu.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
