How can I set up Piwik PRO for multiple environments?

Needed permissions: owner

When you set up your site or app in multiple environments, such as development, testing, staging and production, you usually share the same code between them. So when Piwik PRO is installed, the container code is also the same. This results in collecting data from all sites and apps into one place.

In this article, we’ll explain how to keep using the same code but report the data separately for each site or app.

To set up your site or app for multiple environments, follow these steps:

  1. We’ll create two separate sites for our two domains: and
  2. Go to Menu > Administration.
  3. Navigate to Sites & apps.
  4. Click Add a site or app.
  5. Type the site or app name and address and click Save.
    Add a site or app in Piwik PRO
  6. Note the site ID for the created site. The ID is under the site or app name.
    Site or app ID in Piwik PRO
  7. Repeat steps 2–6 for the second domain or any other domain.
  8. Navigate to Installation. This can be any of your previously added sites or apps.
  9. In Basic container (async), click Copy to clipboard.
    Copy to clipboard a basic container in Piwik PRO
  10. Paste the code into a text editor. We’ll modify the code slightly so that it can be used on all sites and apps you add.
  11. Create a function that recognizes your site or app and assigns it an ID. We’ll use the following function:
    if (window.location.hostname === "")
    	window.PiwikPROappID = '00000000-0000-0000-0000-000000000000';
    else if (window.location.hostname === "")
    	window.PiwikPROappID = '11111111-1111-1111-1111-111111111111';
  12. Paste the function right after the opening <script> tag.
  13. Replace the site ID at the end of the code with window.PiwikPROappID.
    (window, document, 'dataLayer', window.PiwikPROappID);
  14. The modified code should look something like this:
    <script type="text/javascript">
      if (window.location.hostname === "")
      	window.PiwikPROappID = '00000000-0000-0000-0000-000000000000';
      else if (window.location.hostname === "")
      	window.PiwikPROappID = '11111111-1111-1111-1111-111111111111';
      (function(window, document, dataLayerName, id) {
      window[dataLayerName]=window[dataLayerName]||[],window[dataLayerName].push({start:(new Date).getTime(),event:"stg.start"});var scripts=document.getElementsByTagName('script')[0],tags=document.createElement('script');
      function stgCreateCookie(a,b,c){var d="";if(c){var e=new Date;e.setTime(e.getTime()+24*c*60*60*1e3),d="; expires="+e.toUTCString()}document.cookie=a+"="+b+d+"; path=/"}
      var isStgDebug=(window.location.href.match("stg_debug")||document.cookie.match("stg_debug"))&&!window.location.href.match("stg_disable_debug");stgCreateCookie("stg_debug",isStgDebug?1:"",isStgDebug?14:-1);
      var qP=[];dataLayerName!=="dataLayer"&&qP.push("data_layer_name="+dataLayerName),isStgDebug&&qP.push("stg_debug");var qPString=qP.length>0?("?"+qP.join("&")):"";
      !function(a,n,i){a[n]=a[n]||{};for(var c=0;c<i.length;c++)!function(i){a[n][i]=a[n][i]||{},a[n][i].api=a[n][i].api||function(){var a=[],0);"string"==typeof a[0]&&window[dataLayerName].push({event:n+"."+i+":"+a[0],parameters:[],1)})}}(i[c])}(window,"ppms",["tm","cm"]);
      })(window, document, 'dataLayer', window.PiwikPROappID);
  15. Paste the modified code right after the opening <body> tag on every page of your website or app.
  16. All done! You can now see your data in separate sites or apps in Piwik PRO. Data will appear in reports in about an hour. Data in the tracker debugger will appear instantly.

    Tip: You can also check manually to see if your tracking works. Read more

Was this article helpful?

Technical support

If you still have any questions, visit our community.
There’s always someone happy to help!

Back to help center