Loaded recordings
0Visits ready to explore
shopview.
EVERY VISIT HAS A STORYSee the moments
See the moments
behind the metrics.
Understand how customers browse, where they hesitate, and what gets in their way.
Browsed the collection00:04 · Product discovery✓
Found the perfect fit00:38 · Added to cart✓
A better shopping experienceObserve. Understand. Improve.
shopview.
WELCOME BACKSign in to your workspace
A closer look at your customer experience.
Set up your first local admin
No admin account exists in this local database yet. Hosted ShopView credentials are separate. Use your private admin setup link, or unlock with the local recovery key to create your login.
Use a workspace recovery key
Running locally? Run npm run copy:key once, then create your email/password login in Settings.
Need a new account? Your workspace admin can add you in Settings → Team & access and share a private setup link. You choose your own password.
Sign in once on this browser. Your recordings stay private.
Just taking a look?
Local preview with sample data. Your stores stay untouched.
© 2026 ShopView. All rights reserved.
CUSTOMER EXPERIENCE
Session recordings
Understand every click, scroll, and moment in between.
Sessions with issues
0Worth a closer look
Page loads
0Across loaded visits
Recorded data
0 KBRetention set per environment
| SESSION | STARTED | PAGE LOADS | ISSUES | DATA | EXPIRES |
|---|
Your next insight starts here.
Connect a store and capture a consented visit.
Your recordings will appear here.
No matching recordings
Try a different session ID or adjust your filters.
Session replay
Loading recording…
Ready0:00.00 / 0:00.00
Recorded actions and console errors
Recorded actions
Click an action to replay from that point.
Console errors and warnings
No matching issues. Error logging is available for new recordings.
FROM INSTALLATION TO YOUR FIRST REPLAY
Setup guide
Follow these steps to add ShopView to your website or ecommerce application.
- 1
Create your store environment
Open Stores, choose Connect a store, and enter a name, store group, environment and the exact website address. Keep Production, Staging and Development as separate environments under the same group. An admin must create the environment; ask your workspace admin if you cannot add stores.
- 2
Copy the environment’s public project ID
On its store card, open Installation. Copy the public project ID or the ready-to-use installation code. Each environment has its own ID; use the matching ID on that website.
- 3
Add the loader to your application
Run this code once in the browser after the page has hydrated. Replace
YOUR_PUBLIC_PROJECT_IDwith the ID from Step 2. For server-rendered applications, keep browser code out of the server render.Angular: load outside NgZone after afterNextRender. React: load from a client-side effect once. Plain JavaScript: run after the page is ready.
- 4
Connect your analytics consent manager
Call
updateReplayConsent(true)only when the shopper has granted analytics consent. Pass the current choice on startup and call it again whenever that choice changes. UseupdateReplayConsent(false)on refusal or withdrawal. The example preserves consent while the loader downloads.Keep consent false until the choice is known. Browser privacy signals such as GPC and Do Not Track can still prevent recording.
- 5
Signal when SPA navigation has rendered
If your app changes pages without a full reload, call this after the destination page has finished rendering, especially when leaving a private account or login page:
window.CommerceReplay?.routeReady();
Use your framework’s after-render hook. A URL change alone does not confirm that private content has left the page.
- 6
Check your security policy and private content
If the website uses a Content Security Policy, allow your ShopView service origin in
script-srcandconnect-src. Mark extra private sections withdata-replay-blockordata-replay-mask. Form values and payment fields remain protected.Your project ID is public. Keep workspace recovery keys, passwords and private API keys out of storefront code.
Optional large-batch worker encoding uses
worker-src blob:. Recording falls back without it; review your security policy before changing it. - 7
Verify your first recording
On a staging environment, set
sdk.dataset.sample = '1'to include every eligible test visit. Grant analytics consent, browse and interact for 15–20 seconds, then open Recordings, select the environment and choose Refresh. Open the visit to check playback.If nothing appears, check the exact registered origin, consent, browser privacy settings and the project ID. The default 10% sample does not record every eligible visit.
- 8
Roll out to production
Use the Production environment’s ID and origin, restore the intended sample rate (the example uses 10%), and verify consent, navigation and playback on your real storefront. Admins can configure retention in Settings → Data & retention and monitor real-user performance after rollout.
For another application, repeat these steps with its own store group and environments.
YOUR STOREFRONTS, CONNECTED
Connect a storeStores
One workspace for every store and environment.
Your storesExact origins. Separate recordings.
Create a store group
Bring your first store into focus.
Connect your storefront to start understanding customer visits.
Connect a storeA NEW PERSPECTIVE
Connect a store
Start with a name and the address of your storefront.
Store details
Keep production, staging, and development together under one store group.
Built around customer privacy. Recording starts after analytics consent. Sensitive fields stay protected, and you control how long recordings are kept.
STORE INSTALLATION
View recordings Connect your storefront
A small snippet. A clearer customer journey.
Install after analytics consent
This loads a small bootstrap. Recording starts only after your consent manager calls setConsent(true). Default sample: 10%.
Call setConsent(false) on withdrawal. On Angular, load outside NgZone after hydration. SPA navigation stays in the same visit; sensitive routes are excluded.
Three steps to your first replay
- 1Add the snippet
Run it once in your storefront, after the page has hydrated.
- 2Connect analytics consent
Pass the shopper’s consent state to start or stop recording.
- 3Take it for a spin
Browse your store for a few seconds, then refresh Recordings.
Your project ID is public. Private API keys belong in server applications.
MAKE IT YOURS
Settings
Manage your account and keep project access in your control.
Your account
Manage your workspace sign-in and password.
W
Profile & security
Database & retention
Delete all environment recordings
Deletes every visit, page segment, and event chunk in the selected environment. Other environments stay intact. This cannot be undone in ShopView.
Recent management activity
Team members
Admins manage settings and access. Editors can review and delete recordings. Viewers can only review. Each account belongs to one customer workspace.
Add a user
Enter their email and access level. Share the generated details; the user sets their own password using the private link.
Share these details securely. This account stays pending until the user opens the link and chooses a password. Emails are not sent automatically. On another device, use a shared staging or hosted URL; localhost is only this computer.
Create a customer workspace
Platform recovery access only. The customer receives a separate admin login and cannot access your workspace.
Project access keys
Read-only access to a single project’s recordings. Create, expire, or revoke keys here.
Private API keys
Read-onlyNo access keys yet. Your storefront can record without a private API key.
Keep private keys in server applications. Your storefront uses its public project ID and installation snippet.