Dodaj link kontynuacji zakupów do koszyka

Możesz dodać link Kontynuuj zakupy do strony koszyka, który umożliwia klientom łatwy powrót do przeglądania produktów po dodaniu czegoś do koszyka. Możesz dodać link pozwalający klientom na powrót do strony katalogu, strony głównej lub do ostatniej strony kolekcji, którą oglądali.

Kontynuuj zakupy

Aby dodać link Kontynuuj zakupy do strony swojego koszyka:

  1. W katalogu Sekcje kliknij cart-template.liquid. Jeśli dla Twojego szablonu nie istnieje ten plik, kliknij cart.liquid w katalogu Szablony.

  2. Znajdź kod przycisku Realizacja zakupu, wyszukując plik dla name="checkout". Linia kodu przycisku realizacji zakupu różni się w zależności od szablonu, ale będzie wyglądać ogólnie tak:

<button type="submit" id="checkout" name="checkout" class="btn">
  {{ 'cart.general.checkout' | t }}
</button>
  1. Następnym krokiem jest wklejenie nowej linii kodu w celu utworzenia linku Kontynuuj zakupy. Wklejony kod będzie zależeć od strony, do której ma odsyłać link:
<a href="/collections/all" title="Continue shopping">Continue shopping</a>
### For a link that goes to your home page

To add a link that goes to your home page, paste the following code on a new line either before or after the code for the **Checkout** button:
<a href="/" title="Continue shopping">Continue shopping</a>
### For a link that goes to the last collection viewed

To add a link that goes to the last collection viewed, paste the following code on a new line either before or after the code for the **Checkout** button:
<a
  id="continue-shopping"
  href=""
  title="Continue shopping">
  Continue shopping
</a>
  1. Kliknij Zapisz. W przypadku dodania linku odsyłającego do strony katalogu lub strony głównej nie musisz robić nic więcej. Jeśli dodałeś(-aś) link odsyłający do ostatniej oglądanej kolekcji, musisz dodać kod JavaScript do kodu szablonu. Kontynuuj, aby wykonać kolejne kroki.

  2. W katalogu Układ kliknij theme.liquid.

  3. Znajdź tag zamykający </body> w dolnej części pliku. Wklej powyższy kod nad tagiem zamykającym </body>:

<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. Kliknij opcję Zapisz.

Dodaj stylizację przycisku (opcjonalnie)

Jeśli korzystasz z darmowego szablonu Shopify, możesz zastosować stylizację do linku Kontynuuj zakupy, aby upodobnić go do przycisku. Dodając atrybut klasy do kodu linku przycisku, możesz dopasować przycisk do stylu innych przycisków w swoim szablonie. Wszystkie darmowe szablony Shopify używają tej samej nazwy klasy dla stylów głównych przycisków i większość z nich używa tej samej nazwy klasy dla stylów dodatkowych przycisków.

Aby zastosować styl przycisku głównego do linku Kontynuuj zakupy:

Dodaj atrybut class="btn" do linii kodu wklejonego w celu dodania linku Kontynuuj zakupy. Twój kod powinien wyglądać tak:

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

Aby zastosować styl przycisku dodatkowego do linku Kontynuuj zakupy:

Jeśli używasz darmowego szablonu innego niż Supply, dodaj atrybut class="btn--secondary" do linii kodu wklejonego w celu dodania linku Kontynuuj zakupy. Twój kod powinien wyglądać tak:

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

Jeśli korzystasz z szablonu Supply, dodaj atrybut class="btn-secondary" do linii kodu wklejonego w celu dodania linku Kontynuuj zakupy. Twój kod powinien wyglądać następująco:

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

Gotowy(-a) do rozpoczęcia sprzedaży za pomocą Shopify?

Wypróbuj za darmo