【Shopify】商品置顶功能

商品置顶功能描述：通过在商品列表页为链接添加参数的方法实现置顶某个或多个商品的功能。

一：免费模板的置顶方法：

直接安装Topeak插件即可实现：

https://adsgo.orderplus.com/shopify/app?shop={ 网站shopify地址 }

网站shopify地址格式示例：website.myshopify.com

详细操作视频：

[图片上传失败...(image-a7ffc0-1564109442390)]

二：付费模板(Capital)的置顶方法：

需按以下步骤将目标代码添加到目标位置

目标代码

      <!-- 置顶商品的展示开始 -->
          {% assign handles = '' %}
          {% assign handleSize = 0 %}
          {% if current_page == 1 %}
            {% assign handles = collection.sort_by | downcase | replace:'%2C',',' | replace:'%2c',',' | split: ',' %}
            {% for handle in handles %}
            {%- assign product = all_products[handle] -%}
            {% if product != empty %}
              {% assign handleSize = handleSize|plus: 1 %}
              {% assign featured = product %}
              <div class="Grid__Cell 1/{{ mobile_items_per_row }}--phone 1/{{ tablet_items_per_row }}--tablet-and-up 1/{{ desktop_items_per_row }}--{% if section.settings.filter_position == 'drawer' %}lap-and-up{% else %}desk{% endif %}">
                {%- include 'product-item', show_product_info: true, show_vendor: section.settings.show_vendor, show_color_swatch: section.settings.show_color_swatch, show_labels: true -%}
              </div>
            {% endif %}
            {% endfor %}
          {% endif %}
       <!-- 置顶商品的展示结束 -->
          
       <!-- 其余商品的展示开始 -->
          {%- for product in collection.products -%}
          {% if handles contains product.handle %}
            {% continue %}
          {% else %}
            {% assign productIndex = productIndex | plus: 1 %}
            {% if productIndex > productSize %}
              {% continue %}
            {% else %}
              {% assign featured = product %}
          
            <div class="Grid__Cell 1/{{ mobile_items_per_row }}--phone 1/{{ tablet_items_per_row }}--tablet-and-up 1/{{ desktop_items_per_row }}--{% if section.settings.filter_position == 'drawer' %}lap-and-up{% else %}desk{% endif %}">
              {%- include 'product-item', show_product_info: true, show_vendor: section.settings.show_vendor, show_color_swatch: section.settings.show_color_swatch, show_labels: true -%}
            </div>
             {% endif %}
          {% endif %}
          {%- endfor -%}
       <!-- 其余商品的展示结束 -->