Die bluebarry-Shopify-App verbindet deinen Shop mit bluebarry. Sie lädt alles, was du mit bluebarry betreibst, in deiner Storefront (Quizze, Onsite-Suche, Produkt-Chat und Popups), hält deine Produkte synchron und erfasst, welche Bestellungen über bluebarry kamen. Diese Anleitung führt dich von der Installation bis zum fertigen Shop.
Was die App macht
- Lädt bluebarry in deinem Shop. Eine App-Einbettung, Bluebarry Core Script, bringt deine veröffentlichten Quizze, aktiven Popups, den Produkt-Chat und die Suche auf jede Seite. Du musst keinen Code einfügen.
- Synchronisiert deine Produkte. Produkte, Varianten, Lagerbestand und die Felder deiner Wahl bleiben in bluebarry aktuell.
- Erfasst Conversions. Ein Shopify-Pixel meldet abgeschlossene Checkouts. So siehst du den Umsatz von Kundinnen und Kunden, die bluebarry genutzt haben.
- Schaltet die Suche ein. Du wählst, welche Suchkonfiguration das Suchfeld deines Shops antreibt.
App installieren
- Öffne die bluebarry-App im Shopify App Store und klick auf Install. Bestätige die Berechtigungen, nach denen Shopify fragt.
- Die App fragt, ob du bluebarry schon nutzt. Klick auf I'm new to Bluebarry (ich bin neu) oder I already have an account (ich habe schon ein Konto) und folge dem passenden Abschnitt unten.
Wenn du neu bei bluebarry bist
Neue Shops bekommen einen kurzen Einrichtungsassistenten. Am Ende ist ein Quiz in deinem Shop live.
- Wähl auf Pick a plan to try einen Plan und bestätige die Abrechnung in Shopify. Dein erstes Abo startet mit 14 Tagen kostenloser Testphase. Die Pläne findest du unter Shopify-Abrechnung verwalten.
- Trag auf Create your Bluebarry account Vorname, E-Mail-Adresse und Passwort ein und klick auf Create account and connect store. Mit diesen Daten meldest du dich unter app.bluebarry.ai bei bluebarry an.
- Klick auf dem Willkommensbildschirm auf Create quiz.
- Wähl auf Select fields to sync, welche Produktdaten bluebarry bekommen soll, und klick auf Continue to Bluebarry. Die App importiert deinen Katalog. Das dauert meist weniger als eine Minute.
- Klick auf Create quiz in Bluebarry. bluebarry öffnet sich in einem neuen Tab, dort erstellst du dein erstes Quiz. Lass den Shopify-Tab offen: Die App geht von selbst weiter, sobald dein Quiz existiert.
- Klick unter Step 1: Enable 'Bluebarry Core Script' auf Activate app embed. Der Theme-Editor von Shopify öffnet sich mit der richtigen Einbettung. Schalte sie ein und klick auf Save.
- Kopier unter Step 2: Add your quiz trigger den Quiz trigger link. Er sieht aus wie
#bluebarry:gefolgt von deiner Quiz-ID. Verwende ihn als Link auf jedem Button, Banner oder Menüpunkt, der das Quiz öffnen soll. Klick dann auf Done.
Wenn du schon ein Konto hast
- Klick auf I already have an account.
- Geh in bluebarry zu Integrations und kopier deine Tenant ID oben auf der Seite. Füg sie in der Shopify-App unter Step 1: Add your tenant ID ein.
- Öffne auf Integrations den Developer area, klick bei API keys auf Manage und erstelle einen Schlüssel für Shopify.
- Setz unter Step 2: Sync your products to bluebarry den Haken bei Enable product sync, füg den Schlüssel bei Bluebarry API key ein und wähl deine Felder.
- Klick auf Save und dann auf Sync all products now.
- Schalte die App-Einbettung ein, wie unten beschrieben.
App-Einbettung einschalten
Ohne App-Einbettung erscheint nichts von bluebarry in deinem Shop, auch wenn alles andere eingerichtet ist. Der Assistent führt dich direkt dorthin. So prüfst du es später:
- Geh in Shopify zu Online Store → Themes.
- Klick bei deinem aktiven Theme auf Customize.
- Öffne in der linken Leiste App embeds.
- Schalte Bluebarry Core Script ein. Darunter steht der App-Name Bluebarry Product Quiz.
- Klick auf Save.
Mehr braucht dein Shop nicht. Aktive Popups, der Produkt-Chat und eine eingeschaltete Suchkonfiguration laden automatisch darüber. Ist die Einbettung einmal ausgeschaltet, zeigt die App eine Warnung mit dem Button Activate app embed.
Theme-Blöcke der App
Neben dem Core Script bringt die App einige optionale Blöcke in deinen Theme-Editor. Füg sie dort ein, wo du einen Button oder eine Platzierung auf der Seite möchtest.
| Block | Wo | Wofür |
|---|---|---|
| Bluebarry Core Script | App-Einbettung, jede Seite | Pflicht. Lädt bluebarry in deinem Shop: Quizze, Suche, Produkt-Chat und Popups. Auch nötig für Quiz-Banner, die personalisierte Produktreihenfolge und Quiz-Treffer auf Kollektionsseiten. |
| Bluebarry Quiz Button | Abschnittsblock, jede Vorlage | Ein Button, der ein bestimmtes Quiz öffnet. Du fügst die Quiz-ID in den Block ein. |
| Quiz Button | Kollektionsvorlage | Erscheint nur bei den Kollektionen, die du im Launch-Tab des Quiz einschaltest. |
| Product Check Button | Produktvorlage | Erscheint nur bei den Produkten oder Kollektionen, die du für den Produktcheck einschaltest. |
| Bluebarry Popup Trigger | App-Einbettung oder Abschnittsblock | Öffnet ein Quiz als Popup nach einer Wartezeit, nach dem Scrollen oder bei Exit-Intent. Popups aus der Popups-App brauchen keinen Block. |
| Bluebarry Shopping Help | Produkt- und Kollektionsvorlagen | Legt fest, wo der Produkt-Chat erscheint, wenn er als Inline shopping help oder Embedded angezeigt wird. |
| bluebarry recs | Abschnittsblock, jede Vorlage | Zeigt einen Empfehlungsblock. Füge die Block ID aus dem Schritt Embed des Blocks ein. |
Suche in der App einschalten
Nach der Einrichtung zeigt die Startseite der App eine Karte On-site search. Wähl in der Liste Search profile eine Suchkonfiguration für das Suchfeld deines Shops, oder wähl Disabled, um sie auszuschalten. Änderungen gelten sofort. Das geht auch direkt in bluebarry, siehe Suche in deinem Shop starten.
Gut zu wissen
- Nach der Einrichtung heißt die Startseite der App Configure your Bluebarry integration. Dort findest du Kontodaten, Produktsynchronisierung und Onsite-Suche an einem Ort.
- Erscheint etwas nicht in deinem Shop, fang hier an: Shopify-App-Einbettung wird nicht angezeigt.