Få kundene til å velge et alternativ

Advarsel

Eldre temaer er ikke tilgjengelige i Theme Store. Disse temaene har ikke funksjonene som er inkludert i Shopifys Online Store 2.0-temaer, og Shopifys gratis eldre temaer mottar ikke oppdateringer ut over sikkerhetsrettelser.

Merk

Hvis du bruker et gratis tema fra Shopify, kan det hende du kan kontakte Shopify-brukerstøtte for hjelp med denne veiledningen. Det krever 15 minutters designtid. For å finne ut mer, kan du se _Støtte for temaer–.

Merk

Denne tilpasningen er for eldre Shopify-temaer, og gjelder ikke for Nettbutikk 2.0-temaer.

• Finn ut temaets arkitekturversjon
• Utforsk Online Store 2.0-tematilpasninger

Når en kunde besøker en produktside i nettbutikken velges den første tilgjengelige varianten som standard. Du kan bruke denne tilpasningen for å deaktivere automatisk valg av den første tilgjengelige varianten. På den måten vil kunden bli bedt om å manuelt velge en variant før noe vises. )

Merk

Fordi denne tilpasningen forhindrer en variant fra å bli valgt som standard, kan det hende temaet ikke viser en produktpris før kunden velger en variant. Dette er en forventet adferd, fordi produkter med varianter ikke har en fremhevet pris. Prisen som vises avgjøres av hvilken variant som velges.

Seksjonerte og ikke-seksjonerte temaer

Merk

Trinnene i denne opplæringen varierer avhengig av om du bruker et kategorisert eller et ukategorisert tema. Et kategorisert tema lar deg dra og slippe for å sortere layouten på startsiden, noe du ikke kan gjøre med et ukategorisert tema.

For å finne ut om temaet ditt støtter seksjoner kan du gå til temaets Rediger kode-side. Hvis det er filer i Seksjoner-katalogen, bruker du et tema med seksjoner. Temaer uten seksjoner ble utgitt før oktoper 2016 og har ingen filer i Seksjoner-katalogen.

Hvis du bruker et tema med seksjoner, klikker du på Seksjonerte temaer-knappen og følger anvisningene. Hvis du bruker et eldre tema uten seksjoner, klikker du på Ikke-sesksjonerte temaer knappen og følger anvisningen.

Sectioned themes

Velg tema

Trinnene for denne tilpasningen varierer avhengig av valgt tema. Klikk på knappen for temaet ditt før du følger anvisningene nedenfor:

Boundless

Steg for Boundless

Følg disse trinnene for å bruke tilpasningen for Boundless:

Rediger temaets JavaScript-fil

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
3. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
4. Finn koden initVariantSelectors. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject, this.$container);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject, this.$container);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Finn følgende kodelinje:

$(selectors.addToCartText).html(theme.strings.soldOut);

Det er to forekomster av denne kodelinjen, begge ligger i productVariantCallback-funksjonen. Erstatt bare den andre forekomsten med:

$(selectors.addToCartText).html('Make a Selection');

1. Klikk på Lagre.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initVariantSelectors. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject, this.$container);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject, this.$container);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Finn følgende kodelinje:

$(selectors.addToCartText).html(theme.strings.soldOut);

Det er to forekomster av denne kodelinjen, begge ligger i productVariantCallback-funksjonen. Erstatt bare den andre forekomsten med:

$(selectors.addToCartText).html('Make a Selection');

1. Klikk på Lagre.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initVariantSelectors. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject, this.$container);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject, this.$container);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Finn følgende kodelinje:

$(selectors.addToCartText).html(theme.strings.soldOut);

Det er to forekomster av denne kodelinjen, begge ligger i productVariantCallback-funksjonen. Erstatt bare den andre forekomsten med:

$(selectors.addToCartText).html('Make a Selection');

1. Klikk på Lagre.

Merk

Noen versjoner av Boundless inkluderer ikke kodelinjen som skal erstattes i dette trinnet. Hvis du ikke finner koden, kan du gå videre til neste steg.

Rediger produktsidemalen

Slik redigerer du produktsidemalen

1. I Deler-katalogen klikker du på product-template.liquid.

2. Finn følgende kode:

{% assign current_variant = product.selected_or_first_available_variant %}

Erstatt det med:

{% assign current_variant = product.selected_variant %}

1. Finn følgende kode og slett den:

{% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %}

1. Finn koden {% schema %}. Lim inn følgende kode på en egen linje etter koden over:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

Den skal se omtrent slik ut:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

{% schema %}

1. Klikk på Lagre.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.

Debut

Steg for Debut

Følg disse trinnene for å bruke tilpasningen for Debut:

Rediger temaets JavaScript-fil

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
3. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
4. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Finn koden _updatePrice: function(variant). Erstatt følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price &&
  variant.unit_price === this.currentVariant.unit_price
) {
  return;
}

med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price &&
  variant.unit_price === this.currentVariant.unit_price
) {
  return;
} */

Hvis du ikke finner koden ovenfor, finner du følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
}

Erstatt det med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
} */

1. Finn koden this.currentVariant = variant;

Legg til følgende kode under:

this._updatePaymentButton(variant);

Resultatet skal se omtrent slik ut:

this.currentVariant = variant;
this._updatePaymentButton(variant);

1. Finn koden _updateImages: function(variant). Erstatt følgende kode:

var currentVariantImage = this.currentVariant.featured_image || {};

med:

if (this.currentVariant != undefined) {
  var currentVariantImage = this.currentVariant.featured_image || {};
}

1. Rett nedenfor finner du følgende kode:

if (
  !variant.featured_image ||
  variantImage.src === currentVariantImage.src
) {
  return;
}

Erstatt det med:

/* if (
  !variant.featured_image ||
  variantImage.src === currentVariantImage.src
) {
  return;
} */

1. Finn koden _updateSKU: function(variant). Erstatt følgende kode:

if (variant.sku === this.currentVariant.sku) {
  return;
}

med:

if (this.currentVariant != undefined ) {
  if (variant.sku === this.currentVariant.sku) {
    return;
  }
}

1. Finn koden _initVariants: function() {. Erstatt følgende kode:

if (this.storeAvailability && this.variants.currentVariant.available) {
  this.storeAvailability.updateContent(this.variants.currentVariant.id);
}

med:

/* if (this.storeAvailability && this.variants.currentVariant.available) {
  this.storeAvailability.updateContent(this.variants.currentVariant.id);
} */

Merk

Denne koden må bare erstattes i Debut versjon 17.5.0 og nyere.

1. Finn følgende kode:

_updateSKU: function(variant) {
  if (this.currentVariant != undefined ) {
    if (variant.sku === this.currentVariant.sku) {
      return;
    }
  }

  this.container.dispatchEvent(
    new CustomEvent('variantSKUChange', {
      detail: {
        variant: variant
      },
      bubbles: true,
      cancelable: true
    })
  );
},

Legg til følgende kode på en ny linje under koden ovenfor:

_updatePaymentButton: function(variant) {
  if (this.currentVariant != undefined) {
    const paymentButton = document.querySelector('.payment-button');

    if (paymentButton) {
      paymentButton.removeAttribute('class', 'visually-hidden');
     }
  } else {
    document.querySelector('.payment-button').setAttribute('class', 'visually-hidden');
  }
},

Den skal se omtrent slik ut:

_updateSKU: function(variant) {
  if (this.currentVariant != undefined ) {
    if (variant.sku === this.currentVariant.sku) {
      return;
    }
  }

  this.container.dispatchEvent(
    new CustomEvent('variantSKUChange', {
      detail: {
        variant: variant
      },
      bubbles: true,
      cancelable: true
    })
  );
},

_updatePaymentButton: function(variant) {
  if (this.currentVariant != undefined) {
    const paymentButton = document.querySelector('.payment-button');

    if (paymentButton) {
      paymentButton.removeAttribute('class', 'visually-hidden');
     }
  } else {
    document.querySelector('.payment-button').setAttribute('class', 'visually-hidden');
  }
},

1. Klikk på Lagre.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Finn koden _updatePrice: function(variant). Erstatt følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price &&
  variant.unit_price === this.currentVariant.unit_price
) {
  return;
}

med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price &&
  variant.unit_price === this.currentVariant.unit_price
) {
  return;
} */

Hvis du ikke finner koden ovenfor, finner du følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
}

Erstatt det med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
} */

1. Finn koden this.currentVariant = variant;

Legg til følgende kode under:

this._updatePaymentButton(variant);

Resultatet skal se omtrent slik ut:

this.currentVariant = variant;
this._updatePaymentButton(variant);

1. Finn koden _updateImages: function(variant). Erstatt følgende kode:

var currentVariantImage = this.currentVariant.featured_image || {};

med:

if (this.currentVariant != undefined) {
  var currentVariantImage = this.currentVariant.featured_image || {};
}

1. Rett nedenfor finner du følgende kode:

if (
  !variant.featured_image ||
  variantImage.src === currentVariantImage.src
) {
  return;
}

Erstatt det med:

/* if (
  !variant.featured_image ||
  variantImage.src === currentVariantImage.src
) {
  return;
} */

1. Finn koden _updateSKU: function(variant). Erstatt følgende kode:

if (variant.sku === this.currentVariant.sku) {
  return;
}

med:

if (this.currentVariant != undefined ) {
  if (variant.sku === this.currentVariant.sku) {
    return;
  }
}

1. Finn koden _initVariants: function() {. Erstatt følgende kode:

if (this.storeAvailability && this.variants.currentVariant.available) {
  this.storeAvailability.updateContent(this.variants.currentVariant.id);
}

med:

/* if (this.storeAvailability && this.variants.currentVariant.available) {
  this.storeAvailability.updateContent(this.variants.currentVariant.id);
} */

Merk

Denne koden må bare erstattes i Debut versjon 17.5.0 og nyere.

1. Finn følgende kode:

_updateSKU: function(variant) {
  if (this.currentVariant != undefined ) {
    if (variant.sku === this.currentVariant.sku) {
      return;
    }
  }

  this.container.dispatchEvent(
    new CustomEvent('variantSKUChange', {
      detail: {
        variant: variant
      },
      bubbles: true,
      cancelable: true
    })
  );
},

Legg til følgende kode på en ny linje under koden ovenfor:

_updatePaymentButton: function(variant) {
  if (this.currentVariant != undefined) {
    const paymentButton = document.querySelector('.payment-button');

    if (paymentButton) {
      paymentButton.removeAttribute('class', 'visually-hidden');
     }
  } else {
    document.querySelector('.payment-button').setAttribute('class', 'visually-hidden');
  }
},

Den skal se omtrent slik ut:

_updateSKU: function(variant) {
  if (this.currentVariant != undefined ) {
    if (variant.sku === this.currentVariant.sku) {
      return;
    }
  }

  this.container.dispatchEvent(
    new CustomEvent('variantSKUChange', {
      detail: {
        variant: variant
      },
      bubbles: true,
      cancelable: true
    })
  );
},

_updatePaymentButton: function(variant) {
  if (this.currentVariant != undefined) {
    const paymentButton = document.querySelector('.payment-button');

    if (paymentButton) {
      paymentButton.removeAttribute('class', 'visually-hidden');
     }
  } else {
    document.querySelector('.payment-button').setAttribute('class', 'visually-hidden');
  }
},

1. Klikk på Lagre.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Finn koden _updatePrice: function(variant). Erstatt følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price &&
  variant.unit_price === this.currentVariant.unit_price
) {
  return;
}

med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price &&
  variant.unit_price === this.currentVariant.unit_price
) {
  return;
} */

Hvis du ikke finner koden ovenfor, finner du følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
}

Erstatt det med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
} */

1. Finn koden this.currentVariant = variant;

Legg til følgende kode under:

this._updatePaymentButton(variant);

Resultatet skal se omtrent slik ut:

this.currentVariant = variant;
this._updatePaymentButton(variant);

1. Finn koden _updateImages: function(variant). Erstatt følgende kode:

var currentVariantImage = this.currentVariant.featured_image || {};

med:

if (this.currentVariant != undefined) {
  var currentVariantImage = this.currentVariant.featured_image || {};
}

1. Rett nedenfor finner du følgende kode:

if (
  !variant.featured_image ||
  variantImage.src === currentVariantImage.src
) {
  return;
}

Erstatt det med:

/* if (
  !variant.featured_image ||
  variantImage.src === currentVariantImage.src
) {
  return;
} */

1. Finn koden _updateSKU: function(variant). Erstatt følgende kode:

if (variant.sku === this.currentVariant.sku) {
  return;
}

med:

if (this.currentVariant != undefined ) {
  if (variant.sku === this.currentVariant.sku) {
    return;
  }
}

1. Finn koden _initVariants: function() {. Erstatt følgende kode:

if (this.storeAvailability && this.variants.currentVariant.available) {
  this.storeAvailability.updateContent(this.variants.currentVariant.id);
}

med:

/* if (this.storeAvailability && this.variants.currentVariant.available) {
  this.storeAvailability.updateContent(this.variants.currentVariant.id);
} */

Merk

Denne koden må bare erstattes i Debut versjon 17.5.0 og nyere.

1. Finn følgende kode:

_updateSKU: function(variant) {
  if (this.currentVariant != undefined ) {
    if (variant.sku === this.currentVariant.sku) {
      return;
    }
  }

  this.container.dispatchEvent(
    new CustomEvent('variantSKUChange', {
      detail: {
        variant: variant
      },
      bubbles: true,
      cancelable: true
    })
  );
},

Legg til følgende kode på en ny linje under koden ovenfor:

_updatePaymentButton: function(variant) {
  if (this.currentVariant != undefined) {
    const paymentButton = document.querySelector('.payment-button');

    if (paymentButton) {
      paymentButton.removeAttribute('class', 'visually-hidden');
     }
  } else {
    document.querySelector('.payment-button').setAttribute('class', 'visually-hidden');
  }
},

Den skal se omtrent slik ut:

_updateSKU: function(variant) {
  if (this.currentVariant != undefined ) {
    if (variant.sku === this.currentVariant.sku) {
      return;
    }
  }

  this.container.dispatchEvent(
    new CustomEvent('variantSKUChange', {
      detail: {
        variant: variant
      },
      bubbles: true,
      cancelable: true
    })
  );
},

_updatePaymentButton: function(variant) {
  if (this.currentVariant != undefined) {
    const paymentButton = document.querySelector('.payment-button');

    if (paymentButton) {
      paymentButton.removeAttribute('class', 'visually-hidden');
     }
  } else {
    document.querySelector('.payment-button').setAttribute('class', 'visually-hidden');
  }
},

1. Klikk på Lagre.

Rediger produktsidemalen

Slik redigerer du produktsidemalen

1. I Deler-katalogen klikker du på product-template.liquid.

2. Finn følgende kode:

{%- assign current_variant = product.selected_or_first_available_variant -%}

Erstatt det med:

{%- if product.variants.size > 1 -%}
  {%- assign current_variant = product.selected_variant -%}
{%- else %}
  {%- assign current_variant = product.first_available_variant -%}
{%- endif %}

1. Finn følgende kode og slett den:

{% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %}

Hvis du ikke finner koden over, finner du denne koden og sletter den:

{%- if variant == current_variant %} selected="selected" {%- endif -%}

1. Finn følgende kode:

{%- assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image -%}

Erstatt det med:

{%- assign featured_image = current_variant.featured_image | default: product.featured_image -%}

Hvis du ikke finner koden over, finner du denne koden:

{%- assign featured_media = product.selected_or_first_available_variant.featured_media | default: product.featured_media -%}

Erstatt det med:

{%- assign featured_media = current_variant.featured_media | default: product.featured_media -%}

Merk

Enkelte versjoner av Debut inneholder ikke kodelinjen som skal skiftes ut i dette trinnet. Hvis du ikke finner koden, kan du gå videre til neste steg.

1. Finn følgende kode:

{% unless current_variant.available %}
  {{ 'products.product.sold_out' | t }}
{% else %}
  {{ 'products.product.add_to_cart' | t }}
{% endunless %}

Erstatt det med:

{% if current_variant == blank %}
  {{ 'products.product.unavailable' | t }}
{% elsif current_variant.available %}
  {{ 'products.product.add_to_cart' | t }}
{% else %}
  {{ 'products.product.sold_out' | t }}
{% endif %}

1. Finn følgende kode:

{% if section.settings.enable_payment_button %}
  {{ form | payment_button }}
{% endif %}

Erstatt det med:

<div class="payment-button {% if current_variant == blank %}visually-hidden {% endif %}">
  {% if section.settings.enable_payment_button %}
    {{ form | payment_button }}
  {% endif %}
</div>

1. Finn koden {% schema %}. Lim inn følgende kode på en egen linje etter koden over:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

Den skal se omtrent slik ut:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

{% schema %}

1. Klikk på Lagre.

Endre produktpriskodebiten

For å redigere kodebiten for produktpris:

1. I Kodesnutter-katalogen klikker du på product-price.liquid.

2. Finn følgende kode:

{%- liquid
  if variant.title
    assign compare_at_price = variant.compare_at_price
    assign price = variant.price
    assign available = variant.available
  else
    assign compare_at_price = 1999
    assign price = 1999
    assign available = true
  endif

  assign money_price = price | money
-%}

Erstatt det med:

{%- liquid
  if variant.title
    assign compare_at_price = variant.compare_at_price
    assign price = variant.price
    assign available = variant.available
  elsif product.title
    assign compare_at_price = product.compare_at_price
    assign price = product.price
    assign available = product.available
  else
    assign compare_at_price = 1999
    assign price = 1999
    assign available = true
  endif

  assign money_price = price | money
-%}

Merk

Enkelte versjoner av Debut inneholder ikke kodelinjen som skal skiftes ut i dette trinnet. Hvis du ikke finner koden, kan du gå videre til neste steg.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.

Minimal

Steg for Minimal

Følg disse stegene for å bruke tilpasningen for Minimal:

Rediger temaets JavaScript-fil

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
3. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
4. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Hide selectors if we only have 1 variant and its title contains 'Default'.
if (
  product.variants.length === 1 &&
  product.variants[0].title.toLowerCase().indexOf('default') !== -1
) {
  $('.selector-wrapper', this.$container).hide();
}

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Hide selectors if we only have 1 variant and its title contains 'Default'.
if (
  product.variants.length === 1 &&
  product.variants[0].title.toLowerCase().indexOf('default') !== -1
) {
  $('.selector-wrapper', this.$container).hide();
}

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Hide selectors if we only have 1 variant and its title contains 'Default'.
if (
  product.variants.length === 1 &&
  product.variants[0].title.toLowerCase().indexOf('default') !== -1
) {
  $('.selector-wrapper', this.$container).hide();
}

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Hide selectors if we only have 1 variant and its title contains 'Default'.
if (
  product.variants.length === 1 &&
  product.variants[0].title.toLowerCase().indexOf('default') !== -1
) {
  $('.selector-wrapper', this.$container).hide();
}

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Hide selectors if we only have 1 variant and its title contains 'Default'.
if (
  product.variants.length === 1 &&
  product.variants[0].title.toLowerCase().indexOf('default') !== -1
) {
  $('.selector-wrapper', this.$container).hide();
}

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Hide selectors if we only have 1 variant and its title contains 'Default'.
if (
  product.variants.length === 1 &&
  product.variants[0].title.toLowerCase().indexOf('default') !== -1
) {
  $('.selector-wrapper', this.$container).hide();
}

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

Rediger produktsidemalen:

Slik redigerer du produktsidemalen

1. I Deler-katalogen klikker du på product-template.liquid.
2. Finn følgende kode:

{% assign variant = product.selected_or_first_available_variant %}

Erstatt det med:

{% assign variant = product.selected_variant %}

1. Finn følgende kode og slett den:

{% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %}

1. Finn alle forekomster av denne koden:

{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}

Erstatt dem med:

{% assign featured_image = product.selected_variant.featured_image | default: product.featured_image %}

1. Finn koden {% schema %}. Lim inn følgende kode på en egen linje etter koden over:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

Den skal se omtrent slik ut:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

{% schema %}

1. Klikk på Lagre.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.

Narrative

Steg for Narrative

Følg disse stegene for å bruke tilpasningen for Narrative:

Rediger temaets JavaScript-fil

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
3. I Ressurser-katalogen klikker du på custom.js.
4. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Klikk på Lagre.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på custom.js.
6. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Klikk på Lagre.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på custom.js.
6. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Klikk på Lagre.

Rediger produktsidemalen

Slik redigerer du produktsidemalen

1. I Deler-katalogen klikker du på product-template.liquid.

2. Finn følgende kode:

{%- assign current_variant = product.selected_or_first_available_variant -%}

Erstatt det med:

{%- if product.variants.size > 1 -%}
  {%- assign current_variant = product.selected_variant -%}
{%- else -%}
  {%- assign current_variant = product.first_available_variant -%}
{%- endif -%}

1. Finn koden {% schema %}. Lim inn følgende kode på en egen linje etter koden over:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

Den skal se omtrent slik ut:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

{% schema %}

1. Klikk på Lagre.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.

Simple

Steg for Simple

Følg disse stegene for å bruke tilpasningen for Simple

Rediger temaets JavaScript-fil

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
3. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
4. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
Slate.simplifyVariantLabels(this.productSingleObject, this.$container);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
Slate.simplifyVariantLabels(this.productSingleObject, this.$container);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
Slate.simplifyVariantLabels(this.productSingleObject, this.$container);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
Slate.simplifyVariantLabels(this.productSingleObject, this.$container);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
Slate.simplifyVariantLabels(this.productSingleObject, this.$container);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
Slate.simplifyVariantLabels(this.productSingleObject, this.$container);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

Rediger produktsidemalen

Slik redigerer du produktsidemalen

1. I Deler-katalogen klikker du på product-template.liquid.

2. Finn følgende kode:

{% assign current_variant = product.selected_or_first_available_variant %}

Erstatt det med:

{% assign current_variant = product.selected_variant %}

1. Finn følgende kode og slett den:

{% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %}

1. Finn koden {% schema %}. Lim inn følgende kode på en egen linje etter koden over:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

Den skal se omtrent slik ut:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

{% schema %}

1. Klikk på Lagre.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.

Supply

Steg for Supply

Følg disse stegene for å bruke tilpasningen for Supply:

Rediger temaets JavaScript-fil

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
3. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
4. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Finn koden initProductVariant: function() {. Finn følgende kode nedenfor:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject);

Legg til følgende kode på en ny linje under:

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

Den skal se omtrent slik ut:

// Clean up variant labels if the Shopify-defined
// defaults are the only ones left
this.simplifyVariantLabels(this.productSingleObject);

if (typeof(productOptions) != "undefined") {
  for (i = 0; i < productOptions.length; i++) {
    const vowels = ['a', 'e', 'i', 'o', 'u'];
    const firstOptionLetter = productOptions[i][i][0].toLowerCase();
    let indef = 'a';

    if (vowels.includes(firstOptionLetter)) {
      indef = 'an';
    };

    const select = document.querySelectorAll('.single-option-selector')[i];
    const options = select.querySelectorAll('option');

    if (options.length > 1) {
      let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

      select.add(option, select.firstChild);
      select.selectedIndex = 0;
    }
  }
}

1. Klikk på Lagre.

Rediger produktsidemalen

Slik redigerer du produktsidemalen

1. I Deler-katalogen klikker du på product-template.liquid.

2. Finn følgende kode:

{% assign variant = product.selected_or_first_available_variant %}

Erstatt det med:

{% assign variant = product.selected_variant %}

1. Finn følgende kode og slett den:

{% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %}

1. Finn alle forekomster av denne koden:

{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}

Erstatt det med:

{% assign featured_image = product.selected_variant.featured_image | default: product.featured_image %}

1. Finn koden {% schema %}. Lim inn følgende kode på en egen linje etter koden over:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

Den skal se omtrent slik ut:

{% if current_variant == blank %}
  <script>
    var productOptions = [];

    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

{% schema %}

1. Klikk på Lagre.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.

Venture

Steg for Venture

Følg disse stegene for å bruke tilpasningen for Venture:

Rediger temaets JavaScript-fil

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
3. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
4. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Finn følgende kode:

this.currentVariant = this._getVariantFromOptions();

Erstatt det med:

this.currentVariant = this._getVariantFromOptions() || {};

1. Finn koden _updatePrice: function(variant). Erstatt følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
}

med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
} */

1. Klikk på Lagre.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Finn følgende kode:

this.currentVariant = this._getVariantFromOptions();

Erstatt det med:

this.currentVariant = this._getVariantFromOptions() || {};

1. Finn koden _updatePrice: function(variant). Erstatt følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
}

med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
} */

1. Klikk på Lagre.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanaler-seksjonen trykker du på Nettbutikk.
3. Trykk på Administrer temaer.
4. Finn temaet du vil redigere, klikk på …-knappen for å åpne handlingsmenyen, og klikk deretter på Rediger kode.
5. I Ressurser-katalogen klikker du på theme.js eller theme.js.liquid.
6. Lim følgende kode nederst i filen:

(function() {
  if (typeof(productOptions) != "undefined") {
    for (i = 0; i < productOptions.length; i++) {
      const vowels = ['a', 'e', 'i', 'o', 'u'];
      const firstOptionLetter = productOptions[i][i][0].toLowerCase();
      let indef = 'a';

      if (vowels.includes(firstOptionLetter)) {
        indef = 'an';
      };

      const select = document.querySelectorAll('.single-option-selector')[i];
      const options = select.querySelectorAll('option');

      if (options.length > 1) {
        let option = new Option('Pick ' + indef + ' ' + productOptions[i][i], '');

        select.add(option, select.firstChild);
        select.selectedIndex = 0;
      }
    }
  }
})();

1. Finn følgende kode:

this.currentVariant = this._getVariantFromOptions();

Erstatt det med:

this.currentVariant = this._getVariantFromOptions() || {};

1. Finn koden _updatePrice: function(variant). Erstatt følgende kode:

if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
}

med:

/* if (
  variant.price === this.currentVariant.price &&
  variant.compare_at_price === this.currentVariant.compare_at_price
) {
  return;
} */

1. Klikk på Lagre.

Rediger produktsidemalen

Slik redigerer du produktsidemalen

1. I Deler-katalogen klikker du på product-template.liquid.

2. Finn følgende kode:

{% assign current_variant = product.selected_or_first_available_variant %}

Erstatt det med:

{% if product.variants.size > 1 %}
  {% assign current_variant = product.selected_variant %}
{% else %}
  {% assign current_variant = product.first_available_variant %}
{% endif %}

1. Finn følgende kode og slett den:

{% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %}

Hvis du ikke finner koden over, finner du denne koden og sletter den:

{% if variant == current_variant %} selected="selected" {% endif %}

1. Finn alle forekomster av denne koden:

{% unless current_variant.available %}

Erstatt det med:

{% unless current_variant.available or product.variants.size == 1 and variant.available %}

1. Finn følgende kode:

{% unless current_variant.available or product.variants.size == 1 and variant.available %}
  {{ 'products.product.sold_out' | t }}
{% else %}
  {{ 'products.product.add_to_cart' | t }}
{% endunless %}

Erstatt det med:

{% if current_variant == blank %}
  {{ 'products.product.unavailable' | t }}
{% else %}
  {% unless current_variant.available or product.variants.size == 1 and variant.available %}
    {{ 'products.product.sold_out' | t }}
  {% else %}
    {{ 'products.product.add_to_cart' | t }}
  {% endunless %}
{% endif %}

1. Finn koden {% schema %}. Lim inn følgende kode på en egen linje etter koden over:

{% if current_variant == blank %}
  <script>
    var productOptions = [];
    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}

Den skal se omtrent slik ut:

{% if current_variant == blank %}
  <script>
    var productOptions = [];
    {% for option in product.options -%}
      var optionObj = {};
      optionObj[{{ forloop.index0 }}] = "{{ product.options[forloop.index0] }}";
      productOptions.push(optionObj);
    {%- endfor %}
  </script>
{% endif %}
{% schema %}

1. Klikk på Lagre.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.

Non-sectioned themes

Legg til beskjeder i variantens rullegardinmenyer

Slik legger du til beskjeder i rullegardinmenyene for varianter:

1. I Utdrag-katalogen klikker du på Legg til et nytt utdrag.
2. Gi den nye kodebiten navnet pick-an-option.

1. I den nye utdragsfilen limer du inn denne koden fra GitHub.
2. Klikk på Lagre.
3. I Oppsett-katalogen klikker du på theme.liquid.
4. Finn den avsluttende </body> taggen nesten nederst i filen. Lim inn følgende kode på en ny linje like over den avsluttende </body>-taggen:

{% render 'pick-an-option' %}

1. Klikk på Lagre.

2. Finn filen som inneholder skjemaet Legg i handlekurv. Skjemaet har en action-attributt satt til /cart/add. Den skal finnes i en av disse fire filene:

   • product.liquid-malen under Maler
   • theme.liquid-oppsett under Oppsett
   • product.liquid-utdraget under Utdrag
   • single-product.liquid-utdraget under Utdrag

3. Finn denne koden i skjemaet:

<option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} data-sku="{{ variant.sku }}" value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money_with_currency }}</option>

eller

<option {% if variant == current_variant %} selected="selected" {% endif %} data-sku="{{ variant.sku }}" value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money_with_currency }}</option>

Erstatt det med:

<option {% if forloop.length <= 1 and variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} data-sku="{{ variant.sku }}" value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money_with_currency }}</option>

1. Finn og erstatt følgende kode:
   • Minimal, Pop eller Supply: Hvis du bruker Minimal, Pop eller Supply, finn alle forekomstene av denne koden:

{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}

Erstatt dem med:

{% assign featured_image = product.selected_variant.featured_image | default: product.featured_image %}

• Andre gratis Shopify-temaer: Hvis du bruker et annet Shopify-tema, finn denne koden:

{% assign current_variant = product.selected_or_first_available_variant %}

Erstatt det med:

{% assign current_variant = product.selected_variant %}

1. Klikk på Lagre.

Endre språkinnstillingene for Legg i handlekurv-knappen.

Du kan endre språkinnstillingene for Legg i handlekurv-knappen slik at produktene ikke vises som «utilgjengelige» før et valg foretas.

Datamaskin

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.

iPhone

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

Android

1. Trykk på …-knappen fra Shopify-appen.
2. I Salgskanal-seksjonen trykker du på Nettbutikk.
3. Trykk på Redigere temaer.

1. Finn temaet du vil redigere, og klikk deretter på … > Rediger standardtemainnhold.

2. I Filter-boksen, begynn å skrive unavailable for å vise oversettelsen for «Utilgjengelig».

3. Erstatt teksten Utilgjengelig med Make a selection.

4. Klikk på Lagre.