隐藏“添加到购物车”按钮
您可以在店面中隐藏添加到购物车按钮,并在将来再次显示这些按钮。
分区模板和未分区模板
Sectioned
- 在 Shopify 后台中,转至在线商店 > 模板。
- 找到要编辑的模板,点击 ... 按钮打开操作菜单,然后点击编辑代码。
- 在 Sections 目录中,点击打开
product-template.liquid
文件。查找添加到购物车按钮对应的 HTML 代码。您可以首先搜索 cart 一词。
“添加到购物车”按钮的代码因模板而异。请查找包含 Add to cart
、AddToCart
或 add-to-cart
等类似文本的 <input>
或 <button>
标记。
在 Debut 模板中,“添加到购物车”按钮的代码如下所示:
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
- 找到代码后,将它放入 Liquid
{% comment %}
和{% endcomment %}
标记之间。这将会阻止该代码在您的商店中显示,但如果您后期想更改新模板,便可以更轻松地将其恢复。
使用上面的示例,新代码将如下所示:
{% comment %}
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
{% endcomment %}
- 点击保存以确认更改。
当您准备好再次显示添加到购物车按钮时,请返回到编辑 HTML/CSS 页面上的 product-template.liquid
文件,删除 {% comment %}
和 {% endcomment %}
标记,然后点击保存。
Non-sectioned
- 在 Shopify 后台中,转至在线商店 > 模板。
- 找到要编辑的模板,点击 ... 按钮打开操作菜单,然后点击编辑代码。
- 在 Templates 目录中,点击打开
product.liquid
文件。查找添加到购物车按钮对应的 HTML 代码。您可以首先搜索 cart 一词。
“添加到购物车”按钮的代码因模板而异。查找包含 Add to cart
、AddToCart
或 add-to-cart
等类似文本的 <input>
或 <button>
标记。
在 Minimal 模板中,“添加到购物车”按钮将与下方类似:
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
- 找到代码后,将它放入 Liquid
{% comment %}
和{% endcomment %}
标记之间。这将会阻止该代码在您的商店中显示,但如果您后期想更改新模板,便可以更轻松地将其恢复。
使用上面的示例,新代码将如下所示:
{% comment %}
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
{% endcomment %}
- 点击保存以确认更改。
如果您已准备好再次显示添加到购物车按钮,请返回到编辑 HTML/CSS 页面上的 product.liquid
模板,删除 {% comment %}
和 {% endcomment %}
标记,然后点击保存。