Føj et Tilbage til butikken-link til din indkøbskurv

Du kan føje et Tilbage til butikken-link til din side med indkøbskurven, så dine kunder hurtigt kan gå tilbage produktvisningen, når de har lagt en vare i indkøbskurven. Du kan vælge at tilføje et link, der fører kunderne tilbage til din katalogside, tilbage til startsiden eller tilbage til den sidste kollektionsside, som de kiggede på.

Tilbage til butikken

Føj et “Tilbage til butikken”-link til siden med indkøbskurv

Desktop
  1. Gå til Webshop > Temaer i din Shopify-administrator.
  2. Find det tema, du vil redigere, og klik på knappen for at åbne handlingsmenuen. Klik derefter på Rediger kode.
  3. Klik på cart-template.liquid i mappen Afsnit. Hvis dit tema ikke indeholder denne fil, skal du klikke på cart.liquid i mappen Skabeloner.
  4. Find koden til knappen Betaling ved at søge efter name="checkout" i filen. Linjen med kode til betalingsknappen varierer fra tema til tema, men ser nogenlunde således ud:
<button type="submit" id="checkout" name="checkout" class="btn">
   {{ 'cart.general.checkout' | t }}
</button>

 5. Det næste trin er at indsætte en ny kodelinje for at oprette et Fortsæt med at shoppe-link. Den kode, du indsætter, afhænger af, hvilken side du vil have linket til at gå til: * Hvis du vil tilføje et link, der går til din katalogside, skal du indsætte følgende kode på en ny linje enten før eller efter koden for knappen Betaling:

<a href="/collections/all" title="Continue shopping">Continue shopping</a>
  • Hvis du vil tilføje et link, der fører til din startside, skal du indsætte følgende kode på en ny linje enten før eller efter koden for knappen Betaling:
<a href="/" title="Continue shopping">Continue shopping</a>
  • Hvis du vil tilføje et link, der fører til den sidst viste kollektion, skal du indsætte følgende kode på en ny linje enten før eller efter koden for knappen Betaling:
<a
  id="continue-shopping"
  href=""
  title="Continue shopping">
  Continue shopping
</a>

 6. Klik på Gem. Hvis du har tilføjet et link, der enten fører til din katalogside eller din startside, er du færdig. Hvis du har tilføjet et link, der fører til den sidst viste kollektion, skal du føje JavaScript til din temakode. Fortsæt for at følge de næste trin:

 7. I mappen Layout skal du klikke på theme.liquid.

 8. Find det afsluttende </body>-tag tæt på bunden af filen. Indsæt følgende kode over det afsluttende </body>-tag:

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

 9. Klik på Gem.

iPhone
  1. Tryk på knappen i Shopify-appen.
  2. Tryk på Webshop i afsnittet Salgskanaler.
  3. Tryk på Administrer temaer.
  4. Find det tema, du vil redigere, og klik på knappen for at åbne handlingsmenuen. Klik derefter på Rediger kode.
  5. Klik på cart-template.liquid i mappen Afsnit. Hvis dit tema ikke indeholder denne fil, skal du klikke på cart.liquid i mappen Skabeloner.
  6. Find koden til knappen Betaling ved at søge efter name="checkout" i filen. Linjen med kode til betalingsknappen varierer fra tema til tema, men ser nogenlunde således ud:
<button type="submit" id="checkout" name="checkout" class="btn">
  {{ 'cart.general.checkout' | t }}
</button>
  1. Det næste trin er at indsætte en ny kodelinje for at oprette et Tilbage til butikken-link. Koden, som du indsætter, afhænger af den side, som du gerne vil linke til:
    • Hvis du vil tilføje et link, der fører til din katalogside, skal du indsætte følgende kode på en ny linjen enten før eller efter koden for knappen **Betaling**:
<a href="/collections/all" title="Continue shopping">Continue shopping</a>
  • Hvis du vil tilføje et link, der fører til din startside, skal du indsætte følgende kode på en ny linje enten før eller efter koden for knappen Betaling:
<a href="/" title="Continue shopping">Continue shopping</a>
  • Hvis du vil tilføje et link, der fører til den sidst viste kollektion, skal du indsætte følgende kode på en ny linje enten før eller efter koden for knappen Betaling:
<a
  id="continue-shopping"
  href=""
  title="Continue shopping">
  Continue shopping
</a>
  1. Klik på Gem. Hvis du har tilføjet et link, der enten fører til din katalogside eller din startside, er du færdig. Hvis du har tilføjet et link, der fører til den sidst viste kollektion, skal du føje JavaScript til din temakode. Fortsæt for at følge de næste trin:
  2. I mappen Layout skal du klikke på theme.liquid.
  3. Find det afsluttende </body>-tag tæt på bunden af filen. Indsæt følgende kode over det afsluttende </body>-tag:
<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. Klik på Gem.
Android
  1. Tryk på knappen i Shopify-appen.
  2. Tryk på Webshop i afsnittet Salgskanaler.
  3. Tryk på Administrer temaer.
  4. Find det tema, du vil redigere, og klik på knappen for at åbne handlingsmenuen. Klik derefter på Rediger kode.
  5. Klik på cart-template.liquid i mappen Afsnit. Hvis dit tema ikke indeholder denne fil, skal du klikke på cart.liquid i mappen Skabeloner.
  6. Find koden til knappen Betaling ved at søge efter name="checkout" i filen. Linjen med kode til betalingsknappen varierer fra tema til tema, men ser nogenlunde således ud:
<button type="submit" id="checkout" name="checkout" class="btn">
  {{ 'cart.general.checkout' | t }}
</button>
  1. Det næste trin er at indsætte en ny kodelinje for at oprette et Tilbage til butikken-link. Koden, som du indsætter, afhænger af den side, som du gerne vil linke til:
    • Hvis du vil tilføje et link, der fører til din katalogside, skal du indsætte følgende kode på en ny linjen enten før eller efter koden for knappen **Betaling**:
<a href="/collections/all" title="Continue shopping">Continue shopping</a>
  • Hvis du vil tilføje et link, der fører til din startside, skal du indsætte følgende kode på en ny linje enten før eller efter koden for knappen Betaling:
<a href="/" title="Continue shopping">Continue shopping</a>
  • Hvis du vil tilføje et link, der fører til den sidst viste kollektion, skal du indsætte følgende kode på en ny linje enten før eller efter koden for knappen Betaling:
<a
  id="continue-shopping"
  href=""
  title="Continue shopping">
  Continue shopping
</a>
  1. Klik på Gem. Hvis du har tilføjet et link, der enten fører til din katalogside eller din startside, er du færdig. Hvis du har tilføjet et link, der fører til den sidst viste kollektion, skal du føje JavaScript til din temakode. Fortsæt for at følge de næste trin:
  2. I mappen Layout skal du klikke på theme.liquid.
  3. Find det afsluttende </body>-tag tæt på bunden af filen. Indsæt følgende kode over det afsluttende </body>-tag:
<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. Klik på Gem.

Tilføj knaptypografi (valgfrit)

Hvis du bruger et gratis Shopify-tema, kan du anvende typografi på linket Tilbage til butikken, så linket kommer til at ligne en knap. Hvis du føjer en klasseattribut til dit knaplink, kan du få knappen til at matche typografien for de andre knapper i dit tema. Alle gratis Shopify-temaer bruger det samme klassenavn til de primære knaptypografier, og de fleste bruger det samme klassenavn til sekundære knaptypografier.

Sådan anvender du primær knaptypografi på dit Tilbage til butikken-link:

Tilføj attributten class="btn" på den kodelinje, som du indsatte i linket Tilbage til butikken. Din kode bør se således ud:

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

Sådan anvender du sekundær knaptypografi på dit Tilbage til butikken-link:

Hvis du bruger et andet gratis tema end Supply, skal du tilføje attributten class="btn--secondary" på den kodelinje, som du indsatte for at tilføje et Tilbage til butikken-link. Din kode bør se således ud:

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

Hvis du bruger Supply, skal du tilføje attributten class="btn-secondary" på den kodelinje, som du indsatte for at tilføje et Tilbage til butikken-link. Din kode bør se sådan ud:

<a href="/collections/all" title="Continue shopping" class="btn-secondary">
  Continue shopping
</a>
Kan du ikke finde de svar, du leder efter? Vi er her for at hjælpe.