Hur man lägger till en Mindbody-bokningswidget i din Shopify-butik

En kund hittar din studio online, hamnar i din Shopify-butik och köper ett paket med 10 klasser. Toppen. Vad händer nu? I många fall är det där upplevelsen stannar av. Kunden har betalat, men de har inget uppenbart sätt att faktiskt boka en klass, och några minuter senare får de ett förvirrande lösenordsmejl från ett företag som heter "Mindbody" som de aldrig hört talas om.

Den här guiden åtgärdar båda problemen. Först går vi igenom hur man lägger till en Mindbody-bokningswidget direkt i din Shopify-butik så att kunder kan boka med några få klick. Sedan går vi igenom hur man säljer på Shopify även om man inte kan använda Mindbodys betalningshantering, och hur ShopConnect i tysthet sammanfogar de två systemen bakom kulisserna.

Du behöver inte vara utvecklare. Om du kan redigera en sida i Shopify kan du göra allt detta.

---

Del 1: Lägg till en Mindbody-bokningswidget i din Shopify-butik

Målet här är enkelt: en "Boka nu"-sida i din Shopify-butik som visar ditt Mindbody-schema i realtid, så att kunder kan boka utan att någonsin lämna din webbplats.

Vad du behöver först

• Din sinneskropp Varumärkeswebb widgetkodavsnitt (du får detta från ditt Mindbody-konto)
• Ett Shopify-abonnemang med en webbutik (Basic, Grow, Advanced eller Plus)
• Administratörsåtkomst till din Shopify-butik
• Ett tema för webbutik 2.0 (som Dawn)

Om du har allt det där är du redo.

Steg 1: Skapa sidan

I din Shopify-administratör, gå till Webbutik → Sidor → Lägg till sida.

Ge den en titel som ”Boka nu”. Den titeln skapar också sidans webbadress. Du kan lägga till en kort introduktion i rutan Innehåll om du vill och sedan klicka på Spara.

Steg 2: Skapa en anpassad mall

Medan du fortfarande redigerar sidan, titta på höger sida för Mall rullgardinsmeny. Klicka på den och välj Skapa mall.

Namnge mallen efter din sida (till exempel ”boka nu”) och använd Standardsida som bas. Klicka Spara.

Detta ger din bokningssida en egen mall så att du kan lägga till widgeten utan att påverka resten av din butik.

Steg 3: Lägg till widgetkoden med ett anpassat Liquid-avsnitt

Gå nu till Webbutik → Teman och klicka Anpassa på ditt livetema.

Använd rullgardinsmenyn överst för att välja den nya sidan och mallen du just skapat. Klicka på i den vänstra panelen Lägg till sektion → Anpassad vätska.

Klistra in din Mindbody-bokningswidgetkod i rutan. Det ser ut så här:

<div class="mindbody-widget" data-widget-type="Schedules" data-widget-id="XXXXXXXXXXX"></div>
<script async src="https://brandedweb.mindbodyonline.com/embed/widget.js"></script>

Byt ut XXXXXXXXXXX med ditt eget widget-ID från Mindbody. Klicka Spara, och förhandsgranskningen av bokningswidgeten visas direkt.

Steg 4: Gör sidan synlig

Gå tillbaka till Webbutik → Sidor och öppna din sida.

Uppsättning Synlighet → Synligoch klicka sedan på SparaBesök sidans webbadress för att bekräfta att widgeten laddas och att ditt schema visas.

Steg 5: Lägg till sidan i din butiksmeny

Sista steget: gör sidan lätt att hitta. Gå till Webbutik → Navigering och öppna din Huvudmeny.

Klick Lägg till menyalternativ, döp den till ”Boka nu” och länka den till sidan du skapade. Klicka på Tillägga, sedan Spara.

Det var allt. Kunder kan nu boka direkt från din butik.

Valfritt: lägg till en registreringssida också

Om du även vill ha en registreringssida, upprepa steg 1 till 4 med den här registreringswidgetkoden istället:

<script src="https://widgets.mindbodyonline.com/javascripts/healcode.js" type="text/javascript"></script>
<healcode-widget data-type="registrations" data-widget-partner="object" data-widget-id="XXXXXXXXXXX" data-widget-version="0"></healcode-widget>

Länka sedan de två sidorna så att kunderna enkelt kan växla mellan bokning och registrering.

---

Del 2: Sälja på Shopify utan Mindbody-betalningshantering

I vissa regioner är Mindbodys betalningshantering för handlare inte tillgänglig, vilket innebär att du inte kan ta emot betalning direkt via Mindbody. Den goda nyheten: du kan fortfarande sälja tjänster, paket och medlemskap på Shopify och få allt att landa korrekt i Mindbody. Flödet ändras bara något till "köp först, boka sedan".

Hur flödet fungerar

1. En kund köper en tjänst, ett paket eller ett medlemskap i din Shopify-butik.
2. ShopConnect skapar eller matchar deras Mindbody-klientpost och loggar köpet, så att deras kredit redan finns registrerad i Mindbody.
3. Kunden loggar sedan in i Mindbody för att boka sin faktiska tid eller klass.

ShopConnect är det som förenar de två systemen. Kunden betalar i Shopify, och ShopConnect ser till att köpet visas hos rätt kund i Mindbody utan att du behöver skriva in något på nytt.

Den enda ojämna kanten, och hur man jämnar ut den

Det finns ett ögonblick som förvirrar kunderna om du inte förbereder dig på det. Efter att de har betalat i din Shopify-butik skickar Mindbody ett lösenordsmejl till dem. För en kund som aldrig har hört talas om "Mindbody" kan det mejlet se ut som skräppost, och de kanske ignorerar det. Sedan undrar de var deras klass är.

Lösningen är kommunikation. Läkarna rekommenderar en enda huvudmeddelande du återanvänder i de e-postmeddelanden som kunderna får efter köp:

"Tack för att du gjorde detta köp från vår webbutik! Håll utkik efter ditt lösenord via e-postadressen från vår onlinebokningsprogramvara." Mindbody OnlineNär du har angett ditt lösenord klickar du på här för att boka din tid eller kurs.”

Ordet ”här” länkar till din bokningssida (samma Shopify ”Boka nu”-sida som du skapade i del 1, eller en motsvarande sida på en annan webbplats).

Var meddelandet ska placeras: tre e-postmeddelanden

Huvudmeddelandet anpassas över de tre e-postmeddelanden en kund får efter ett köp.

E-post 1: Shopify-orderbekräftelsen. I Shopify, gå till Inställningar → Meddelanden → OrderbekräftelseLägg till huvudmeddelandet högst upp i e-postmeddelandet, ovanför ordersammanfattningen. Detta skapar förväntningar i det ögonblick kunden checkar ut, medan de fortfarande är uppmärksamma.

E-post 2: Mindbody-e-postmeddelandet ”Glömt inloggningsuppgifter”. Detta är ett delat automatiskt e-postmeddelande, så du kan inte ersätta det helt. Lägg istället till ett villkorligt block efter det befintliga innehållet:

“Har du precis gjort ett köp i vår webbutik? När du har loggat in med informationen ovan klickar du på här för att boka den tid eller kurs du köpt, ditt köp finns redan registrerat.”

Du hittar detta i Mindbody Business automatiska e-postinställningar. Det ger kunden sin inloggning samtidigt som det kopplar tillbaka till det köp de just gjorde.

E-post 3: välkomstmejlet till Mindbody. Redigera affärslägesversionen, eftersom ShopConnect skapar kunder i affärsläge. Lägg till samma typ av block:

“Har du precis gjort ett köp i vår webbutik? Logga in på ditt konto och klicka sedan på här för att boka den tid eller kurs du köpt, ditt köp finns redan registrerat.”

Detta finns även i Mindbody Business automatiska e-postmeddelanden. Det förstärker bokningssteget under onboarding.

Vart länkarna "här" ska peka

Varje "här"-länk ska leda kunder till en sida med din inbäddade Mindbody Branded Web-bokningswidget. Du har två alternativ:

• En Shopify-sida (kräver Basic-planen eller högre, inte tillgängligt på Starter). Detta är exakt sidan "Boka nu" från del 1.
• En extern webbplats. Om din bokningssida finns på Squarespace, Wix, WordPress eller någon annan plattform, bädda in widgeten där och peka länkarna till den istället.

Hur som helst är det samma sida som visas i slutet av del 1: förklarande text uppe, bokningswidgeten nedan.

En miljö värd att känna till

ShopConnect inkluderar en Send_mbo_password_reset_email inställning som styr om ShopConnect automatiskt utlöser e-postmeddelandet för återställning av lösenord från Mindbody. Det är värt att veta att detta finns så att du kan anpassa dina e-postmeddelanden till vad som faktiskt skickas.

---

Varför detta är viktigt

En bokningswidget och tre redigerade e-postmeddelanden låter inte som mycket. Men tillsammans täcker de den vanligaste klyftan när man säljer fitness- och wellnesstjänster online: tiden mellan "Jag betalade" och "Jag är bokad". Det är i den klyftan kunderna blir förvirrade, ger upp eller mejlar dig och frågar vart deras pass tog vägen.

Att lägga bokningswidgeten direkt i din Shopify-butik eliminerar en överlämning. Att förbereda e-postmeddelandena efter köpet eliminerar överraskningarna. Och ShopConnect eliminerar det manuella arbetet mitt i processen, vilket matchar köpen med rätt Mindbody-klient så att du inte stämmer av två system manuellt.

Avhämtning

• Bokningswidgeten är en Shopify-uppgift i fem steg. Skapa en sida, ge den en mall, lägg till din Mindbody-widgetkod via Custom Liquid, gör den synlig och lägg till den i din meny.
• Du kan sälja på Shopify utan betalningshantering via Mindbody. Flödet blir ”köp först, boka sedan” och ShopConnect loggar varje köp automatiskt mot rätt Mindbody-klient.
• Kommunikation är hela spelet i det betalningsfria flödet. Ett huvudmeddelande, anpassat över tre e-postmeddelanden, förhindrar förvirringen "vad är det här för ett Mindbody-lösenordsmejl?".
• Dina "här"-länkar och din bokningswidget ska vara på samma sida. Bygg det en gång, länka till det överallt.

Kör du ShopConnect och vill ha hjälp med att få din Shopify-butik och Mindbody att kommunicera med varandra? Kontakta APIANT-teamet, vi hjälper dig gärna med det.