Theme-Code bearbeiten

Sie können Ihren Theme-Code bearbeiten, um detaillierte Änderungen an Ihrem Onlineshop vorzunehmen. Die meisten Dateien, aus denen sich ein Theme zusammensetzt, enthalten Liquid, die Vorlagensprache von Shopify. Theme-Dateien enthalten auch HTML, CSS und JavaScript. Bearbeiten Sie den Code für ein Theme nur, wenn Sie sich mit HTML und CSS auskennen und über ein grundlegendes Verständnis von Liquid verfügen.

Bevor Sie Ihr Theme anpassen

Bevor Sie Ihr Theme anpassen, sollten Sie die folgenden Aufgaben ausführen:

  • Duplizieren Sie Ihr Theme zum Erstellen einer Sicherungskopie. Dies macht es einfach, Ihre Änderungen zu verwerfen und bei Bedarf erneut zu starten.
  • Überprüfen Sie vorab, welches Support-Level zur Verfügung steht.
  • Erfahren Sie mehr über die Anforderungen und Best Practices für das Hochladen von Bildern.

Ihren Theme-Code bearbeiten

So bearbeiten Sie Ihren Theme-Code:

  1. Klicken Sie auf Aktionen > Code bearbeiten.

Der Code-Editor zeigt auf der linken Seite ein Verzeichnis der Theme-Dateien und auf der rechten Seite einen Bereich zum Anzeigen und Bearbeiten der Dateien an:

Die Code-Editor-Seite

Sie können den Code-Editor auf volle Bildschirmgröße erweitern, indem Sie auf das Erweiterungssymbol klicken.

Das Erweiterungssymbol

Sie können die Seite auf die normale Größe zurücksetzen, indem Sie auf das Verkleinerungssymbol klicken:

Das Verkleinerungssymbol

Wenn Sie auf eine Datei im Verzeichnis auf der linken Seite klicken, wird sie im Code-Editor geöffnet. Sie können mehrere Dateien gleichzeitig öffnen und bearbeiten. Alle Dateien, die Sie ändern, werden mit einem violetten Punkt neben dem Dateinamen gekennzeichnet:

Das Verzeichnis der Theme-Dateien mit einem violetten Punkt neben den geänderten Dateien

Damit können Sie besser verfolgen, wo Sie Änderungen vorgenommen haben.

Wenn Sie Änderungen an einer Datei rückgängig machen möchten, nachdem Sie auf Speichern geklickt haben, öffnen Sie die Datei und klicken Sie auf Ältere Versionen. In einem Dropdown-Menü werden Datum und Uhrzeit jedes von Ihnen durchgeführten Speichervorgangs angezeigt. Wählen Sie die Version aus, die Sie wiederherstellen möchten, und klicken Sie auf Speichern.

Das Dropdown-Menü

Während der Code-Editor auf Vollbild erweitert ist, können Sie das Editor-Farbschema zwischen Hell und Dunkel umschalten, indem Sie auf die Schaltflächen am unteren Rand der Seite klicken:

Der Code-Editor mit Farbschema

Informationen zu den Vorteilen der Verwendung des dunklen Editor-Farbschemas finden Sie unter The Power of the Dark Side: Dark User Interfaces (Die Macht der dunklen Seite: Dunkle Benutzeroberflächen) im Blog für Shopify-Partner.

Tutorials zur Anpassung von Theme-Code

Die Tutorials zur Anpassung von Theme-Code unterstützen Sie bei der Durchführung von Änderungen an Ihrem Onlineshop. Die Tutorials sind nach dem Typ der Seite oder Funktion organisiert, die sie ändern.

Hilfe bei Anpassungen erhalten

Wenn Sie Hilfe bei der Änderung Ihres Themes benötigen, können Sie den Entwickler Ihres Themes kontaktieren, um Unterstützung zu erhalten.

Informationen zu anderen Ressourcen, die Ihnen bei der Anpassung von Themes zur Verfügung stehen, finden Sie unter Zusätzliche Ressourcen für Support mit Themes.

Sind Sie bereit, mit Shopify zu verkaufen?

Probieren Sie es kostenlos aus