Link "Mit dem Shoppen fortfahren" zu deinem Warenkorb hinzufügen

Diese Seite wurde gedruckt um Mar 24, 2023. Die neueste Version findest du unter https://help.shopify.com/de/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/add-back-link.

Du kannst deiner Warenkorbseite den Link Einkauf fortsetzen hinzufügen. So können Kunden schnell zur Produktansicht zurückkehren, nachdem sie dem Warenkorb ein Produkt hinzugefügt haben. Du kannst einen Link hinzufügen, der Kunden zurück zur Katalogseite, zur Startseite oder zur letzten Kategorieseite führt.

Weiter einkaufen

Auf der Warenkorbseite einen Link zum Fortsetzen des Einkaufs hinzufügen

So fügst du den Link Einkauf fortsetzen zu deiner Warenkorbseite hinzu:

  1. Gehe in deinem Shopify-Adminbereich auf Onlineshop > Themes.

  2. Suche das Theme, das du bearbeiten möchtest, klicke auf die Schaltfläche ..., um das Aktionsmenü zu öffnen, und klicke dann auf Code bearbeiten.

  1. Tippe in der Shopify App auf Shop.

  2. Tippe unter Vertriebskanäle auf Onlineshop.

  3. Tippe auf Themes verwalten.

  4. Suche das Theme, das du bearbeiten möchtest, klicke auf die Schaltfläche ..., um das Aktionsmenü zu öffnen, und klicke dann auf Code bearbeiten.

  1. Tippe in der Shopify App auf Shop.

  2. Tippe unter Vertriebskanäle auf Onlineshop.

  3. Tippe auf Themes verwalten.

  4. Suche das Theme, das du bearbeiten möchtest, klicke auf die Schaltfläche ..., um das Aktionsmenü zu öffnen, und klicke dann auf Code bearbeiten.

  1. Klicke im Verzeichnis Abschnitte auf cart-template.liquid. Wenn dein Theme nicht über diese Datei verfügt, klicke im Verzeichnis Vorlagen auf cart.liquid.

  2. Suche nach dem Code für die Checkout-Schaltfläche, indem du in der Datei nach name="checkout" suchst. Die Codezeile für die Checkout-Schaltfläche variiert je nach Theme, sieht aber etwa so aus:

<button type="submit" id="checkout" name="checkout" class="btn">
  {{ 'cart.general.checkout' | t }}
</button>
  1. Im nächsten Schritt musst du eine neue Codezeile einfügen, um den Link Einkauf fortsetzen zu erstellen. Der Code, den du einfügen musst, hängt davon ab, auf welcher Seite der Link angezeigt werden soll: 
<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. Klicke auf Speichern. Wenn du einen Link hinzugefügt hast, der auf deine Katalogseite oder Startseite verweist, bist du fertig. Wenn du einen Link hinzugefügt hast, der auf die zuletzt geöffnete Kategorieseite verweist, musst du deinem Theme-Code etwas JavaScript-Code hinzufügen. Befolge dazu die nächsten Schritte.

  2. Klicke in der Übersicht Layout auf theme.liquid .

  3. Suche das abschließende Tag </body> am Ende der Datei. Füge den folgenden Code über dem abschließenden Tag </body> ein:

<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. Klicke auf Speichern.

Schaltflächenstil hinzufügen (optional)

Wenn du ein kostenloses Shopify-Theme verwendest, kannst du dem Link Einkauf fortsetzen einen Stil verpassen, damit der Link wie eine Schaltfläche aussieht. Wenn du dem Schaltflächenlink-Code ein Klassenattribut hinzufügst, kannst du sicherstellen, dass der Stil der Schaltfläche mit dem Stil der anderen Schaltflächen in deinem Theme übereinstimmt. Alle kostenlosen Shopify-Themes verwenden denselben Klassennamen für Stile primärer Schaltflächen. Außerdem verwenden die meisten kostenlosen Shopify-Themes denselben Klassennamen für Stile sekundärer Schaltflächen.

So wendest du den Stil für primäre Schaltflächen auf den Link "Weiter einkaufen" an:

Füge das Attribut class="btn" zu der Codezeile hinzu, die du eingefügt hast, um den Link Einkauf fortsetzen hinzuzufügen. Dein Code sollte nun folgendermaßen aussehen:

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

So wendest du den Stil für primäre Schaltflächen auf den Link "Einkauf fortsetzen" an:

Wenn du ein kostenloses Theme außer Supply verwendest, füge das Attribut class="btn--secondary" zu der Codezeile hinzu, die du eingefügt hast, um den Link Einkauf fortsetzen hinzuzufügen. Dein Code sollte nun folgendermaßen aussehen:

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

Wenn du Supply verwendest, füge das Attribut class="btn-secondary" zu der Codezeile hinzu, die du eingefügt hast, um den Link Weiter einkaufen hinzuzufügen. Dein Code sollte nun folgendermaßen aussehen:

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

Bereit, mit Shopify zu verkaufen?

Kostenlos testen