Skip to main content
ComponentsEngineJS ProfilerMobile AppRPA Bot RecorderRUM JS
Availability2023.3 or later

Third-Party Checkout Monitoring

Extend monitoring to checkouts

Configure the GermainUX monitoring profile

Review Shopify profile settings

Validate the complete journey

Test before production rollout

Troubleshooting

Fix common setup problems

​
Configure Monitoring for Third-Party Shopify Checkouts

Configure GermainUX RUM JS on supported third-party checkout platforms to extend monitoring beyond the Shopify storefront. This enables GermainUX to capture supported checkout activity, errors, performance, and Session Replay after a shopper leaves the Shopify-hosted storefront.

​
Supported checkout platforms

This guide provides configuration instructions for: Contact GermainUX Support if you use another checkout provider. Third-party platforms can change or restrict their custom-script capabilities. Confirm that your provider still permits JavaScript in the required checkout pages before beginning the configuration.

​
Prerequisites

Before configuring a third-party checkout, verify that:
  • GermainUX monitoring is already deployed on the Shopify storefront.
  • You have administrative access to the checkout platform.
  • The checkout platform permits custom JavaScript.
  • You know your GermainUX hostname.
  • You know the application name used for the Shopify store.
  • The third-party checkout domain is included in the monitoring profile.
  • Privacy, consent, masking, and retention requirements have been approved.
  • You can safely complete a test checkout.

​
GermainUX monitoring script

Use the following script unless GermainUX generated a store-specific version for your environment:
Replace: For example:
URL-encode spaces and reserved characters in the application name. Use the same application name across the Shopify storefront and third-party checkout when both parts should appear under the same application in GermainUX.

​
Configure Checkify monitoring

​
Add the script

1

Sign in to the Checkify administration interface

2

Go to Advanced Settings > Scripts

3

Create a new script

4

Select the header placement

5

Select Both to apply the script to the checkout and Thank You pages

6

Enter GermainUX as the script name

7

Add the GermainUX monitoring script

8

Replace the hostname and application-name placeholders

9

Save the changes

​
Validate Checkify

1

Start a new Shopify storefront session

2

Add a product to the cart

3

Continue to the Checkify checkout

4

Complete a test order

5

Open GermainUX and locate the session

6

Verify that the Checkify checkout and Thank You pages appear in the journey

7

Confirm that checkout errors, requests, and replay data are captured as expected

If the storefront and checkout appear as separate sessions, review the cross-domain and session-correlation configuration.

​
Configure Funnelish monitoring

Funnelish custom code must be configured separately for each funnel that you want to monitor.

​
Add the script

1

Sign in to Funnelish

2

Open All Funnels

3

Select the funnel to monitor

4

Open Custom Codes

5

Create a new custom code

6

Select Page Head as the placement

7

Enter GermainUX as the code name

8

Add the GermainUX monitoring script

9

Replace the hostname and application-name placeholders

10

Apply the code to every required funnel page

11

Save the configuration

​
Validate Funnelish

1

Open the monitored funnel in a new browser session

2

Navigate through every funnel step

3

Submit only safe test information

4

Complete the funnel when permitted

5

Confirm in GermainUX that all expected pages and actions were collected

6

Verify that the funnel uses the intended Shopify application and environment

7

Confirm that excluded payment and personal information is not captured

Repeat this validation for every configured funnel.

​
Configure Recharge Custom Checkout monitoring

The configuration described below adds GermainUX to the Recharge Thank You page. It does not provide visibility into the entire Recharge checkout unless Recharge also allows the script to run on the preceding checkout pages.

​
Add the script

1

Sign in to the Recharge administration interface

2

Go to Storefront > Checkout

3

Open the custom-code configuration

4

Add the GermainUX monitoring script to the Thank You Page field

5

Replace the hostname and application-name placeholders

6

Save the configuration

​
Validate Recharge

1

Begin a test subscription or purchase from the Shopify storefront

2

Continue through Recharge checkout

3

Complete the test order

4

Confirm that the Recharge Thank You page appears in GermainUX

5

Verify that the purchase or completion event correlates with the intended Shopify journey

Because this configuration monitors only the Thank You page, do not interpret missing intermediate Recharge activity as customer abandonment. Those checkout steps may simply be outside the monitoring scope.

​
Configure the GermainUX monitoring profile

Go to: Germain Workspace > Analytics > UX Monitoring Profiles Select the Shopify profile and review the following settings.

​
Allowed domains and URL matching

Add the relevant third-party checkout domains and configure URL rules for:
  • Checkout
  • Customer information
  • Shipping
  • Payment
  • Order review
  • Thank You or confirmation pages
  • Error and failure pages
Use logical page names instead of storing full dynamic URLs containing cart, checkout, customer, or order identifiers.

​
Session correlation

Configure the storefront and checkout to use:
  • The same application name
  • Compatible session settings
  • Appropriate cross-domain correlation
  • Consistent environment values
  • The same business-process definition
Depending on browser privacy controls and the checkout provider’s security model, complete session continuity may not always be possible. Validate the behavior in every supported browser.

​
Business-process monitoring

Define the checkout as part of a complete Shopify conversion process. Example steps: Configure separate outcomes for:
  • Successful completion
  • Customer abandonment
  • Application failure
  • Payment decline
  • User validation
  • Loss of monitoring coverage
A missing event should not automatically be classified as abandonment unless monitoring is known to cover the relevant step.

​
Privacy and security

Third-party checkout pages can contain highly sensitive information. Apply strict capture controls before enabling monitoring in production.
Never collect:
  • Payment-card numbers
  • Card security codes
  • Passwords
  • Authentication tokens
  • Session tokens
  • Banking information
  • Unmasked billing or shipping information when prohibited
  • Sensitive request or response bodies
Configure:
  • Input masking
  • Text masking
  • Element exclusion
  • Page exclusion
  • Network-body exclusion
  • URL and query-parameter sanitization
  • Session Replay restrictions
  • Consent integration
  • Role-based access
  • Data retention
Where possible, exclude payment fields and embedded payment iframes entirely rather than relying only on masking.

​
Embedded checkout content

Content rendered inside a cross-origin iframe cannot normally be inspected by RUM JS running in the parent page. This commonly applies to payment fields and hosted payment widgets. GermainUX can monitor the surrounding checkout page, but not necessarily the internal content or interactions of a protected third-party iframe.

​
Validate the complete journey

Test the integration before production rollout.

​
Successful-checkout test

Verify that:
  • The storefront session is collected.
  • The customer transition to checkout is visible.
  • Each monitored checkout page has a logical name.
  • Checkout requests and duration are captured.
  • The completion or Thank You page is recorded.
  • The transaction appears as a completed business process.
  • No sensitive information is visible.

​
Failure tests

Where safe, validate:
  • Missing required information
  • Invalid discount code
  • Unavailable shipping method
  • Declined test payment
  • Checkout application error
  • Third-party request failure
  • Abandoned checkout
Keep the following classifications separate:

​
Troubleshooting

​
No checkout data appears

Confirm that:
  • The script was saved and published.
  • It is placed in the page head or other supported location.
  • The GermainUX hostname is correct.
  • The application name is URL-encoded.
  • The Shopify monitoring profile exists.
  • The checkout domain matches the profile.
  • Consent permits monitoring.
  • Content Security Policy allows the GermainUX script.
  • Browser or network security tools are not blocking the request.
Use the browser developer tools to confirm that germainapm.js loads successfully.

​
Storefront and checkout are separate sessions

Review:
  • Application-name consistency
  • Cross-domain correlation
  • Cookie restrictions
  • Consent status
  • Browser tracking protections
  • Checkout redirects
  • Session timeout
  • Provider sandbox restrictions
If correlation cannot be maintained directly, use a permitted non-sensitive journey identifier or event-based correlation. Never place customer, payment, or authentication information in URLs for this purpose.

​
Session Replay is incomplete

Check whether:
  • Only the Thank You page contains the script.
  • Earlier checkout pages prohibit custom JavaScript.
  • Checkout content is rendered inside cross-origin iframes.
  • Elements or pages are excluded by privacy rules.
  • Consent is granted only after part of the journey.
  • The shopper moves between multiple checkout domains.
  • The provider dynamically removes or replaces custom scripts.

​
Data is duplicated

Confirm that GermainUX is not loaded more than once through:
  • The checkout provider’s global script configuration
  • Funnel-specific custom code
  • A Shopify web pixel
  • The storefront theme
  • A tag manager
  • Another analytics integration
Retain only the intended deployment on each page unless GermainUX has explicitly configured deduplication.
  • Deploy Monitoring for Shopify
  • Configure Shopify Events
  • Configure Error Monitoring for Shopify
  • Configure User Feedback for Shopify

​
Get Help

Contact GermainUX Support

The GermainUX team helps you get up and running faster, empower your team, turn data into actionable insights, and optimize performance to deliver measurable business outcomes.

Can't find what you need?

Search all GermainUX docs with Ctrl + K, or use the feedback buttons at the bottom of this page to tell us what is missing.

The content of this document is proprietary to GERMAIN SOFTWARE.