Skip to main content

Global Code Implementation Guide

The DATA Reshape tracking library enables server-side tracking across all pages by collecting event data, managing user sessions, and streaming information to your analytics and marketing platforms.

Prerequisites​

Required Before Implementation

Only implement after receiving confirmation that your custom domain and SSL certificate are active.

Required Information:

  • Custom tracking subdomain (e.g., dre2.yourdomain.com)
  • Script ID provided by DATA Reshape team

Basic Implementation​

Add this code to your website's <head> section on all pages:

<script>
(function(R,e,s,h,a,p,E){
  var b=R.Reshape=R.Reshape||{};
  b.setCookie=function(n,v,t,d){try{e.cookie=n+'='+v+';max-age='+t+';domain='+d+';path=/;SameSite=None;Secure';}catch(e){}};
  b.id=a;b.cdn=h;b.sts=new Date().getTime();
  E=e.getElementsByTagName(s)[0];p=e.createElement(s);p.async=true;p.src="https://"+h+"/main.js?id="+a;E.parentNode.insertBefore(p,E);
})(window,document,"script","YOUR_SUBDOMAIN","YOUR_SCRIPT_ID");
</script>
Important Replacements
  • Replace YOUR_SUBDOMAIN with your actual custom subdomain
  • Replace YOUR_SCRIPT_ID with the Script ID provided by the DATA Reshape team

HTML Template Example​

Here's how to implement it in a complete HTML document:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Your Website</title>
    
    <!-- DATA Reshape Tracking Code -->
    <script>
    (function(R,e,s,h,a,p,E){
      var b=R.Reshape=R.Reshape||{};
      b.setCookie=function(n,v,t,d){try{e.cookie=n+'='+v+';max-age='+t+';domain='+d+';path=/;SameSite=None;Secure';}catch(e){}};
      b.id=a;b.cdn=h;b.sts=new Date().getTime();
      E=e.getElementsByTagName(s)[0];p=e.createElement(s);p.async=true;p.src="https://"+h+"/main.js?id="+a;E.parentNode.insertBefore(p,E);
    })(window,document,"script","YOUR_SUBDOMAIN","YOUR_SCRIPT_ID");
    </script>
    
    <!-- Your other head content -->
</head>
<body>
    <!-- Your website content -->
</body>
</html>

Advanced Implementation Options​

Multiple Script IDs​

For websites with different sections requiring separate tracking:

<script>
// Determine Script ID based on page or subdomain
const getScriptId = () => {
  const path = window.location.pathname;
  const hostname = window.location.hostname;
  
  // Example: Different IDs for different sections
  if (path.startsWith('/shop/')) return 'ECOMMERCE_SCRIPT_ID';
  if (path.startsWith('/blog/')) return 'BLOG_SCRIPT_ID';
  if (hostname.includes('support.')) return 'SUPPORT_SCRIPT_ID';
  
  return 'MAIN_SCRIPT_ID'; // Default Script ID
};

(function(R,e,s,h,a,p,E){
  var b=R.Reshape=R.Reshape||{};
  b.setCookie=function(n,v,t,d){try{e.cookie=n+'='+v+';max-age='+t+';domain='+d+';path=/;SameSite=None;Secure';}catch(e){}};
  b.id=a;b.cdn=h;b.sts=new Date().getTime();
  E=e.getElementsByTagName(s)[0];p=e.createElement(s);p.async=true;p.src="https://"+h+"/main.js?id="+a;E.parentNode.insertBefore(p,E);
})(window,document,"script","YOUR_SUBDOMAIN",getScriptId());
</script>

Conditional Loading​

For loading the script only under specific conditions:

<script>
// Example: Only load on production or specific environments
const shouldLoadTracking = () => {
  // Don't load on localhost or staging
  if (window.location.hostname === 'localhost' || 
      window.location.hostname.includes('staging')) {
    return false;
  }
  
  // Don't load for admin users (if you have admin detection)
  if (window.isAdminUser) {
    return false;
  }
  
  return true;
};

if (shouldLoadTracking()) {
  (function(R,e,s,h,a,p,E){
    var b=R.Reshape=R.Reshape||{};
    b.setCookie=function(n,v,t,d){try{e.cookie=n+'='+v+';max-age='+t+';domain='+d+';path=/;SameSite=None;Secure';}catch(e){}};
    b.id=a;b.cdn=h;b.sts=new Date().getTime();
    E=e.getElementsByTagName(s)[0];p=e.createElement(s);p.async=true;p.src="https://"+h+"/main.js?id="+a;E.parentNode.insertBefore(p,E);
  })(window,document,"script","YOUR_SUBDOMAIN","YOUR_SCRIPT_ID");
}
</script>

Content Security Policy (CSP) Configuration​

If your website uses Content Security Policy, add these directives:

<meta http-equiv="Content-Security-Policy" content="
  script-src 'self' 'unsafe-inline' https://sub.yourdomain.com;
  connect-src 'self' https://sub.yourdomain.com;
">

Or in your server configuration:

Content-Security-Policy: script-src 'self' 'unsafe-inline' https://sub.yourdomain.com; connect-src 'self' https://sub.yourdomain.com;

Troubleshooting Common Issues​

Script Not Loading​

Symptoms: No request to your subdomain in Network tab

Solutions:

  1. Check DNS Configuration: Verify your custom subdomain DNS records are correctly configured
  2. Verify SSL Certificate: Ensure SSL certificate is active and valid
  3. Check Domain Spelling: Confirm subdomain URL matches exactly

CORS Errors​

Symptoms: Console errors about Cross-Origin Resource Sharing

Solutions:

  1. SSL Certificate: Verify your subdomain has a valid SSL certificate
  2. DNS Propagation: Allow 24-48 hours for DNS changes to propagate globally
  3. Subdomain Configuration: Contact DATA Reshape team to verify server configuration

Events Not Tracking​

Symptoms: Script loads but events don't appear in your dashboard

Solutions:

  1. Script ID: Confirm Script ID matches your DATA Reshape configuration
  2. Event Implementation: Verify event tracking code is properly implemented

Console Errors​

Common Error Messages and Solutions:

Failed to load resource: net::ERR_NAME_NOT_RESOLVED

Solution: DNS configuration issue - verify subdomain DNS records

Mixed Content: The page was loaded over HTTPS, but requested an insecure resource

Solution: Ensure your subdomain uses HTTPS (SSL certificate required)

Access to fetch at '...' has been blocked by CORS policy

Solution: SSL certificate or server configuration issue - contact DATA Reshape team

Testing Your Implementation​

Network Monitoring​

Monitor these requests in Developer Tools:

  • Initial script load: https://sub.yourdomain.com/main.js?id=YOUR_SCRIPT_ID

Next Steps​

Once your global code is successfully implemented:

  1. Verify Implementation - Confirm library loads and no errors appear
  2. Implement Event Tracking - Add specific events for your business:
  1. Add Customer Data - Include customer data collection for better attribution
  2. Configure Your Destinations - Set up destination platforms for your data
Need Help?

Implementation Complete! Your DATA Reshape tracking is now active.

If you encounter any issues or need assistance with event implementation, contact the DATA Reshape team for technical support.

Platform-Specific Guides​

For detailed platform-specific implementation instructions, see our dedicated guides: