Widget, Warenkorbleiste und Abzeichen zu Ihrem Theme hinzufügen

Was die einzelnen Theme-Elemente sind, wo sie hingehören, wie Sie sie verschieben und was bei Themes ohne App-Blöcke zu tun ist.

6 Min. Lesezeit

MixMaxer liefert vier Theme-Elemente als Shopify-Theme-App-Erweiterung. Keines davon bearbeitet theme.liquid; beim Deinstallieren der App werden alle entfernt.

  • Produkt-Block („MixMaxer offer“): das Staffel-/Bundle-/Geschenk-Widget auf der Produktseite. Auch auf jeder anderen Seite nutzbar, wenn in den Block-Einstellungen ein Produkt gewählt wird (siehe „Hervorgehobenes Angebot auf der Startseite“).
  • Warenkorb-Upsell-Einbettung: der Fortschrittsbalken und die Ein-Klick-Buttons im Warenkorb-Drawer und auf der Warenkorbseite.
  • Abzeichen-Einbettung für Produktkarten: kleine Labels wie „2 kaufen, 10 % sparen“ auf Produktkarten in Kollektionen und in der Suche.
  • Mix-&-Match-Block: der Set-Builder für Kollektionsseiten (nur für Mix-&-Match-Angebote nötig).

Produkt-Block

  1. Einstellungen › Theme-Einrichtung › „Zum Theme hinzufügen“. Der Theme-Editor öffnet sich mit dem Produkt-Template und dem Block unter dem Preis.
  2. Optional: Ziehen Sie den Block an eine beliebige Stelle innerhalb des Abschnitts mit den Produktinformationen. Über dem Kaufen-Button konvertiert bei Mengenstaffeln am besten; unter dem Preis bei Bundles.
  3. Klicken Sie auf „Speichern“ (oben rechts).

Der Block hat eigene Einstellungen im Editor: Layout-Überschreibung, Größe, eine Produktauswahl (für Seiten, die keine Produktseiten sind), eine Überschrift für die hervorgehobene Karte, Abstände oben und unten sowie ein Feld für eigenes CSS.

Themes der Horizon-Familie (Ritual, Horizon, Vessel, Tinker und weitere Shopify-Themes ab 2025): Der Button fügt den Block am Ende des Produktabschnitts ein, sodass er zunächst in voller Breite unter dem Produkt erscheint. Ziehen Sie in der linken Seitenleiste des Editors „MixMaxer offer“ in die Gruppe „Produktdetails“ zwischen „Preis“ und „Kaufen-Buttons“ und speichern Sie. Dieser Schritt ist nur einmal nötig.

Warenkorbleiste und Abzeichen (App-Einbettungen)

  1. Öffnen Sie im Theme-Editor die App-Einbettungen (das Puzzle-Symbol unten in der linken Seitenleiste).
  2. Schalten Sie „MixMaxer cart upsell“ und „MixMaxer card badges“ ein.
  3. Wählen Sie die Position der Abzeichen (links oder rechts) und den Stil (gefüllt oder umrandet).
  4. Klicken Sie auf „Speichern“.

Unter Einstellungen › Theme-Einrichtung gibt es für jede Einbettung einen Button „Aktivieren“, der den Editor direkt beim richtigen Schalter öffnet.

Welches Theme erhält den Block?

Der Editor öffnet Ihr veröffentlichtes Theme. Wenn Sie an einem unveröffentlichten Theme arbeiten (zum Beispiel an einer Dawn-Kopie, während Ihr Live-Theme ein anderes ist), fügen Sie die Elemente auch dort hinzu: Theme-Einstellungen gelten pro Theme, nicht pro Shop. Einstellungen › Theme-Einrichtung prüft nur das veröffentlichte Theme.

Themes ohne App-Blöcke

Themes, die älter als Online Store 2.0 sind (kein JSON-Produkt-Template), können keine App-Blöcke aufnehmen. Einstellungen › Theme-Einrichtung zeigt dann „no JSON product template“. Schreiben Sie dem Support eine E-Mail mit Ihrer Shop-URL und dem Theme-Namen: Wir installieren das Widget kostenlos für Sie, in der Regel innerhalb eines Werktags.

Häufige Probleme

„There is a problem with the app block“ beim Öffnen des Links „Zum Theme hinzufügen“.

Der Theme-Editor wurde für ein Theme geöffnet, in dem die App noch nicht zugelassen ist, oder der Link ist nach einem App-Update veraltet. Öffnen Sie den Editor manuell: Onlineshop › Themes › Anpassen › Produkt-Template › Block hinzufügen › Apps › MixMaxer offer.

Der Block erscheint doppelt.

Er wurde einmal über die Einstellungen und einmal manuell hinzugefügt. Entfernen Sie einen davon im Editor; das Widget selbst wird ohnehin nur einmal pro Seite gerendert.

Die Einbettungen sind aktiv, aber die Einstellungen zeigen weiterhin „Nicht aktiviert“.

Klicken Sie auf „Erneut prüfen“. Bleibt es rot, wurden die Einbettungen in einem nicht veröffentlichten Theme aktiviert; prüfen Sie den Theme-Namen in der Kopfzeile des Editors.

Das Widget wird auf dem Desktop angezeigt, aber nicht auf dem Smartphone.

Manche Themes verwenden einen separaten Produktabschnitt für Mobilgeräte. Fügen Sie den Block auch dort hinzu (er erscheint im Editor, wenn Sie die mobile Vorschau wählen).

Das Widget erscheint in voller Breite unter dem Produktbild statt neben dem Preis.

Der Block liegt auf Abschnittsebene. Ziehen Sie ihn in der Seitenleiste des Editors in die Gruppe „Produktdetails“ (Themes der Horizon-Familie) oder in die Spalte mit den Produktinformationen (Themes der Dawn-Familie) und speichern Sie.

Mehr in Erste Schritte


← Alle Artikel · Weiter: Angebote in einem Entwicklungsshop von Anfang bis Ende testen · Kommen Sie nicht weiter? Support kontaktieren