Klicke im Shopify App Store auf „Installieren“. Die App ändert nichts am Code deines Themes: Sie erscheint erst in deinem Shop, wenn du ihren Block im Theme-Editor einfügst. Möchtest du sie vorher ausprobieren, füge den Block in einer Kopie deines Themes ein und sieh ihn dir in der Vorschau an.
Im nächsten Schritt wird dir angezeigt, welche Berechtigungen die App benötigt. Stimme den angeforderten Berechtigungen zu und klicke auf „Installieren“, um mit der Installation der App fortzufahren.
Nach Abschluss der Installation wirst du auf die Startseite der App geleitet. Ebenso wird dir die App im linken Seitenmenü angezeigt. Durch Klick auf das Stecknadel-Symbol rechts neben dem Titel kannst du die App an die Navigation anpinnen.
Im Folgenden erklären wir dir, wie du die App nach der Installation einrichten kannst.
Klicke in der linken Seitenleiste deines Shop-Admins unter "Product finder" auf "Pläne". Auf unserer Plan-Übersicht siehst du die verfügbaren Pläne mit ihren Preisen und Funktionen. Wähle zwischen dem Free Plan, der ideal ist, um die App kennenzulernen, und den kostenpflichtigen Plänen Pro und Pro Extended. Der Pro Plan bietet erweiterte Funktionen wie mehrere Produktberater, Vorlagen, mehr Fragen und Produkte, alle Stile und Farbpaletten, die Farben deines Shops, Produktkarten mit Übereinstimmung und Warenkorb-Button, eigene Bilder bei den Antworten und Übersetzungen. Der Pro Extended Plan bringt dazu den Pfad-Editor, mehr Produktberater, mehr Fragen und mehr Sprachen. Um zu wechseln, klicke auf den Button in der Box des gewünschten Plans. Du wirst zu Shopify weitergeleitet, wo du den Plan bestätigst. Beide kostenpflichtigen Pläne können 7 Tage kostenlos getestet werden und werden direkt über Shopify abgerechnet.
Klicke in der linken Seitenleiste deines Shop-Admins auf "Product finder", um die Übersicht deiner Produktberater zu öffnen. Mit dem Pro Plan startest du unter "Vorlagen" mit einer Vorlage: Fragen, Antworten, Icons und ein passendes Design sind fertig, du verknüpfst nur noch deine Produkte und passt die Texte an. Klick dich durch die Vorschau einer Vorlage, um ihre Fragen auszuprobieren, und klicke dann auf "Vorlage verwenden". Im Free Plan, oder wenn du lieber eigene Fragen stellst, klicke auf "Produktberater anlegen" oder die Kachel "Neuer Produktberater" und beginne von vorn.
Der neue Produktberater öffnet sich im Editor. In deinem Shop ist er erst sichtbar, wenn du den Block in dein Theme eingefügt hast (Schritte 5 und 6). Den internen Namen kannst du jederzeit unter "Weitere Aktionen" > "Umbenennen" ändern. Der Name ist nur für dich sichtbar, nicht für deine Kundinnen und Kunden.
Öffne im Editor den Bereich "Start" und schreibe Überschrift, Text und Button-Text des Startbildschirms, also das Erste, was deine Kundinnen und Kunden sehen. Öffne dann den Bereich "Fragen". Gib jeder Frage einen Text und füge ihre Antworten hinzu. Klicke bei jeder Antwort auf "Produkte verknüpfen" und wähle die Produkte aus deinem Shop, die zu dieser Antwort passen. Eine Antwort ohne Produkte bedeutet "egal". Nach der letzten Frage sehen deine Kundinnen und Kunden zuerst die Produkte, die zu den meisten ihrer Antworten passen.
Unter "Weitere Einstellungen" einer Frage kannst du mehrere Antworten erlauben ("Mehrfachauswahl"), alle Produkte ausschließen, die nicht zur gewählten Antwort passen ("Muss passen", z. B. bei Größen), das Überspringen der Frage erlauben ("Überspringen erlauben") und die Frage nur nach bestimmten Antworten auf frühere Fragen stellen ("Nur anzeigen, wenn …"). Willst du auf einen Blick sehen, welche Produkte zu welchen Antworten passen, stelle "Antworten anzeigen als" auf "Tabelle: Produkte × Antworten".
Eine Liste über den Fragen zeigt, was noch zu prüfen ist, z. B. Fragen ohne Text, Antworten ohne Produkte oder Fragen, zu denen keine Antwort führt.
Lege im Bereich "Ergebnisse" die Überschrift und den Text über den Empfehlungen fest und wie viele Produkte erscheinen. Unter "Auf jeder Produktkarte" wählst du, was die Karten zeigen: den Preis, die Antworten, zu denen ein Produkt passt ("Passt zu"), und mit dem Pro Plan die Übereinstimmung, die erfüllten Wünsche, einen Warenkorb-Button und einen Vergleich von bis zu 3 Produkten.
Im Bereich "Design" wählst du die Darstellung, einen gezeichneten Stil und eine Farbpalette oder die Farben deines Shops (Pro Plan). Die Antworten zeigen dann Icons in diesem Stil, eigene Bilder brauchst du dafür nicht. Außerdem legst du fest, wie der Startbildschirm aussieht: mit Illustration, Bild rechts, (Pro Plan) Bild als Hintergrund oder nur Text.
Die Live-Vorschau neben dem Editor zeigt deinen Produktberater genau so, wie ihn deine Kundinnen und Kunden sehen, am Desktop und am Handy. Klick dich durch, um jede Antwort auszuprobieren. Klicke auf "Speichern", damit die Änderungen in deinem Shop erscheinen.
Klicke in der linken Seitenleiste deines Shop-Admins unter "Product finder" auf "Hilfe" und anschließend auf "Theme-Editor öffnen". Der Theme-Editor öffnet sich mit dem Produktberater-Block, der bereits auf deiner Startseite eingefügt ist. Verschiebe ihn an die gewünschte Stelle und speichere.
Alternativ kannst du den Block manuell hinzufügen: Klicke in deinem Shop-Admin in der linken Seitenleiste auf "Onlineshop", wähle dein gewünschtes Theme aus und klicke daneben auf "Anpassen". Wähle in der oberen Leiste über das Dropdown-Menü die Vorlage aus, auf der der Produktberater erscheinen soll (z. B. Startseite, Seite, Produkt oder Kollektion). Klicke in der linken Seitenleiste auf "Abschnitt hinzufügen" und wähle im Reiter "Apps" den Block "Produktberater" aus.
Bitte beachte: App-Blöcke benötigen ein Online-Store-2.0-Theme (z. B. Dawn oder Horizon). Die Seite "Hilfe" prüft, ob dein Theme App-Blöcke unterstützt.
Klicke im Theme-Editor in der linken Seitenleiste auf den Produktberater-Block. Wähle unter "Produktberater" den Produktberater aus, den du in der App angelegt hast. Speichere deine Einstellungen mit dem Button "Speichern" oben rechts im Theme-Editor.
Die Seite "Hilfe" zeigt die Einrichtung mit deinem Fortschritt. Ist der Block in deinem Theme und ein Produktberater ausgewählt, sind alle Schritte erledigt. Auch der Editor zeigt oben, ob der Produktberater in deinem Shop live ist.
Da bestimmte Theme-, App- und Shop-Konfigurationen die Funktionalität beeinflussen können, empfehlen wir zu testen, ob der Produktberater in deinem Shop wie gewünscht angezeigt wird und funktioniert. Beantworte die Fragen in deinem Shop, prüfe die empfohlenen Produkte und lege, wenn du ihn eingeschaltet hast, ein Produkt über den Warenkorb-Button in den Warenkorb.
Tipp: Nutzt du Bedingungen, öffne im Bereich "Fragen" die Ansicht "Pfade". Sie zeigt, welche Fragen nach welchen Antworten erscheinen und zu welchen Produkten jeder Pfad führt.
Der Startbildschirm zeigt eine Überschrift, einen Text und einen Button, mit dem die Fragen beginnen. Im Bereich "Design" wählst du sein Aussehen: Illustration in den gesetzten Farben, Bild rechts, Bild als Hintergrund (Pro Plan) oder nur Text. Das Bild kommt aus den Dateien deines Shops, oder du lädst ein neues hoch.
Jede Frage hat einen Text, einen optionalen Hinweis und ihre Antworten. Jede Antwort hat einen Text, ein Icon oder (Pro Plan) ein eigenes Bild und die Produkte, zu denen sie passt. Der Free Plan erlaubt bis zu 4 Fragen und 15 Produkte pro Produktberater, der Pro Plan bis zu 10 Fragen und 100 Produkte, der Pro Extended Plan bis zu 15 Fragen und 100 Produkte. Mit "Nach oben" und "Nach unten" änderst du die Reihenfolge der Fragen.
Ein Produkt steht weiter oben, je mehr Fragen es mit den gewählten Antworten trifft. Antworten ohne Produkte bedeuten "egal" und zählen nicht, übersprungene Fragen ebenso wenig. Bei Gleichstand steht das Produkt vorn, das bei Mehrfachauswahl zu mehr gewählten Antworten passt, dann verfügbare Produkte, dann deine Reihenfolge. Ausverkaufte Produkte bleiben mit dem Hinweis "Ausverkauft" in den Ergebnissen, stehen aber nie an erster Stelle, solange ein anderes passendes Produkt verfügbar ist.
Kundinnen und Kunden können bei dieser Frage mehrere Antworten wählen.
Normalerweise rutschen Produkte, die nicht zur Antwort passen, nur nach unten. Mit "Muss passen" fallen sie ganz raus, z. B. bei Größen. Bei mehreren solchen Fragen warnt der Editor unter "Punkte zu prüfen", wenn eine Kombination von Antworten kein Produkt mehr hat.
Kundinnen und Kunden sehen einen Button "Überspringen". Eine übersprungene Frage zählt nicht für die Empfehlung, und die Ergebnisse weisen darauf hin, dass Fragen übersprungen wurden. Für "Egal" legst du stattdessen eine Antwort ohne Produkte an.
Stelle eine Frage nur nach bestimmten Antworten auf frühere Fragen. Alle anderen überspringen sie. Stelle im Bereich "Fragen" die Ansicht von "Liste" auf "Pfade", um jeden Pfad durch deinen Produktberater zu sehen, vom Start bis zum Ergebnis, mit der Zahl der Produkte auf jedem Pfad.
Statt mit Bedingungen zeichnest du, wohin jede Antwort führt: Klicke in der Ansicht "Pfade" auf "Pfade bearbeiten" und zieh eine Linie von einer Antwort zu der Frage, zu der sie führen soll, oder zum Ergebnis. Antworten ohne eigene Linie führen zur nächsten Frage der Liste. Schleifen lassen sich nicht speichern. In den kleineren Plänen ist der Pfad-Editor gesperrt. Wechselst du von Pro Extended zurück, bleiben deine Pfade gespeichert, und dein Shop folgt bis zum nächsten Upgrade der Liste mit ihren Bedingungen.
Unter "Antworten anzeigen als" kannst du die Antworten einer Frage als Tabelle anzeigen. Hake an, zu welchen Antworten ein Produkt passt. Neue Produkte verknüpfst du in der Liste mit "Produkte verknüpfen".
Über den Fragen zeigt der Editor, was eventuell nicht wie gedacht funktioniert: Fragen ohne Text, Antworten ohne Text, Fragen ohne Produkte, Fragen, zu denen keine Antwort führt, Pfade ohne Produkte und verknüpfte Produkte, die nicht in deinem Shop erscheinen (gelöscht, Entwurf oder archiviert).
Lege die Überschrift und den Text über den Empfehlungen fest und die Anzahl der gezeigten Produkte (bis zu 12). Passen mehr Produkte, nennen die Ergebnisse, wie viele der passenden Produkte gezeigt werden.
Jede Produktkarte zeigt Bild, Titel und Preis, mit dem Preis-Hinweis aus dem Theme-Block, und auf Wunsch die Antworten, zu denen ein Produkt passt ("Passt zu"). Mit dem Pro Plan zeigst du außerdem die Übereinstimmung (z. B. "92 % passend", sobald mindestens 2 Antworten mit Produkten zählen), die erfüllten Wünsche und was fehlt, einen Warenkorb-Button (oder einen Link zur Produktseite) und einen Vergleich von bis zu 3 Produkten nebeneinander. Titel, Preis, Bild und Verfügbarkeit kommen direkt aus deinen Produkten in Shopify.
Wähle, wie die Fragen erscheinen: "Kacheln" (auch im Free Plan), "Liste" oder "Live-Ergebnisse" (Pro Plan), bei denen die passenden Produkte schon während der Antworten neben den Fragen erscheinen.
Gezeichnete Stile passen Antworten, Startbildschirm und Fortschritt an deinen Shop an, ganz ohne Bilder. Der Free Plan enthält Stil 1 und 5 Farbpaletten, der Pro Plan alle Stile und Paletten sowie die Farben deines Shops: eine Hauptfarbe und eine Akzentfarbe, z. B. deine Button-Farbe. Sehr helle Farben werden abgedunkelt, damit Texte lesbar bleiben. Außerdem kannst du abgerundete Ecken und einen transparenten Hintergrund einschalten.
Zeige statt eines Icons ein eigenes Bild bei einer Antwort, aus den Dateien deines Shops oder neu hochgeladen.
Übersetze die Texte eines Produktberaters in die weiteren Sprachen deines Shops: mit dem Pro Plan bis zu 5 Sprachen pro Produktberater, mit dem Pro Extended Plan bis zu 20, deine Hauptsprache mitgezählt. Kundinnen und Kunden sehen die Sprache, in der sie deinen Shop aufrufen; Texte, die du leer lässt, erscheinen in deiner Hauptsprache. Buttons und andere feste Texte gibt es in 14 Sprachen. Weitere Sprachen fügst du zuerst in Shopify unter "Einstellungen" > "Sprachen" hinzu.
Fertige Produktberater, z. B. für Geschenke, Matratzen, Hundefutter, Kaffee, Hautpflege oder Fahrräder, mit Fragen, Antworten, Icons und passendem Design. Du verknüpfst deine Produkte und passt die Texte an. Im Free Plan kannst du dich durch jede Vorlage in der Vorschau klicken.
Die Vorschau im Editor zeigt den Produktberater genau so, wie ihn dein Shop zeigt, am Desktop oder am Handy. Mit den Pfeilen gehst du durch Startbildschirm, Fragen und Ergebnis. Ohne verknüpfte Produkte zeigt sie Beispielprodukte.
Im Editor unter "Weitere Aktionen" kannst du einen Produktberater umbenennen und ihn mit dem Pro Plan duplizieren, z. B. um eine Variante für eine andere Kategorie anzulegen. Beim Löschen wird der Produktberater endgültig gelöscht und aus deinem Shop entfernt. Das lässt sich nicht rückgängig machen.
Im Theme-Editor legst du in den Einstellungen des Blocks die maximale Breite des Produktberaters und den Abstand oben und unten fest. Unter "Preise" kannst du den Hinweis unter Preisen ein- oder ausschalten und einen eigenen Text eingeben. Lass das Feld leer für den Standardtext in der Sprache des Shops (z. B. "inkl. MwSt., zzgl. Versandkosten").
Nur nötig, wenn der Produktberater nicht in der Liste des Blocks erscheint, z. B. nach einer Neuinstallation der App. Öffne den Produktberater in der App, wähle oben "Weitere Aktionen" > "Handle kopieren" und füge das Handle im Block in das Feld "Handle des Beraters" ein. Ein dort eingetragenes Handle hat Vorrang vor der Auswahl.