JavaScript-API

Allt mp.js erbjuder din egen kod: samtycke, ditt kund-ID, anpassade händelser, steg utan adressändring, hookar och HTML-attribut. Inget här krävs. Enbart snippet-koden spelar in.

1. Två sätt att anropa

mp.js laddas asynkront. Kod som körs innan det har laddats lägger anropen i kön window.mp_q. mp.js bearbetar den så snart det finns på plats. Därefter finns samma funktioner på window.MousePlayer.

// Before mp.js has loaded - the queue keeps every call: (window.mp_q = window.mp_q || []).push(['consent', true]); // After mp.js has loaded - the same, directly: MousePlayer.setConsent(true);

Skriv alltid window.mp_q = window.mp_q || [], aldrig window.mp_q = []. mp.js fortsätter lyssna på den listan. En ny lista skulle sluka varje senare anrop, även återkallat samtycke.

Installationskoden definierar även en stubfunktion mp(...) som köar på samma sätt. Båda formerna tar samma kommandon: consent, set, event, step, get, on och off.

2. Samtycke

Utan samtycke spelas inget in. Om MousePlayer känner igen ditt samtyckesverktyg behöver du inget av detta. Annars skickar du själv beslutet vidare.

MousePlayer.setConsent(true); // the visitor agreed MousePlayer.setConsent(false); // withdrawn: recording stops on this page MousePlayer.getConsentState(); // e.g. 'WAITING', 'GRANTED', 'GRANTED_LATE', 'DENIED', 'WITHDRAWN'

Ett återkallande gäller direkt på sidan: lyssnare tas bort, buffrade data kastas och anslutningen stängs. Se MousePlayer och samtycke.

3. Ditt kund-ID

Med ett eget ID blir en persons alla enheter en besökare i listorna och du kan söka efter ett supportärende via numret du känner till. ID:t tillämpas även på samma webbläsares tidigare besök från de senaste 30 dagarna.

// After login - your own customer number, not an e-mail address: MousePlayer.setUserId('customer-4711'); // or through the queue (window.mp_q = window.mp_q || []).push(['set', 'user_id', 'customer-4711']);

Använd ett internt nummer, inte en e-postadress eller ett namn. MousePlayer visar ID:t överallt där besökaren visas.

Läsa tillbaka ID:n

MousePlayer.getSessionUrl(); // replay link of the running session MousePlayer.getSessionId(); MousePlayer.getVisitorId(); // null without consent // Through the queue, with a callback: (window.mp_q = window.mp_q || []).push(['get', 'session_url', function (url) { // e.g. attach it to a support ticket }]);

4. Anpassade händelser

Händelser du skickar visas på uppspelningens tidslinje, kan vara mål och trattsteg och skickas till webhookar och anslutna verktyg. Parametrar är korta värden: tal, strängar på högst 255 tecken och nycklar på högst 64 tecken.

MousePlayer.trackEvent('newsletter_signup', { source: 'footer' }); MousePlayer.trackEvent('purchase', { value: 129.90, currency: 'EUR' }); (window.mp_q = window.mp_q || []).push(['event', 'add_to_cart', { sku: 'SKU-123' }]);
  • Namn: gemener med understreck, högst 128 tecken. Använd samma namn för samma sak överallt. Ett mål matchar namn exakt.
  • Lägg inte personuppgifter i parametrar. De lagras och visas som andra händelser.

5. Steg utan adressändring

En kassa eller guide som byter skärmbild men inte adress är en enda sida för MousePlayer. step() gör varje skärmbild till en egen sidvisning med egen ögonblicksbild, värmekartrad och trattsteg.

// A wizard that keeps its address: MousePlayer.step('shipping'); MousePlayer.step('payment'); MousePlayer.step(''); // back to the page itself (window.mp_q = window.mp_q || []).push(['step', 'payment']);

Ett namn består av 1 till 40 tecken ur a-z, 0-9, _ och -. Mellanslag blir bindestreck och allt annat avvisas med en varning i konsolen. Verklig navigering avslutar steget.

6. Produktkontext

Berätta för MousePlayer vad som visas på en produktsida. Bara dessa nycklar accepteras. Allt annat kastas så att inga kunddata följer med av misstag.

MousePlayer.setContext({ page_type: 'product', product_id: 'SKU-123', variant_id: 'SKU-123-42', price: 89.90, currency: 'EUR', category: 'running-shoes', in_stock: true, cart_value: 0, cart_items: 0 });

7. Hookar

Din kod kan reagera på det MousePlayer mäter på sidan. Registrera via kön om hooken måste fånga det första ögonblicket.

// Register early - exit_risk fires once, a few seconds after the visit starts: (window.mp_q = window.mp_q || []).push(['on', 'exit_risk', function (e) { console.log(e.risk, e.reasons, e.session); }]); function onAnswer(e) { /* e.survey, e.value, e.sentiment */ } MousePlayer.on('survey_answer', onAnswer); MousePlayer.off('survey_answer', onAnswer);
NamnNärFält
exit_riskutgångsmodellen har poängsatt den första sidvisningen (en gång per besök)risk, reasons, session
churn_risken återkommande besökare markeras med hög bortfallsriskrisk, reasons, session
offer_shownerbjudandet vid utgång visasart, risk, grund, session
offer_clickknappen klickasart, risk, grund, session, fehler
offer_dismissdet stängsart, risk, grund, session
survey_shownen enkät öppnassurvey, trigger, session
survey_answerbesökaren svararsurvey, type, value, option, sentiment, session
survey_textföljdfrågans text skickas (redan filtrerad)survey, text, session
survey_dismissenkäten stängs utan svarsurvey, step, session

När GTM-bryggan är aktiverad skickas samma händelser även till dataLayer (mp_exit_risk och så vidare). MousePlayer.exitRisk() returnerar aktuell utgångsrisk eller null innan den är känd.

8. HTML-attribut

<!-- Nothing typed in here leaves the browser as text --> <section data-mp-mask> ... </section> <!-- The value of this field is never recorded --> <input name="voucher" data-mp-ignore> <!-- Tell MousePlayer what an element is --> <span class="amount" data-mp-role="price">89,90 EUR</span>
  • data-mp-mask (eller klassen mp-masked): text och inmatning i elementet ersätts innan de lämnar webbläsaren, i ögonblicksbilden, i ändringar och i klickbeskrivningar.
  • data-mp-ignore (eller mp-ignore) på ett formulärfält: värdet spelas inte in alls.
  • data-mp-role: ett av price, price_old, cta_cart, cta_checkout, product_image, variant, shipping_info, returns_info, reviews, rating, stock, coupon, payment_methods, search, filter, heading, article_body, nav, media, form_field, contact_info. Andra värden ignoreras.

9. Uteslut egna besök

Öppna webbplatsen en gång med ?mp_exclude=1 så spelas den här webbläsaren inte in längre; ?mp_exclude=0 återställer det. För ett helt kontorsnätverk anger du i stället IP-adresserna i projektinställningarna.

https://www.your-shop.com/?mp_exclude=1 <!-- this browser is not recorded any more --> https://www.your-shop.com/?mp_exclude=0 <!-- recorded again -->

10. En länk till din integritetspolicy

Besökare kan se och radera det som spelats in om dem. privacyUrl() returnerar en färdig länk med den här webbläsarens ID, eller null om det saknas eftersom inget spelats in utan samtycke.

var link = MousePlayer.privacyUrl(); // language from <html lang>, or e.g. privacyUrl('de') if (link) document.getElementById('my-data').href = link;