# 隐藏其它变体图片

隐藏其它变体图片效果预览：

{% embed url="<https://ascentelevated.myshopify.com/products/midtown-tennis-skirt8?variant=50047753912604>" %}

通过为产品图片添加 `alt` 属性，将图片按变体分组，可以实现仅显示当前变体图片集合的效果。以下是具体步骤：

<figure><img src="/files/cc6uBEpgShKOFVKoDkcT" alt=""><figcaption><p>只显示当前变体的图片集合</p></figcaption></figure>

### 给产品图片添加Alt 属性

在产品编辑页面中，选择需要分组的图片并为其添加 `alt` 属性值，例如 `###Purple`

相同 `alt` 属性值（带有 `###` 前缀）的图片会被归为同一组。

{% hint style="warning" %}
`alt` 属性值必须以 `###` 作为前缀，才能实现分组功能。
{% endhint %}

<figure><img src="/files/GXdK98AYmkjeqJCyiRGg" alt=""><figcaption><p>添加 Alt 属性值</p></figcaption></figure>

### 设置变体图片

在变体设置中，为每个变体指定主图，主图所在分组的所有图片将在选择该变体时显示。

<figure><img src="/files/tqLHFSsAqzOcVcJ362tq" alt=""><figcaption></figcaption></figure>

### 启用隐藏其它变体图片设置

在模板编辑页面，进入产品设置，开启“隐藏其他变体图片”选项。开启后，仅显示当前变体的图片组，隐藏其他图片。

<figure><img src="/files/LJG7rXJaFAucQUK7wkZH" alt=""><figcaption></figcaption></figure>


---

# 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/main-pages/main-product/yin-cang-qi-ta-bian-ti-tu-pian.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.