隱藏售罄多屬性

• 找到您的模板架構版本

• 探索“Online Store 2.0”模板自定義

您可以通過在產品頁面上刪除或禁用售罄的多屬性來阻止客戶選擇這些多屬性。

本頁相關主題

• 限制

• 選擇您的模板

限制

此頁面中概述的自定義設置不適用于以下情況：

• 您的產品有多個產品選項

• 您使用 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- + 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. 點擊保存。

Hide sold-out variants

.

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

.

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

特別聲明：以上文章內容僅代表作者本人觀點，不代表ESG跨境電商觀點或立場。如有關于作品內容、版權或其它問題請于作品發表后的30日內與ESG跨境電商聯系。