Lisää ostoskoriisi Jatka ostoksia ‑linkki

Voit lisätä ostoskorisivullesi Jatka ostoksia ‑linkin, jonka avulla asiakkaat voivat helposti palata selailemaan tuotteita, sen jälkeen kun he ovat lisänneet jotakin ostoskoriinsa. Voit valita, mihin lisättävä linkki palauttaa asiakkaat: tuoteluettelosivullesi, etusivullesi vai kokoelmasivulle, jota he katselivat viimeksi ennen ostoskoriin siirtymistä.

Jatka ostoksia

Jatka ostoksia ‑linkin lisääminen ostoskorisivullesi

Näin voit lisätä ostoskorisivullesi Jatka ostoksia ‑linkin:

  1. Klikkaa Osat-hakemistossa kohtaa cart-template.liquid. Jos teemassasi ei ole tätä tiedostoa, valitse silloin Mallit-hakemistosta cart.liquid.

  2. Etsi Kassa-painikkeen koodi hakemalla tiedostosta kohta name="checkout". Kassapainikkeen koodirivi vaihtelee teeman mukaan, mutta se näyttää suurin piirtein tältä:

<button type="submit" id="checkout" name="checkout" class="btn">
  {{ 'cart.general.checkout' | t }}
</button>
  1. Seuraava vaihe on liittää uusi koodirivi Jatka ostoksia ‑linkin luomiseksi. Liitettävä koodi riippuu siitä, mihin sivuun haluat linkin vievän:

Tuoteluettelosivullesi vievä linkki

Lisää tuoteluettelosivullesi vievä linkki liittämällä seuraava koodi uudelle riville joko ennen Kassapainikkeen koodia tai sen jälkeen:

<a href="/collections/all" title="Continue shopping">Continue shopping</a>

Etusivullesi vievä linkki

Lisää etusivullesi vievä linkki liittämällä seuraava koodi uudelle riville joko ennen Kassapainikkeen koodia tai sen jälkeen:

<a href="/" title="Continue shopping">Continue shopping</a>

Viimeksi katsottuun kokoelmaan vievä linkki

Lisää viimeksi katsottuun kokoelmaan vievä linkki liittämällä seuraava koodi uudelle riville joko ennen Kassapainikkeen koodia tai sen jälkeen:

<a
  id="continue-shopping"
  href=""
  title="Continue shopping">
  Continue shopping
</a>
  1. Valitse Tallenna. Jos lisäsit tuoteluettelosivullesi tai etusivullesi vievän linkin, olet valmis. Jos lisäsit viimeksi katsottuun kokoelmaan vievän linkin, sinun on lisättävä teemasi koodiin JavaScriptiä. Jatka seuraavien vaiheiden mukaisesti.

  2. Valitse Ulkoasu-luettelosta theme.liquid.

  3. Etsi lähellä tiedoston alareunaa oleva lopputunniste </body>. Liitä seuraava koodi lopputunnisteen </body> alle:

<script>
  if(Storage !== undefined) {

    var defaultLink = "/collections/all";

    {% if template contains 'collection' %}
      sessionStorage.collection = "{{ collection.url }}";
    {% endif %}

    {% if template contains 'cart' %}
      if( !sessionStorage.collection ) {
        sessionStorage.collection = defaultLink;
      }
      document.getElementById("continue-shopping").href = sessionStorage.collection;
    {% endif %}

    }
</script>
  1. Napauta Tallenna.

Painikkeen muotoilun lisääminen (valinnainen)

Jos käytät ilmaista Shopify-teemaa, voit lisätä Jatka ostoksia ‑linkkiisi muotoilun, jotta se näyttää painikkeelta. Jos lisäät painikelinkkisi koodiin luokkamääritteen, voit tehdä painikkeesta teemasi muiden painikkeiden tyylisen. Kaikissa ilmaisissa Shopify-teemoissa käytetään samaa luokkanimeä ensisijaisissa painiketyyleissä, ja useimmissa käytetään samaa luokkanimeä toissijaisissa painiketyyleissä.

Näin voit lisätä ensisijaisen painikkeen tyylin Jatka ostoksia ‑linkkiisi:

Lisää määrite class="btn" liittämällesi koodiriville, jotta voit lisätä Jatka ostoksia ‑linkin. Koodisi pitäisi näyttää tältä:

<a href="/collections/all" title="Continue shopping" class="btn">
  Continue shopping
</a>

Näin voit lisätä toissijaisen painikkeen tyylin Jatka ostoksia ‑linkkiisi:

Huomautus: tämän luokan lisääminen ei vaikuta Boundless-teemaan.

Jos käytät muuta ilmaisteemaa kuin Supply-teemaa, lisää määrite class="btn--secondary" liittämällesi koodiriville lisätäksesi Jatka ostoksia ‑linkin. Koodisi pitäisi näyttää tältä:

<a href="/collections/all" title="Continue shopping" class="btn--secondary">
  Continue shopping
</a>

Jos käytät Supply-teemaa, lisää määrite class="btn-secondary" liittämällesi koodiriville lisätäksesi Jatka ostoksia ‑linkin. Koodisi pitäisi näyttää tältä:

<a href="/collections/all" title="Continue shopping" class="btn-secondary">
  Continue shopping
</a>

Oletko valmis aloittamaan myynnin Shopifyssa?

Kokeile ilmaiseksi