Skjul udsolgte varianter
Du kan forhindre, at dine kunder vælger udsolgte varianter, ved at fjerne eller deaktivere disse varianter på produktsiden.
Begrænsninger
De tilpasninger, der er angivet på denne side, virker ikke i følgende tilfælde:
- Dine produkter har mere end én produktmulighed
- Du bruger Express-temaet og har indstillet produktsiden til at vise produkter i overlejring
Temaer med og uden sektioner
Bemærk: Trinnene i denne vejledning er forskellige, afhængigt af om du bruger et tema med sektioner eller uden sektioner. Med et tema med sektioner kan du trække og slippe for at arrangere startsidens layout – det kan du ikke med et tema uden sektioner.
Du kan finde ud af, om dit tema understøtter sektioner, ved at gå til temaets side Rediger kode. Hvis der er filer i mappen Sektioner, bruger du et tema med sektioner. Temaer uden sektioner blev udgivet før oktober 2016 og har ikke filer i mappen Sektioner.
Hvis du bruger et tema med afsnit, skal du klikke på knappen Temaer med afsnit og følge instruktionerne. Hvis du bruger et ældre tema uden afsnit, skal du klikke på knappen Temaer uden afsnit og følge instruktionerne.
Vælg dit tema
Trinnene til denne tilpasning varierer afhængigt af dit tema. Klik på knappen for dit tema, inden du følger vejledningen nedenfor:
Boundless
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Boundless:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Boundless:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Brooklyn
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Brooklyn:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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 radioButtons = section.querySelector('.single-option-radio');
let variantOptions;
if (radioButtons) {
variantOptions = section.querySelectorAll('.single-option-radio input');
} else {
variantOptions = section.querySelectorAll('.single-option-selector__radio 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) {
if (radioButtons) {
option.nextElementSibling.remove();
}
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Brooklyn:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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 radioButtons = section.querySelector('.single-option-radio');
let variantOptions;
if (radioButtons) {
variantOptions = section.querySelectorAll('.single-option-radio input');
} else {
variantOptions = section.querySelectorAll('.single-option-selector__radio 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) {
if (radioButtons) {
option.nextElementSibling.option.setAttribute('disabled', 'disabled');
}
option.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Debut
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Debut:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Debut:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Express
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Express:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
I mappen Layout skal du klikke på
theme.liquid.Find koden
</body>. Indsæt følgende kode på en separat linje over dette:
<script>
document.addEventListener('DOMContentLoaded', function() {
const productJson = document.querySelectorAll('[data-product-json]');
if (productJson.length > 0) {
for (let i = 0; i < productJson.length; i++) {
const current = productJson[i];
const section = current.closest('[data-section-id]');
const currentJson = JSON.parse(current.text);
if (currentJson.options.length === 1) {
const unavailableVariants = [];
for (let j = 0; j < currentJson.variants.length; j++) {
const variant = currentJson.variants[j];
if (!variant.available) {
unavailableVariants.push(variant);
}
}
if (unavailableVariants.length > 0) {
const mutationCallback = function() {
const variantOptions = section.querySelectorAll('.form__input--select 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);
}
}
}
}
}
});
</script>- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Express:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
<script>
document.addEventListener('DOMContentLoaded', function() {
const productJson = document.querySelectorAll('[data-product-json]');
if (productJson.length > 0) {
for (let i = 0; i < productJson.length; i++) {
const current = productJson[i];
const section = current.closest('[data-section-id]');
const currentJson = JSON.parse(current.text);
if (currentJson.options.length === 1) {
const unavailableVariants = [];
for (let j = 0; j < currentJson.variants.length; j++) {
const variant = currentJson.variants[j];
if (!variant.available) {
unavailableVariants.push(variant);
}
}
if (unavailableVariants.length > 0) {
const mutationCallback = function() {
const variantOptions = section.querySelectorAll('.form__input--select 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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});
</script>- Klik på Gem.
Minimal
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Minimal:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Minimal:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Narrative
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Narrative:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
custom.jsi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
document.addEventListener('DOMContentLoaded', function() {
const productJson = document.querySelectorAll('[data-product-json]');
if (productJson.length > 0) {
for (let i = 0; i < productJson.length; i++) {
const current = productJson[i];
const section = current.closest('[data-section-id]');
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Narrative:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
document.addEventListener('DOMContentLoaded', function() {
const productJson = document.querySelectorAll('[data-product-json]');
if (productJson.length > 0) {
for (let i = 0; i < productJson.length; i++) {
const current = productJson[i];
const section = current.closest('[data-section-id]');
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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Simple
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Simple:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Simple:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Supply
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Supply:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Supply:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Venture
Trinnene til denne tilpasning varierer afhængigt af, om du vil skjule udsolgte varianter eller blot deaktivere dem. Klik på knappen for dit foretrukne valg, før du følger vejledningen nedenfor:
Skjul udsolgte varianter
Følg disse trin for at anvende tilpasningen til Venture:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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);
}
}
}
}
}
});- Klik på Gem.
Deaktiver udsolgte varianter
Følg disse trin for at anvende tilpasningen til Venture:
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på
theme.jsellertheme.js.liquidi mappen Aktiver.Indsæt nedenstående kode i bunden af filen:
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.setAttribute('disabled', 'disabled');
}
}
}
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);
}
}
}
}
}
});- Klik på Gem.
Skjul udsolgte varianter
Hvis du bruger et tema uden sektioner, kan du følge disse trin for at skjule udsolgte varianter på produktsiden.
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på Opret et nyt kodestykke i mappen Kodestykker.
Navngiv dit nye kodestykke
remove-sold-out:
- Indsæt følgende kode i din nye fil med kodestykket:
{% if product.options.size == 1 %}
<script>
const addToCartForm = document.querySelector('form[action="/cart/add"]');
if (window.MutationObserver && addToCartForm !== null) {
if (typeof observer === 'object' && typeof observer.disconnect === 'function') {
observer.disconnect();
}
var config = { childList: true, subtree: true };
var observer = new MutationObserver(function() {
let variantOptions = Array.from(document.querySelectorAll('.single-option-selector option'));
{% for variant in product.variants %}
{% unless variant.available %}
variantOptions.forEach(function(element) {
if (element.value === {{ variant.title | json }}) {
element.remove();
}
});
{% endunless %}
{% endfor %}
observer.disconnect();
});
observer.observe(addToCartForm, config);
}
</script>
{% endif %}Klik på Gem.
I mappen Layout skal du klikke på
theme.liquid.Indsæt følgende kode tæt på slutningen af filen lige før det afsluttende
</body>-tag:
{% render 'remove-sold-out' %}- Klik på Gem.
Deaktiver udsolgte varianter
Hvis du bruger et tema uden sektioner, kan du følge disse trin til at deaktivere udsolgte varianter. Varianterne vises stadig på produktsiden, men de kan ikke vælges.
Gå til Webshop > Temaer i din Shopify-administrator.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Tryk på Butik i Shopify-appen.
Tryk på Webshop i afsnittet Salgskanaler.
Tryk på Administrer temaer.
Find det tema, du vil redigere, klik på knappen ... for at åbne handlingsmenuen, og klik derefter på Rediger kode.
Klik på Opret et nyt kodestykke i mappen Kodestykker.
Navngiv dit nye kodestykke
disable-sold-out:Indsæt følgende kode i din nye fil med kodestykket:
{% if product.options.size == 1 %}
<script>
const addToCartForm = document.querySelector('form[action="/cart/add"]');
if (window.MutationObserver && addToCartForm !== null) {
if (typeof observer === 'object' && typeof observer.disconnect === 'function') {
observer.disconnect();
}
var config = { childList: true, subtree: true };
var observer = new MutationObserver(function() {
let variantOptions = Array.from(document.querySelectorAll('.single-option-selector option'));
{% for variant in product.variants %}
{% unless variant.available %}
variantOptions.forEach(function(element) {
if (element.value === {{ variant.title | json }}) {
element.setAttribute('disabled', '');
}
});
{% endunless %}
{% endfor %}
observer.disconnect();
});
observer.observe(addToCartForm, config);
}
</script>
{% endif %}Klik på Gem.
I mappen Layout skal du klikke på
theme.liquid.Indsæt følgende kode tæt på slutningen af filen lige før det afsluttende
</body>-tag:
{% render 'disable-sold-out' %}- Klik på Gem.