Dein Theme in drei Schritten installieren.

Du brauchst einen Shopify-Shop und ein Theme-ZIP von deiner Download-Seite.

  1. Ein Theme herunterladen

    Such dir auf deiner Download-Seite das Theme aus, das du willst, und lade sein ZIP herunter. Die Datei nicht entpacken.

  2. In Shopify hochladen

    Geh im Shopify-Admin auf Onlineshop → Themes → Theme hochladen und wähl das ZIP aus.

  3. Anpassen und veröffentlichen

    Öffne das Theme über Anpassen, füge deine Produkte, Texte und Bilder ein und veröffentliche es.

Nicht das Gesamtpaket hochladen

Die Datei mit allen Themes ist für dein Archiv. Shopify nimmt nur einzelne Theme-ZIPs an.

Auftritt und Scroll-Fahrt einrichten

In den fünf Flaggschiff-Themes (01 Sneaker, 02 Skincare, 03 Jewelry, 04 Drinks, 05 Tech) beginnt die Startseite mit zwei Abschnitten: Auftritt mit Film, dem Auftritt, und Fahrt beim Scrollen, der Scroll-Fahrt. In den anderen 15 Themes fügst du beide über Abschnitt hinzufügen ein. Beide arbeiten mit Bildern und Filmen, die du selbst einsetzt. Von den Medien der Vorführshops steckt nichts im ZIP.

Der Theme-Editor zeigt Abschnitte und Einstellungen auf Deutsch oder Englisch, je nach Sprache deines Shopify-Admins. Diese Seite nennt die deutschen Namen. Die englische Fassung dieser Seite nennt die englischen.

Was du ohne eigene Medien siehst

  • Direkt nach dem Hochladen ist kein Produkt gewählt. Beide Abschnitte zeigen eine Platzhalter-Zeichnung und Beispieltexte. Der Auftritt zeigt außerdem einen Beispielpreis, und sein Knopf führt zu allen Produkten.
  • Sobald du dein Produkt wählst, und zwar in beiden Abschnitten (Einstellung Produkt), zeigen sie sein Hauptbild. Der Auftritt ergänzt Preis, Varianten-Kurzwahl und Kaufknopf. In der Scroll-Fahrt wandert das Bild von Station zu Station.
  • Ein PNG oder WebP mit durchsichtigem Hintergrund steht frei. Ein JPEG-Foto erscheint als Karte mit runden Ecken und bleibt ganz im Bild. Ohne Film läuft im Auftritt nichts ab. Die Seite ist so vollständig: Film, Freisteller und Drehbilder sind Zugaben.
  • Wer weniger Bewegung eingestellt hat, bekommt eine ruhige Fassung: das Standbild mit dem Text, danach das Produkt neben den Stationen. Das Standbild bleibt auch stehen, wenn ein Browser den Film nicht von selbst starten lässt.

Der Auftritt, Schritt für Schritt

Klick auf Anpassen, bleib auf der Startseite und öffne den Abschnitt Auftritt mit Film.

  1. Produkt

    Wähl unter Produkt dein Produkt. Es liefert Preis, Varianten und Kaufknopf. Sein Titel wird nicht gezeigt: Kleine Überschrift darüber, Überschrift, Text und Hinweis unter dem Knopf schreibst du selbst. Am Handy entfallen der Text und der Hinweis, damit das Bild den Platz hat.

  2. Film (optional)

    Lade deinen Produktfilm unter Film hoch. Setz unter Standbild das letzte Bild des Films ein: Es ist das erste Bild der Seite, zu sehen, während der Film lädt, und bei Besuchern, die weniger Bewegung eingestellt haben. Ohne Standbild wird das Vorschaubild des Videos genommen.

  3. Hintergrund

    Stell Hintergrundfarbe genau auf den Farbton des Grunds in deinem Film ein. Erhöhe dann Weiche Ränder des Films, bis kein Rand mehr zu sehen ist.

  4. Zeitpunkte

    Alle Sekunden zählen ab dem Start des Films. Aufprall bei Sekunde und Stoß geben der Bühne einen kurzen Stoß. Text erscheint bei Sekunde blendet Überschrift, Preis und Knopf ein. Anhalten bei Sekunde hält den Film auf seinem Höhepunkt an, so lange, wie unter Anhalten für steht; währenddessen liegt das Bild aus Scharfes Bild vom Höhepunkt darüber. Das Bild aus Ruhebild nach dem Film blendet am Ende ein, und ein Knopf zum Wiederholen erscheint (Knopf „Noch einmal abspielen“ zeigen).

  5. Großes Wort (optional)

    Tipp ein kurzes Wort in Wort ein, unter Großes Wort hinter dem Produkt. Es braucht etwas, das davor steht: mit Film das Bild aus Freisteller des Produkts, ohne Film ein freigestelltes Bild unter Standbild. Fehlt beides, bleibt das Wort weg.

  6. Layout

    Wähl unter Anordnung zwischen Film füllt die Bühne und Film als Fläche neben dem Text; beim zweiten legt Seite des Texts die Seite fest. Wähl unter Ausschnitt des Films zwischen Fläche füllen (schneidet den Film zu) und Ganzen Film zeigen.

  7. Handy (optional)

    Ein Film im Hochformat kommt unter Film am Handy, sein Standbild unter Bild am Handy. Ohne beides zeigen kleine Bildschirme die Mitte des breiten Films. Mit einem eigenen Handy-Film entfallen dort Höhepunkt, Ruhebild und Freisteller.

Kein Film? Setz ein Bild unter Standbild ein: Ein freigestelltes PNG oder WebP steht vor dem großen Wort, ein JPEG füllt die Fläche.

Wenn der Auftritt falsch aussieht

Um den Film ist ein Kasten zu sehen.

Der Grund des Films und Hintergrundfarbe weichen voneinander ab. Gleich sie an und erhöhe dann Weiche Ränder des Films.

Das große Wort fehlt.

Es steht nichts davor: Füge das Bild unter Freisteller des Produkts ein oder, ohne Film, ein freigestelltes Bild unter Standbild.

Das scharfe Bild oder das Ruhebild springt beim Erscheinen.

Es hat nicht die Größe und den Bildausschnitt des Films.

Die Scroll-Fahrt, Schritt für Schritt

Öffne den Abschnitt Fahrt beim Scrollen. Im Shop ist er zu sehen, sobald er eine Station hat.

  1. Produkt

    Wähl unter Produkt dein Produkt oder lade unter Produktbild ein Bild hoch: Es ersetzt das Hauptbild. Knöpfe in den Stationen führen zum Produkt. Ein PNG oder WebP gilt als Freisteller und schwebt frei. Nimm diese Formate deshalb nur mit durchsichtigem Hintergrund: Ohne ihn schwebt ein nacktes Rechteck. Ein Foto mit eigenem Hintergrund kommt als JPEG hinein und wird zur Karte.

  2. Stationen

    Blöcke Station, bis zu 6. Jede hat Kleine Überschrift darüber, Überschrift, Text und auf Wunsch Button-Text. Unter Produkt an dieser Station stellst du Lage des Produkts, Größe des Produkts und Neigung ein; der Text steht auf der anderen Seite. Großes Wort im Hintergrund setzt ein kurzes Wort hinter das Produkt.

  3. Beschriftungen

    Tipp unter Beschriftungen mit Strich bis zu zwei kurze Beschriftungen je Station ein. Von jeder läuft ein Strich zu einem Punkt auf dem Produkt: Du setzt ihn mit Beschriftung 1: Punkt von links und Beschriftung 1: Punkt von oben, in Prozent des Produktbilds. Die Striche gibt es auf breiten Bildschirmen.

  4. Begleiter

    Blöcke Begleiter, bis zu 8, optional. Kleine freigestellte Bilder von dem, was zu deinem Produkt gehört, zum Beispiel eine Frucht, ein Tropfen oder ein Blatt. Stell Tiefe, Bahn (Zieht mit, Kreist um das Produkt, Fliegt weg), Startplatz und Größe ein. Ein Block ohne Bild zeigt nichts. Schmale Bildschirme zeigen die ersten vier.

  5. Drehung

    Blöcke Drehbild, bis zu 36, optional. Füge die Ansichten des Produkts der Reihe nach ein, ein Block je Bild. Lass Die Drehbilder sind eine volle Drehung für eine Drehung eingeschaltet; schalte es aus für eine Bewegung mit Anfang und Ende, zum Beispiel einen Deckel, der aufgeht. In jeder Station legt Ansicht fest, welche Ansicht das Produkt dort zeigt: 0 % ist das Produktbild, 50 % die Mitte der Bildfolge. Ohne Drehbilder neigt sich das Bild und schwingt auf seinem Weg leicht.

  6. Bewegung

    Mit Scroll-Länge je Station legst du fest, wie weit Besucher von einer Station zur nächsten scrollen. Produkt und Begleiter folgen leicht der Maus und Schatten unter dem Produkt lassen sich ausschalten.

Diese Medien bereitest du vor

Was Einstellung Empfohlen
Produktfilm Auftritt mit Film: Film Querformat 16:9, 1920 × 1080, MP4, 4 bis 6 Sekunden. Ton ist nicht nötig: Der Film läuft einmal, stumm. Produkt in der Mitte mit Platz rundherum, vor einem ruhigen, einfarbigen Grund in genau der Hintergrundfarbe des Abschnitts. Er endet in der Lage, in der das Produkt stehen bleibt.
Standbild und Ruhebild Standbild, Ruhebild nach dem Film Das letzte Bild des Films als Bild in voller Qualität: gleiche Größe und gleicher Ausschnitt wie der Film, 1920 × 1080 oder größer.
Höhepunkt Scharfes Bild vom Höhepunkt Das Bild des Moments, in dem der Film anhält, in voller Qualität. Gleiche Größe und gleicher Ausschnitt wie der Film.
Freisteller für das Wort Freisteller des Produkts Das letzte Bild ohne Hintergrund: PNG oder WebP mit Transparenz, gleiche Größe und gleicher Ausschnitt wie der Film.
Film fürs Handy Film am Handy, Bild am Handy Optional. Hochformat 9:16, 1080 × 1920, gleicher Grund und gleiche Länge; sein letztes Bild als Standbild.
Produktbild Fahrt beim Scrollen: Produktbild PNG oder WebP mit durchsichtigem Hintergrund, eng auf das Produkt beschnitten, etwa 2000 px an der langen Seite.
Drehbilder Blöcke Drehbild 12 bis 36 Bilder einer Drehung, der Reihe nach. Gleiche Größe, gleicher Ausschnitt und derselbe durchsichtige Hintergrund wie das Produktbild.
Begleiter Blöcke Begleiter Kleine Freisteller, ein Teil je Bild: PNG oder WebP mit durchsichtigem Hintergrund, etwa 800 px an der langen Seite.

Kommst du nicht weiter? Die Hilfe beantwortet häufige Fragen.