人生就是博·(中国)尊龙AG旗舰厅

人生就是博·(中国)尊龙AG旗舰厅(LianLian Global)官网首页

shopify添加到购物车按钮隐藏和显示办法

2022/03/08
自建站

禁用购物车


备注

若是您使用 Shopify 的免费模板，，，，，，您可以联系 Shopify 支持团队获得关于此教程的资助。 。。 。。。此教程需要 15 分钟的设计时间。 。。 。。。若要相识详情，，，，，，请参阅 Support for themes。 。。 。。。

备注

此自界说用于复古 Shopify 模板，，，，，，不适用于“Online Store 2.0”模板。 。。 。。。

  • 找到您的模板架构版本

  • 探索“Online Store 2.0”模板自界说


您可以在店面中隐藏添加到购物车按钮，，，，，，并在未来再次显示这些按钮。 。。 。。。

备注：此自界说设置与动态结账按钮不兼容。 。。 。。。若是您的模板支持动态结账，，，，，，请凭证在产品页面上隐藏动态结账按钮的办法来阻止显示按钮。 。。 。。。

分区模板和未分区模板

备注：本教程的办法将凭证您使用的是分区模板照旧未分区模板而有所差别。 。。 。。。分区模板支持通过拖放来安排主页的结构，，，，，，未分区模板则不支持。 。。 。。。

若是想相识您的模板是否支持分区，，，，，，请转到模板的编辑代码页面。 。。 。。。若是 Sections 目录中有文件，，，，，，您则正在使用已分区模板。 。。 。。。未分区模板是在 2016 年 10 月之前宣布的，，，，，，并且 Sections 目录中没有文件。 。。 。。。

若是您使用已分区模板，，，，，，请点击 Sectioned themes（已分区模板）按钮并凭听说明举行操作。 。。 。。。若是您使用较旧的未分区模板，，，，，，请点击 Non-sectioned themes（未分区模板）按钮并凭听说明举行操作。 。。 。。。

PC:

  1. 在 Shopify 后台中，，，，，，转到在线市肆 > 模板。 。。 。。。

  2. 找到要编辑的模板，，，，，，然后点击操作 > 编辑代码。 。。 。。。

  1. 在 Sections 目录中，，，，，，点击翻开 product-template.liquid 文件。 。。 。。。查找添加到购物车按钮对应的 HTML 代码。 。。 。。。您可以首先搜索 cart 一词。 。。 。。。

“添加到购物车”按钮的代码因模板而异。 。。 。。。请查找包括 Add to cart、AddToCart 或 add-to-cart 等类似文本的 <input> 或 <button> 标记。 。。 。。。

苹果系统：

  1. 在 Shopify 后台中，，，，，，转到在线市肆 > 模板。 。。 。。。

  2. 找到要编辑的模板，，，，，，然后点击操作 > 编辑代码。 。。 。。。

  1. 在 Sections 目录中，，，，，，点击翻开 product-template.liquid 文件。 。。 。。。查找添加到购物车按钮对应的 HTML 代码。 。。 。。。您可以首先搜索 cart 一词。 。。 。。。

“添加到购物车”按钮的代码因模板而异。 。。 。。。请查找包括 Add to cart、AddToCart 或 add-to-cart 等类似文本的 <input> 或 <button> 标记。 。。 。。。

安卓系统：

  1. 在 Shopify 后台中，，，，，，转到在线市肆 > 模板。 。。 。。。

  2. 找到要编辑的模板，，，，，，然后点击操作 > 编辑代码。 。。 。。。

  1. 在 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>

  1. 找到代码后，，，，，，将它放入 Liquid {% comment %} 和 {% endcomment %} 标记之间。 。。 。。。这将会阻止该代码在您的市肆中显示，，，，，，但若是您想稍后更改您的新模板，，，，，，您可以轻松将其恢复。 。。 。。。

Using the example above, the new code would look like this: ``` liquid {% 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 %}


注重

Make sure that you don't comment out the <form> tags for your product page. Your comment tags should not surround any <form> or </form> tags, otherwise customers could experience errors when viewing your product page. ```



  1. 点击生涯以确认更改。 。。 。。。

当您准备好再次显示添加到购物车按钮时，，，，，，请返回到编辑 HTML/CSS 页面上的 product-template.liquid 文件，，，，，，删除 {% comment %} 和 {% endcomment %} 标记，，，，，，然后点击生涯。 。。 。。。

Shopify商户官网原文详情：

Disable your cart

Note

If you use a free theme from Shopify, then you might be able to contact Shopify Support for help with this tutorial. It requires 15 minutes of design time. To learn more, refer to Support for themes.

Note

This customization is for vintage Shopify themes, and doesn't apply to Online Store 2.0 themes.

  • Find out your theme's architecture version

  • Explore Online Store 2.0 theme customizations

You can hide your Add to cart buttons on your storefront and reveal them again in the future.

Note

This customization isn't compatible with dynamic checkout buttons. If your theme supports dynamic checkout, then prevent the buttons from showing by following the steps to hide dynamic checkout buttons on product pages.

Sectioned and non-sectioned themes

Note

The steps for this tutorial differ depending on whether you are using a sectioned or a non-sectioned theme. A sectioned theme lets you drag and drop to arrange the layout of your home page, and a non-sectioned theme doesn't.

To figure out whether your theme supports sections, go to the theme's Edit code page. If there are files in the Sections directory, you are using a sectioned theme. Non-sectioned themes were released before October 2016, and do not have files in the Sections directory.

If you are using a sectioned theme, click the Sectioned themes button and follow the instructions. If you are using an older, non-sectioned theme, click the Non-sectioned themes button and follow the instructions.


PC：

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme you want to edit, and then click Actions > Edit code.

  1. In the Sections directory, click to open your product-template.liquid file. Find the HTML code for the Add to cart button. You can search for the word cart as a start.

The code for the add to cart button varies theme to theme. Look for an <input> or <button> tag with text like Add to cart, AddToCart, or add-to-cart.

iPhone：

  1. From the Shopify app, tap Store.

  2. In the Sales channels section, tap Online Store.

  3. Tap Manage themes.

  4. Find the theme you want to edit, and then click Actions > Edit code.

  1. In the Sections directory, click to open your product-template.liquid file. Find the HTML code for the Add to cart button. You can search for the word cart as a start.

The code for the add to cart button varies theme to theme. Look for an <input> or <button> tag with text like Add to cart, AddToCart, or add-to-cart.

Android：

  1. From the Shopify app, tap Store.

  2. In the Sales channels section, tap Online Store.

  3. Tap Manage themes.

  4. Find the theme you want to edit, and then click Actions > Edit code.

  1. In the Sections directory, click to open your product-template.liquid file. Find the HTML code for the Add to cart button. You can search for the word cart as a start.

The code for the add to cart button varies theme to theme. Look for an <input> or <button> tag with text like Add to cart, AddToCart, or add-to-cart.

In the Debut theme, the add to cart button code looks like this:

   <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>

  1. When you find the code, wrap it in Liquid {% comment %} and {% endcomment %} tags. This will stop the code from being shown on your store, but will let you easily put it back if you want to change your new template later.

    Using the example above, the new code would look like this:

    {% 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 %}

    Caution

    Make sure that you don't comment out the <form> tags for your product page. Your comment tags should not surround any <form> or </form> tags, otherwise customers could experience errors when viewing your product page.

  1. Click Save to confirm your changes.

When you are ready to show your Add to cart buttons again, go back to your product-template.liquid file on the Edit HTML/CSS page, remove the {% comment %} and {% endcomment %} tags, and click Save.

文章内容泉源：Shopify商户官方网站


更多
【网站地图】【sitemap】