Voeg een "winkel verder"-link toe aan je winkelwagen

Deze pagina is afgedrukt op Mar 30, 2023. Ga voor de huidige versie naar https://help.shopify.com/nl/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/add-back-link.

Je kunt een 'winkel verder'-link toevoegen aan je winkelwagenpagina waarmee klanten eenvoudig kunnen terugkeren naar het bladeren door producten nadat ze iets aan de winkelwagen hebben toegevoegd. Je kunt ervoor kiezen om een link toe te voegen die klanten terugbrengt naar je cataloguspagina, naar je homepage of naar de laatste collectiepagina die ze bekeken.

Een 'winkel verder'-link aan je winkelwagenpagina toevoegen

Om een Winkel verder link aan je winkelwagenpagina toe te voegen:

Ga in het Shopify-beheercentrum naar Onlinewinkel > Thema's.
Zoek het thema dat je wilt bewerken, klik op de knop ... om het actiemenu te openen en klik vervolgens op Code bewerken.

Tik in de Shopify-app op Winkel.
Tik in het gedeelte Verkoopkanalen op Onlinewinkel.
Tik op Thema's beheren.
Zoek het thema dat je wilt bewerken, klik op de knop ... om het actiemenu te openen en klik vervolgens op Code bewerken.

Tik in de Shopify-app op Winkel.
Tik in het gedeelte Verkoopkanalen op Onlinewinkel.
Tik op Thema's beheren.
Zoek het thema dat je wilt bewerken, klik op de knop ... om het actiemenu te openen en klik vervolgens op Code bewerken.

Klik in de directory Secties op cart-template.liquid. Klik op cart.liquid in het menu Templates als je thema dit bestand niet bevat.
Zoek de code voor de checkoutknop door in het bestand naar name="checkout" te zoeken. De coderegel voor de checkoutknop verschilt per thema, maar ziet er als volgt uit:

<button type="submit" id="checkout" name="checkout" class="btn">
  {{ 'cart.general.checkout' | t }}
</button>

De volgende stap is om een nieuwe coderegel te plakken om een 'winkel verder'-link te maken. De code die je plakt, is afhankelijk van de pagina waarop je de link wilt plaatsen:

<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>

Klik op Opslaan. Als je een link hebt toegevoegd die naar je cataloguspagina of je homepage leidt, ben je klaar. Als je een link toevoegt die naar de laatst bekeken collectie leidt, moet je JavaScript toevoegen aan je themacode. Ga verder met de volgende stappen.
Klik in de directory Opmaak op theme.liquid.
Zoek de sluitende tag </body> onderaan het bestand. Plak de volgende code boven de sluitende tag </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>

Klik op Opslaan.

Knopstijl toevoegen (optioneel)

Als je een gratis Shopify-thema gebruikt, kun je een stijl toepassen op je 'winkel verder'-link om deze op een knop te laten lijken. Door een klasse-attribuut toe te voegen aan de code voor je knoplink, kun je je knop laten overeenkomen met de stijl van de andere knoppen in je thema. Alle gratis Shopify-thema's gebruiken dezelfde klassenaam voor primaire knopstijlen en de meeste gebruiken dezelfde klassenaam voor secundaire knopstijlen.

Om primaire knopcustomisatie aan je Winkel verder-link toe te voegen:

Voeg het attribuut class="btn" toe aan de regel code die je hebt geplakt om een 'Winkel verder'-link toe te voegen. Je code hoort er zo uit te zien:

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

Secundaire knopstijl aan je 'Winkel verder'-link toevoegen:

Als je een gratis thema gebruikt dat geen Supply is, voeg je het attribuut class="btn--secondary" toe aan de coderegel die je hebt geplakt om een 'Winkel verder'-link toe te voegen. Je code ziet er als volgende uit:

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

Als je Supply gebruikt, voeg dan het attribuut class="btn-secondary" toe aan de regel code die je hebt geplakt om een Winkel verder-link toe te voegen. Je code hoort er zo uit te zien:

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

Voeg een "winkel verder"-link toe aan je winkelwagen

Een 'winkel verder'-link aan je winkelwagenpagina toevoegen

Knopstijl toevoegen (optioneel)

Om primaire knopcustomisatie aan je Winkel verder-link toe te voegen:

Secundaire knopstijl aan je 'Winkel verder'-link toevoegen:

Klaar om te beginnen met verkopen met Shopify?