Lisää määräsääntöjä Shopify-teemaasi

Tämä sivu on tulostettu May 28, 2023. Nykyinen versio on osoitteessa https://help.shopify.com/fi/manual/b2b/catalogs/code.

B2B-luettelon määräsääntöjä tuetaan vain ilmaisissa Shopify-teemoissa, versiossa 8.0.0 tai sitä uudemmissa. Jos et halua muuttaa tai päivittää teemaa, voit näyttää määräsäännöt lisäämällä teemaan seuraavan koodin.

Tällä sivulla

Tuotekorin määrä

Tuoteversion ostoskorin määrän arvo voidaan näyttää tuotesivulla tai esittelytuoteosiossa. Arvo voidaan noutaa Liquidia käyttämällä.

Lisää Liquid-tuotekorin määräkoodi

Voit tukea ostoskorin määrää lisäämällä koodia seuraaviin teemasi tiedostoihin:

  • main-product.liquid tai vastaava
  • featured-product.liquid tai vastaava

Vaiheet:

  1. Valitse Shopifyn Admin-sivulla Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Avaa tiedosto, jota haluat muokata.
  2. Luo uusi rivi tiedoston loppuun ja lisää seuraava koodi: 
{% comment %} Cart quantity {% endcomment %}
<span id="CartQuantity-{{ section.id }}" data-product-url="{{ product.url }}" data-section-id="{{ section.id }}" data-variant-id="{{ product.selected_or_first_available_variant.id }}">
    {%- assign cart_qty = cart | item_count_for_variant: product.selected_or_first_available_variant.id -%}
    {{- 'products.product.quantity.in_cart' | t: quantity: cart_qty -}}
</span>
  1. Klikkaa Tallenna.

Lisää Javascript-tuotekorin määräkoodi

Kun tuoteversion ostoskorin määrä muuttuu, tuotesivulla tai esittelytuoteosiossa näkyvä arvo on päivitettävä. Päivitetty arvo voidaan noutaa Javascript-koodilla.

Voit lisätä koodin theme.js-tiedostoon tai vastaavaan.

Vaiheet:

  1. Valitse Shopifyn Admin-sivulla Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Avaa theme.js -tiedosto.
  2. Luo uusi rivi tiedoston loppuun ja lisää seuraava koodi: 
let productUrl = document.querySelector('[data-product-url]').dataset.productUrl;
let sectionId = document.querySelector('[data-section-id]').dataset.sectionId;
let variantId = document.querySelector('[data-variant-id]').dataset.variantId;

// Fetch updated HTML from Section Rendering API
fetch(`${productUrl}?section_id=${sectionId}&variant=${variantId}`)
    .then((response) => response.text())
    .then((responseText) => {
        // Replace the current HTML in DOM with the updated HTML

        const updatedHtml = new DOMParser().parseFromString(responseText, 'text/html');

        // Update the cart quantity
        const currentCartQuantity = document.querySelector(`#CartQuantity-${sectionId}`);
        const updatedCartQuantity = updatedHtml.querySelector(`#CartQuantity-${sectionId}`);
        currentCartQuantity.innerHTML = updatedCartQuantity.innerHTML;
    });
  1. Klikkaa Tallenna.

Määräsäännöt

Tuoteversiota koskevat määräsäännöt voidaan näyttää tuotesivulla tai esittelytuoteosiossa. Säännöt voidaan noutaa Liquidin avulla.

Lisää Liquid-määräsääntökoodi

Voit tukea tuotteen ostoskorin määrää lisäämällä koodia seuraaviin teemasi tiedostoihin:

  • main-product.liquid tai vastaava
  • featured-product.liquid tai vastaava

Vaiheet:

  1. Valitse Shopifyn Admin-sivulla Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Avaa tiedosto, jota haluat muokata.
  2. Luo uusi rivi tiedoston loppuun ja lisää sitten seuraava koodi: 
{% comment %} Quantity rules {% endcomment %}
<div id="QuantityRules-{{ section.id }}" data-product-url="{{ product.url }}" data-section-id="{{ section.id }}" data-variant-id="{{ product.selected_or_first_available_variant.id }}">
    {%- if product.selected_or_first_available_variant.quantity_rule.increment > 1 -%}
        <span>
        {{- 'products.product.quantity.multiples_of' | t: quantity: product.selected_or_first_available_variant.quantity_rule.increment -}}
        </span>
    {%- endif -%}
    {%- if product.selected_or_first_available_variant.quantity_rule.min > 1 -%}
        <span>
        &nbsp;-&nbsp;
        {{- 'products.product.quantity.minimum_of' | t: quantity: product.selected_or_first_available_variant.quantity_rule.min -}}
        </span>
    {%- endif -%}
    {%- if product.selected_or_first_available_variant.quantity_rule.max != null -%}
        <span>
        &nbsp;-&nbsp;
        {{- 'products.product.quantity.maximum_of' | t: quantity: product.selected_or_first_available_variant.quantity_rule.max -}}
        </span>
    {%- endif -%}
</div>
  1. Klikkaa Tallenna.

Lisää Javascript-määräsääntökoodi

Jokaisella tuoteversiolla voi olla omat määräsääntönsä. Kun eri versio on valittu, tuotesivulla tai esittelytuoteosiossa näkyvät määräsäännöt on päivitettävä. Päivitetty arvo voidaan noutaa Javascript-koodilla.

  • theme.js tai vastaava
  • en.default.json

Vaiheet:

  1. Valitse Shopifyn Admin-sivulla Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Avaa theme.js -tiedosto.
  2. Luo uusi rivi tiedoston loppuun ja lisää sitten seuraava koodi: 
let productUrl = document.querySelector('[data-product-url]').dataset.productUrl;
let sectionId = document.querySelector('[data-section-id]').dataset.sectionId;
let variantId = document.querySelector('[data-variant-id]').dataset.variantId;
// `variantId` is set to the current variant's id. Replace this value with the updated variant's id

// Fetch updated HTML from Section Rendering API
fetch(`${productUrl}?section_id=${sectionId}&variant=${variantId}`)
    .then((response) => response.text())
    .then((responseText) => {
        // Replace the current HTML in DOM with the updated HTML

        const updatedHtml = new DOMParser().parseFromString(responseText, 'text/html');

        // Update the quantity rules
        const currentQuantityRules = document.querySelector(`#QuantityRules-${sectionId}`);
        const updatedQuantityRules = updatedHtml.querySelector(`#QuantityRules-${sectionId}`);
        currentQuantityRules.innerHTML = updatedQuantityRules.innerHTML;
    });
  1. Klikkaa Tallenna.

Lisää alueita

Lisää JSON-käännösmerkkijonoja

Vaiheet:

  1. Valitse Shopifyn Admin-sivulla Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Napauta Shopify-sovelluksessa Kauppa.

  2. Napauta Myyntikanavat-kohdassa Verkkokauppa.

  3. Napauta Hallinnoi teemoja.

  4. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.

  1. Avaa en.default.json-tiedosto.
  2. Luo uusi rivi tiedoston loppuun ja lisää sitten seuraava koodi: 
{
   "products":{
      "quantity":{
         "minimum_of":"Minimum of ",
         "maximum_of":"Maximum of ",
         "multiples_of":"Increments of ",
         "in_cart": " in cart"
      }
   }
}
  1. Klikkaa Tallenna.

Valmiina aloittamaan Shopifyssa?

Kokeile ilmaiseksi