隐藏售罄多属性

您可以通过在产品页面上删除或禁用售罄的多属性来阻止客户选择这些多属性。

本页相关主题

• 限制

• 选择您的模板

限制

此页面中概述的自定义设置不适用于以下情况：

• 您的产品有多个产品选项

• 您使用 Express 模板，并将产品页面设置为以叠加方式显示产品

分区模板和未分区模板

备注：本教程的步骤将根据您使用的是分区模板还是未分区模板而有所不同。分区模板支持通过拖放来安排主页的布局，未分区模板则不支持。

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

如果您使用已分区模板，请点击 Sectioned themes（已分区模板）按钮并按照说明进行操作。如果您使用较旧的未分区模板，请点击 Non-sectioned themes（未分区模板）按钮并按照说明进行操作。

• Sectioned themes

•  

• Non-sectioned themes

选择您的模板

此自定义的步骤因您的模板而异。点击模板的按钮，然后按照以下说明操作：

• Boundless

• Brooklyn

• Debut

• Express

• Minimal

• Narrative

• Simple

• Supply

• Venture

Boundless

此自定义设置的步骤取决于您是希望完全隐藏售罄的多属性，还是只想将其禁用。点击偏好设置按钮，然后按照以下说明操作：

•  Disable

隐藏售罄多属性

按照以下步骤将自定义项应用于 Boundless：

PC：

1. 在 Shopify 后台中，转到在线商店 > 模板。

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

1. 在 Assets 目录中，点击 theme.js 或 theme.js.liquid。

苹果系统：

1. 在 Shopify 应用中，轻触商店。

2. 在销售渠道部分中，轻触在线商店。

3. 轻触 Manage themes（管理模板）。

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

1. 在 Assets 目录中，点击 theme.js 或 theme.js.liquid。

安卓系统：

1. 在 Shopify 应用中，轻触商店。

2. 在销售渠道部分中，轻触在线商店。

3. 轻触 Manage themes（管理模板）。

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

1. 在 Assets 目录中，点击 theme.js 或 theme.js.liquid。

1. 在文件底部，粘贴以下代码：

document.addEventListener('DOMContentLoaded', function() {   const productJson = document.querySelectorAll('[id`^`=ProductJson-');   if (productJson.length > 0) {     for (let i = 0; i < productJson.length; i++) {       const current = productJson[i];       const sectionId = current.id.replace('ProductJson-', '');       const section = document.querySelector('[data-section-id="' + sectionId + '"]');       const product = JSON.parse(current.text);       if (product.options.length === 1) {         const unavailableVariants = [];         for (let j = 0; j < product.variants.length; j++) {           const variant = product.variants[j];           if (!variant.available) {             unavailableVariants.push(variant);           }         }         if (unavailableVariants.length > 0) {           const mutationCallback = function() {             const variantOptions = section.querySelectorAll('.single-option-selector option');             if (variantOptions.length > 0) {               for (let k = 0; k < unavailableVariants.length; k++) {                 const unavailableVariant = unavailableVariants[k];                 for (let l = 0; l < variantOptions.length; l++) {                   const option = variantOptions[l];                   if (unavailableVariant.title === option.value) {                     option.remove();                   }                 }               }               if (typeof observer === 'object' && typeof observer.disconnect === 'function') {                 observer.disconnect();               }             }           }           const observer = new MutationObserver(mutationCallback);           const addToCartForm = document.querySelector('form[action*="/cart/add"]');           mutationCallback();           if (window.MutationObserver && addToCartForm.length) {             const config = { childList: true, subtree: true };             if (typeof observer === 'object' && typeof observer.disconnect === 'function') {               observer.disconnect();             }             observer.observe(addToCartForm, config);           }         }       }     }   } });

1. 点击保存。

Shopify商户官网原文详情：

Hide sold-out variants

You can prevent customers from selecting sold-out variants by removing or disabling those variants on the product page.

On this page

• Limitations

• Select your theme

Limitations

The customizations outlined on this page do not work for the following cases:

• Your products have more than one product option

• You use the Express theme and have the product page set to show products in an overlay

Sectioned and non-sectioned themes

---

• Sectioned themes

• Non-sectioned themes

Select your theme

The steps for this customization vary depending on your theme. Click the button for your theme before following the instructions below:

• Boundless

• Brooklyn

• Debut

• Express

• Minimal

• Narrative

• Simple

• Supply

• Venture

Boundless

The steps for this customization vary depending on whether you want to completely hide sold-out variants, or just disable them. Click the button for your preference before following the instructions below:

• Hide

• Disable

Hide sold-out variants

Follow these steps to apply the customization to Boundless:

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 Assets directory, click theme.js or theme.js.liquid.

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 Assets directory, click theme.js or theme.js.liquid.

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 Assets directory, click theme.js or theme.js.liquid.

1. At the bottom of the file, paste the following code:

   document.addEventListener('DOMContentLoaded', function() {   const productJson = document.querySelectorAll('[id^=ProductJson-');if (productJson.length > 0) {     for (let i = 0; i < productJson.length; i++) {       const current = productJson[i];       const sectionId = current.id.replace('ProductJson-', '');       const section = document.querySelector('[data-section-id="' + sectionId + '"]');       const product = JSON.parse(current.text);if (product.options.length === 1) {         const unavailableVariants = [];for (let j = 0; j < product.variants.length; j++) {           const variant = product.variants[j];if (!variant.available) {             unavailableVariants.push(variant);           }         }if (unavailableVariants.length > 0) {           const mutationCallback = function() {             const variantOptions = section.querySelectorAll('.single-option-selector option');if (variantOptions.length > 0) {               for (let k = 0; k < unavailableVariants.length; k++) {                 const unavailableVariant = unavailableVariants[k];for (let l = 0; l < variantOptions.length; l++) {                   const option = variantOptions[l];if (unavailableVariant.title === option.value) {                     option.remove();                   }                 }               }if (typeof observer === 'object' && typeof observer.disconnect === 'function') {                 observer.disconnect();               }             }           }const observer = new MutationObserver(mutationCallback);           const addToCartForm = document.querySelector('form[action*="/cart/add"]');mutationCallback();if (window.MutationObserver && addToCartForm.length) {             const config = { childList: true, subtree: true };if (typeof observer === 'object' && typeof observer.disconnect === 'function') {               observer.disconnect();             }observer.observe(addToCartForm, config);           }         }       }     }   } });

2. Click Save.

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

（本文内容根据网络资料整理和来自用户投稿，出于传递更多信息之目的，不代表本站其观点和立场。本站不具备任何原创保护和所有权，也不对其真实性、可靠性承担任何法律责任，特此声明！）

常见问答(FQAS)

在Shopify后台商品库存管理面板,可以设置商品的库存数量。当库存变为0时,Shopify系统会自动将该商品从商品页面删除或禁用。

当库存为0时,可以修改商品详情页上的商品标题和描述,提示购物者该商品现已售罄。例如在标题或描述中增加\"即将到货\"等字样,告知潜在顾客需要等待再次入库。

对于同一产品但不同规格的多属性商品,需要针对每个属性组合设置独立的库存数量。当某个属性组合的库存为0时,仅隐藏或禁用该属性组合,其他组合如果仍有库存则继续开放销售。

库存信息一经更新,Shopify后台会自动将库存状态实时同步至前台。但为避免缓存问题,可以手动刷新商品详情页,或者设置页面缓存时间较短,让顾客看到最新的库存信息。