单击集合页面中的变体产品时，应在产品页面 Shopify 中打开相同的变体

Question

我正在 Shopify 网站上工作，我所做的是将产品的所有变体显示为产品系列页面上的单个产品，但我需要帮助的是，当有人单击产品系列页面上的变体图像时，它应该在产品页面中打开相同的变体

 <div class="col-6 col-md-4 custom-variant" data-tag="{{test}}">
          <div class="hover-grid-wrapper">
          <a href="{{product.url}}">
            {%if variant.image.src != blank %}
            <img src="{{ variant.image.src | img_url: 'master' }}" alt="" class="img-responsive" />
            {% else %}
            <div class="product-image pr oh lazyload" data-include="{{pr_url}}/?view=img{{sett_equal}}"><div class="nt_bg_lz nt_fk_lz"{% unless sett_equal %} style="padding-top:{{ 1 | divided_by: images_0.aspect_ratio | times: 100}}%;"{% endunless %}></div></div>
            <img src="{{ product.featured_image.src | crop:center | img_url: 'master' }}" class="featured-image" alt="{{ product.featured_image.alt | escape }}">
            {% endif %}
            
            {% assign vTitle = variant.title | split: ' / ' %}
            {% assign title = words[0] | capitalize  %}
            
            <span class="color-text color-{{color | handle }} {{variant.id}}">{{title}}</span>
          </a>
          {%- if variant.inventory_quantity <= 0  and variant.inventory_management == 'shopify' -%}{%- assign txt = 'products.product.pre_orders' | t -%}{%- else -%}{%- assign txt = 'products.product.add_to_cart' | t -%}{%- endif -%}
          <a href="{{ url_last }}" class="add-to-cart-btn pr_atc_ tc dib js_addtc {{tooltip}} truncate" data-id="{{ variant.id }}" rel="nofollow"><span>+ Quick Add</span></a>
        </div>
        </div>

这是我的代码

Answer 1

简单:)

您应该使用变体 深层链接

在产品的链接上，您应该添加 ?variant=[variant-id]

：

<a href="{{product.url}}">

在您的代码中替换

<a href="{{ product.url }}?variant={{ variant.id }}">