Das Wichtigste in Kürze
- Der einfachste Weg, einen Button hinzuzufügen, ist über den Theme-Editor — die meisten Abschnitte haben einen integrierten Button-Block, den du hinzufügen kannst.
- Für eine individuelle Platzierung von Buttons außerhalb bestehender Abschnitte benötigst du entweder Code oder ein KI-Tool wie Fudge.
- Die Verlinkung eines Buttons zu einer Seite, einem Produkt oder einer externen URL erfolgt in den Einstellungen des Buttons im Theme-Editor.
- Sticky Add-to-Cart-Buttons und Header-CTAs erfordern eine App, ein Theme, das sie enthält, oder eine Code-Anpassung.
Um einen Button in Shopify hinzuzufügen, öffnest du den Theme-Editor, wählst einen Abschnitt aus und fügst einen Button-Block hinzu. Dann legst du die Beschriftung (Label) und den Link fest. Wenn ein Abschnitt keinen Button-Block hat, benötigst du Code, eine App oder Fudge.
Warum du uns vertrauen kannst
Wir haben Hunderte von Shopify-Storefronts aufgebaut und angepasst. Wir haben außerdem Fudge entwickelt, den KI-Operator für Shopify-Stores, mit einer 4.9-Bewertung im Shopify App Store.
Wie man einen Button im Shopify Theme-Editor hinzufügt
Die meisten Shopify-Abschnitte unterstützen Button-Blöcke von Haus aus. Das ist die schnellste Methode.
Schritt 1. Gehe zu Onlineshop → Themes → Anpassen.
Schritt 2. Navigiere zu der Seite und dem Abschnitt, wo du den Button haben möchtest.
Schritt 3. Klicke auf den Abschnitt, um seine Einstellungen zu öffnen. Suche in der linken Seitenleiste nach einem Button-Block oder der Option Block hinzufügen.
Schritt 4. Füge den Button-Block hinzu. Gib die Button-Beschriftung (den angezeigten Text) und den Link (wohin er bei Klick führt) ein.
Schritt 5. Speichern.
Wenn du keine Button-Option siehst, enthält die Vorlage für diesen Abschnitt schlichtweg keinen. Du müsstest dann entweder zu einem Abschnitt wechseln, der einen Button anbietet, oder einen per Code oder mit Fudge hinzufügen.
Für die optimale Größe von Buttons auf Smartphones, lies unseren Artikel Shopify-Buttons tippfreundlicher machen.
Wie man in Shopify einen Button mit einer Seite verlinkt
Wenn du im Theme-Editor auf einen Button-Block klickst, siehst du ein Link-Feld. Du kannst verlinken auf:
- Eine Seite — tippe
/pages/deine-seiten-slugein oder nutze die Seitenauswahl - Ein Produkt —
/products/produkt-handle - Eine Kategorie (Collection) —
/collections/kategorie-handle - Eine externe URL — füge die vollständige URL ein
- Eine E-Mail-Adresse —
mailto:hallo@deinshop.de
Die Link-Auswahl im Theme-Editor zeigt eine durchsuchbare Liste deiner Seiten, Produkte und Kategorien an.
Für Buttons auf Kategorieseiten, schau dir an, wie man CTAs zu einer Shopify-Kategorieseite hinzufügt.
Wie man einen Button in den Inhaltsbereich einer Shopify-Seite einfügt
Wenn du eine einfache Seite bearbeitest (Onlineshop → Seiten) und einen Button im Textinhalt hinzufügen möchtest:
Schritt 1. Klicke auf das Link-einfügen-Symbol in der Werkzeugleiste des Seiten-Editors (es sieht aus wie ein Kettenglied).
Schritt 2. Gib deinen Linktext und die URL ein.
Dadurch wird ein Textlink erstellt, kein designter Button. Damit es wie ein Button aussieht, müsstest du eine CSS-Klasse anwenden oder eine entsprechende Theme-Funktion nutzen.
Für einen richtig formatierten CTA-Button innerhalb eines Textes ist es die sauberste Lösung, einen Button-Block über den Theme-Editor hinzuzufügen (sofern dein Theme Abschnitte auf Seiten unterstützt), anstatt den einfachen Text-Editor der Seite zu nutzen.
Wie man einen Sticky Button in Shopify hinzufügt
Ein Sticky Add-to-Cart-Button — also einer, der dem Nutzer beim Scrollen auf der Produktseite am Bildschirmrand folgt — ist ein starkes Feature für die Conversion, das aber in den meisten Themes standardmäßig nicht enthalten ist.
Um einen hinzuzufügen, hast du zwei Optionen:
Option 1 — Eine Shopify-App. Im App Store gibt es mehrere Apps für Sticky Add-to-Cart-Buttons. Das ist der schnellste Weg und erfordert keinen Code.
Option 2 — Eigener Code über Fudge. Beschreibe Fudge, dem KI-Operator für Shopify-Stores, einfach was du brauchst:
“Füge meinen Produktseiten eine Sticky Add-to-Cart-Leiste hinzu, die erscheint, wenn der User am Haupt-Button für den Warenkorb vorbeiscrollt. Zeige den Produkttitel, den Preis und einen Kauf-Button an.”
Fudge generiert den Code und fügt ihn als Entwurf (Draft) in dein Theme ein. Du kannst ihn überprüfen, veröffentlichen und sobald die Leiste live ist, vergleicht Fudge für dich die Add-to-Cart-Rate deiner Produktseiten vor und nach der Änderung.
Für andere Skripte in deinem Theme lies dir durch, wie du eigenes JavaScript in Shopify hinzufügst.
Wie man einen Button in den Shopify-Header einfügt
Um einen CTA-Button im Header deines Stores hinzuzufügen (z. B. “Jetzt shoppen” oder “Gespräch buchen”), musst du in der Regel den Header-Abschnitt deines Themes anpassen.
Im Theme-Editor: Navigiere zum Header-Abschnitt und prüfe, ob es eine Block-Option für Button oder CTA gibt. Manche Premium-Themes bieten das an; das Dawn-Theme und die meisten kostenlosen Themes jedoch nicht.
Wenn dein Theme keine Buttons im Header unterstützt, erfordert das Code — du musst die Datei header.liquid oder die entsprechende Abschnittsdatei bearbeiten, um ein Button-Element mit dem gewünschten Link und Design einzufügen.
Du kannst das einfach Fudge beschreiben: “Füge einen ‘Loslegen’-Button auf der rechten Seite des Headers hinzu, der auf /pages/contact verlinkt.”
Für andere Änderungen an Header und Layout, siehe den Fudge Store Editor.
Wie man den Button-Text in Shopify ändert
Den Button-Text legst du direkt im Theme-Editor fest, wenn du einen Button-Block hinzufügst oder bearbeitest. Klicke auf den Button-Block in den Abschnittseinstellungen und ändere das Feld Beschriftung (Label).
Für Buttons, die tief in den Spracheinstellungen deines Themes verankert sind (wie “In den Warenkorb” oder “Jetzt kaufen”), gehe zu Onlineshop → Themes, klicke auf das Drei-Punkte-Menü (…) neben deinem Theme und wähle Standard-Theme-Inhalt bearbeiten. Suche dort nach dem Satzteil, den du ändern willst, und passe ihn an. Eine komplette Anleitung dazu findest du unter Wie man den Button-Text in Shopify ändert.
FAQ
Was ist der Unterschied zwischen einem Shopify Buy Button und einem Button aus dem Theme-Editor?
Ein Theme-Editor-Button ist ein klickbares Element, das du innerhalb deiner Storefront-Abschnitte für beliebige Links oder CTAs einfügst. Der Buy Button (Kaufen-Button) hingegen ist ein separater Shopify-Vertriebskanal, der ein Widget zum Einbetten erzeugt, mit dem du Shopify-Produkte auf externen Websites (wie einem externen Blog oder einer Landingpage) verkaufen kannst. Nutze Theme-Editor-Buttons für deinen Shopify-Store und den Buy Button für Verkäufe außerhalb davon.
Wie füge ich einen Quick-Add-Button in ein Shopify-Produktraster (Collection Grid) ein?
In modernen Online Store 2.0 Themes öffnest du den Theme-Editor → Vorlage für Kategorien (Collections) → Klick auf den Abschnitt für das Produktraster. Suche dort in den Einstellungen nach einem Schalter für "Quick add" oder "Schnellansicht". Wenn dein Theme keinen hat, musst du entweder das Theme wechseln oder den Button per Code hinzufügen.
Kann ich einen Button ohne Code auf einer Shopify-Seite einfügen?
Ja, sofern der jeweilige Abschnitt im Theme-Editor einen Button-Block anbietet. An Stellen, an denen das Theme keinen Button zulässt (z.B. individuelle Positionen auf der Produktseite, im Header oder mitten im Textbereich), brauchst du eigenen Code, einen Page Builder oder ein KI-Tool wie Fudge, das dir den Code anhand einer Beschreibung schreibt.
Wie ändere ich die Farbe oder das Design eines Shopify-Buttons?
Die meisten Themes legen die Button-Farben global unter Theme-Editor → Theme-Einstellungen → Farben oder Buttons fest. Um das Aussehen eines einzelnen Buttons zu ändern, ohne die restlichen zu beeinflussen, brauchst du einen Block für benutzerdefiniertes Liquid mit Inline-CSS oder eine Anpassung des Theme-Codes. Siehe unsere Anleitung zu Wie man Farben und Schriftarten in Shopify aktualisiert für den genauen Ablauf.
Was ist der "Auf Shop folgen"-Button von Shopify?
Das ist ein spezieller Button in der Fußzeile (Footer) deines Stores, mit dem Besucher deiner Marke in der Shop-App von Shopify folgen können. Öffne im Theme-Editor den Footer-Abschnitt und aktiviere Auf Shop folgen (Follow on Shop). Voraussetzung ist, dass Shop Pay aktiviert ist. Das hat nichts mit den normalen Buttons aus dem Theme-Editor oder dem Buy Button zu tun.
