https://
The https:// in the address bar means your information is encrypted and can not be accessed by anyone else
.gov
Only government entities in the U.S. can end in .gov
Digital Standards

Analytics

The City of Philadelphia has a unified web analytics strategy. Every web property should either use the following tracking code for webpages or the JavaScript implementation for applications.

This will allow the City to report on traffic, usage, clicks, and to collect other useful data about phila.gov websites and applications.

Analytics tracking for content-heavy webpages

  1. Add the first snippet immediately after the opening <head> on your site, on every page. 
<!-- Google Tag Manager [phila.gov]  -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-MC6CR2');</script>
<!-- End Google Tag Manager [phila.gov] -->
  1. Add the second no-script snippet immediately after the opening <body> tag, on every page.
<!-- Google Tag Manager no script [phila.gov] -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MC6CR2"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager no script [phila.gov] -->
  1. If you are installing analytics on a non-phila.gov domain, email websupport@phila.gov with the URL of the website for testing. You will receive confirmation that the site that should be tracked and the code is working.

Analytics for web applications

If you are using a JavaScript framework like Vue.js, the City recommends using vue-gtag. The City’s tracking id is UA-860026-1.

You will need to add vue-gtag to your project and include it in your router.js (if you have one), or directly in the main.js file, where you initialized Vue.

Using VueRouter (preferred)

If you are using VueRouter inside your application, you can pass the VueRouter instance as the third parameter of the Vue.use method and the plugin will start tracking all your routes automatically, meaning you will not need to pass individual routes for tracking. 

import Vue from "vue";
import VueRouter from 'vue-router';
import App from "./App.vue";
import VueGtag from "vue-gtag";

const router = new VueRouter({
  routes: [...]
});

Vue.use(VueGtag, {
  config: { id: "UA-860026-1" },
}, router);

new Vue({
  router,
  render: h => h(App)
}).$mount("#app");

Manual tracking

If you aren’t using VueRouter, or otherwise need to send routes manually, you can follow the Bootstrap option instructions on the plugin website.

Other analyitcs

You can also add Microsoft Clarity tracking to the <head> of your application. Clarity allows you to see session recordings, heatmaps, and other detailed information on page engagement.

Email mailto:websupport@phila.gov to gain access to Microsoft Clarity. 

<!-- Microsoft Clarity [phila.gov] -->
<script type="text/javascript">
    (function(c,l,a,r,i,t,y){
        c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
        t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
        y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
    })(window, document, "clarity", "script", "4l8dhsl6kn");
</script>
<!-- End Microsoft Clarity [phila.gov] -->

Note: You should only add Clarity if your application does not collect personal information.

How to use