CINXE.COM

<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name='robots' content='index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1' />  <meta name="description" content="Find out how you can use a tag manager to track single-page applications. Learn how to configure and take advantage of Virtual Pageviews and Custom Events for better tracking." /> <link rel="canonical" href="https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/" /> <meta property="og:locale" content="en_US" /> <meta property="og:type" content="article" /> <meta property="og:title" content="3 ways to track single-page applications (SPAs) with Tag Manager: a step-by-step guide" /> <meta property="og:description" content="Find out how you can use a tag manager to track single-page applications. Learn how to configure and take advantage of Virtual Pageviews and Custom Events for better tracking." /> <meta property="og:url" content="https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/" /> <meta property="og:site_name" content="Piwik PRO" /> <meta property="article:publisher" content="https://www.facebook.com/PiwikPRO/" /> <meta property="article:published_time" content="2020-04-14T01:18:00+00:00" /> <meta property="article:modified_time" content="2024-07-24T18:30:42+00:00" /> <meta property="og:image" content="https://piwik.pro/wp-content/uploads/2020/03/1200x630-Facebook-1.png" /> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="630" /> <meta property="og:image:type" content="image/png" /> <meta name="author" content="Karolina Lubowicka" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:creator" content="@piwikpro" /> <meta name="twitter:site" content="@piwikpro" /> <meta name="twitter:label1" content="Written by" /> <meta name="twitter:data1" content="Karolina Lubowicka" /> <meta name="twitter:label2" content="Est. reading time" /> <meta name="twitter:data2" content="13 minutes" /> <script type="application/ld+json" class="yoast-schema-graph">{"@context":"https://schema.org","@graph":[{"@type":"Article","@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/#article","isPartOf":{"@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/"},"author":{"name":"Karolina Lubowicka","@id":"https://piwik.pro/#/schema/person/236a87fa75ff52f2aefef87225f07343"},"headline":"3 ways to track single-page applications (SPAs) with Tag Manager: a step-by-step guide","datePublished":"2020-04-14T01:18:00+00:00","dateModified":"2024-07-24T18:30:42+00:00","mainEntityOfPage":{"@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/"},"wordCount":2084,"publisher":{"@id":"https://piwik.pro/#organization"},"image":{"@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/#primaryimage"},"thumbnailUrl":"https://piwik.pro/wp-content/uploads/2020/02/2020-02-03_how-to-track-single-page-applications-spas_blog-1.png","articleSection":["Analytics","Tag Manager"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/","url":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/","name":"Tracking single-page applications (SPAs) with Tag Manager","isPartOf":{"@id":"https://piwik.pro/#website"},"primaryImageOfPage":{"@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/#primaryimage"},"image":{"@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/#primaryimage"},"thumbnailUrl":"https://piwik.pro/wp-content/uploads/2020/02/2020-02-03_how-to-track-single-page-applications-spas_blog-1.png","datePublished":"2020-04-14T01:18:00+00:00","dateModified":"2024-07-24T18:30:42+00:00","description":"Find out how you can use a tag manager to track single-page applications. Learn how to configure and take advantage of Virtual Pageviews and Custom Events for better tracking.","breadcrumb":{"@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/#primaryimage","url":"https://piwik.pro/wp-content/uploads/2020/02/2020-02-03_how-to-track-single-page-applications-spas_blog-1.png","contentUrl":"https://piwik.pro/wp-content/uploads/2020/02/2020-02-03_how-to-track-single-page-applications-spas_blog-1.png","width":620,"height":400},{"@type":"BreadcrumbList","@id":"https://fse.piwik.pro/blog/how-to-track-single-page-applications-spas/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://piwik.pro/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https://piwik.pro/blog/"},{"@type":"ListItem","position":3,"name":"3 ways to track single-page applications (SPAs) with Tag Manager: a step-by-step guide"}]},{"@type":"WebSite","@id":"https://piwik.pro/#website","url":"https://piwik.pro/","name":"Piwik PRO","description":"","publisher":{"@id":"https://piwik.pro/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://piwik.pro/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https://piwik.pro/#organization","name":"Piwik PRO","alternateName":"Take control of your data","url":"https://piwik.pro/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https://piwik.pro/#/schema/logo/image/","url":"","contentUrl":"","caption":"Piwik PRO"},"image":{"@id":"https://piwik.pro/#/schema/logo/image/"},"sameAs":["https://www.facebook.com/PiwikPRO/","https://x.com/piwikpro","https://www.linkedin.com/company/piwik-pro/"]},{"@type":"Person","@id":"https://piwik.pro/#/schema/person/236a87fa75ff52f2aefef87225f07343","name":"Karolina Lubowicka","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https://piwik.pro/#/schema/person/image/","url":"https://secure.gravatar.com/avatar/5c2009bcae3975d37aafbe71bb9ba322?s=96&d=mm&r=g","contentUrl":"https://secure.gravatar.com/avatar/5c2009bcae3975d37aafbe71bb9ba322?s=96&d=mm&r=g","caption":"Karolina Lubowicka"},"url":"https://piwik.pro/blog/author/k-lubowicka/"}]}</script>  <title>Tracking single-page applications (SPAs) with Tag Manager</title> <link rel="alternate" type="application/rss+xml" title="Piwik PRO » Feed" href="https://piwik.pro/feed/" /> <link rel="alternate" type="application/rss+xml" title="Piwik PRO » Comments Feed" href="https://piwik.pro/comments/feed/" /> <script> window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/15.0.3\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/15.0.3\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/piwik.pro\/wp-includes\/js\/wp-emoji-release.min.js?ver=6.7"}}; /*! This file is auto-generated */ !function(i,n){var o,s,e;function c(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function p(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data),r=(e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0),new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data));return t.every(function(e,t){return e===r[t]})}function u(e,t,n){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\uddfa\ud83c\uddf3","\ud83c\uddfa\u200b\ud83c\uddf3")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!n(e,"\ud83d\udc26\u200d\u2b1b","\ud83d\udc26\u200b\u2b1b")}return!1}function f(e,t,n){var r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):i.createElement("canvas"),a=r.getContext("2d",{willReadFrequently:!0}),o=(a.textBaseline="top",a.font="600 32px Arial",{});return e.forEach(function(e){o[e]=t(a,e,n)}),o}function t(e){var t=i.createElement("script");t.src=e,t.defer=!0,i.head.appendChild(t)}"undefined"!=typeof Promise&&(o="wpEmojiSettingsSupports",s=["flag","emoji"],n.supports={everything:!0,everythingExceptFlag:!0},e=new Promise(function(e){i.addEventListener("DOMContentLoaded",e,{once:!0})}),new Promise(function(t){var n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),p.toString()].join(",")+"));",r=new Blob([e],{type:"text/javascript"}),a=new Worker(URL.createObjectURL(r),{name:"wpTestEmojiSupports"});return void(a.onmessage=function(e){c(n=e.data),a.terminate(),t(n)})}catch(e){}c(n=f(s,u,p))}t(n)}).then(function(e){for(var t in e)n.supports[t]=e[t],n.supports.everything=n.supports.everything&&n.supports[t],"flag"!==t&&(n.supports.everythingExceptFlag=n.supports.everythingExceptFlag&&n.supports[t]);n.supports.everythingExceptFlag=n.supports.everythingExceptFlag&&!n.supports.flag,n.DOMReady=!1,n.readyCallback=function(){n.DOMReady=!0}}).then(function(){return e}).then(function(){var e;n.supports.everything||(n.readyCallback(),(e=n.source||{}).concatemoji?t(e.concatemoji):e.wpemoji&&e.twemoji&&(t(e.twemoji),t(e.wpemoji)))}))}((window,document),window._wpemojiSettings); </script> <link rel='stylesheet' id='pp-tooltip-style-css' href='https://piwik.pro/wp-content/plugins/pp-block-tooltip/build/style-index.css?ver=6.7' media='all' /> <style id='wp-block-paragraph-inline-css'> .is-small-text{font-size:.875em}.is-regular-text{font-size:1em}.is-large-text{font-size:2.25em}.is-larger-text{font-size:3em}.has-drop-cap:not(:focus):first-letter{float:left;font-size:8.4em;font-style:normal;font-weight:100;line-height:.68;margin:.05em .1em 0 0;text-transform:uppercase}body.rtl .has-drop-cap:not(:focus):first-letter{float:none;margin-left:.1em}p.has-drop-cap.has-background{overflow:hidden}:root :where(p.has-background){padding:1.25em 2.375em}:where(p.has-text-color:not(.has-link-color)) a{color:inherit}p.has-text-align-left[style*="writing-mode:vertical-lr"],p.has-text-align-right[style*="writing-mode:vertical-rl"]{rotate:180deg} </style> <link rel='stylesheet' id='wp-block-image-css' href='https://piwik.pro/wp-includes/blocks/image/style.min.css?ver=6.7' media='all' /> <style id='wp-block-group-inline-css'> .wp-block-group{box-sizing:border-box}:where(.wp-block-group.wp-block-group-is-layout-constrained){position:relative} </style> <style id='piwikpro-link-style-inline-css'> /*!***************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***! \***************************************************************************************************************************************************************************************************************************************/ .pp-link { display: table; } .pp-link.pp-link--wide { width: 100%; } /*# sourceMappingURL=style-index.css.map*/ </style> <style id='wp-block-navigation-link-inline-css'> .wp-block-navigation .wp-block-navigation-item__label{overflow-wrap:break-word}.wp-block-navigation .wp-block-navigation-item__description{display:none}.link-ui-tools{border-top:1px solid #f0f0f0;padding:8px}.link-ui-block-inserter{padding-top:8px}.link-ui-block-inserter__back{margin-left:8px;text-transform:uppercase} </style> <link rel='stylesheet' id='wp-block-navigation-css' href='https://piwik.pro/wp-includes/blocks/navigation/style.min.css?ver=6.7' media='all' /> <style id='wp-block-button-inline-css'> .wp-block-button__link{box-sizing:border-box;cursor:pointer;display:inline-block;text-align:center;word-break:break-word}.wp-block-button__link.aligncenter{text-align:center}.wp-block-button__link.alignright{text-align:right}:where(.wp-block-button__link){border-radius:9999px;box-shadow:none;padding:calc(.667em + 2px) calc(1.333em + 2px);text-decoration:none}.wp-block-button[style*=text-decoration] .wp-block-button__link{text-decoration:inherit}.wp-block-buttons>.wp-block-button.has-custom-width{max-width:none}.wp-block-buttons>.wp-block-button.has-custom-width .wp-block-button__link{width:100%}.wp-block-buttons>.wp-block-button.has-custom-font-size .wp-block-button__link{font-size:inherit}.wp-block-buttons>.wp-block-button.wp-block-button__width-25{width:calc(25% - var(--wp--style--block-gap, .5em)*.75)}.wp-block-buttons>.wp-block-button.wp-block-button__width-50{width:calc(50% - var(--wp--style--block-gap, .5em)*.5)}.wp-block-buttons>.wp-block-button.wp-block-button__width-75{width:calc(75% - var(--wp--style--block-gap, .5em)*.25)}.wp-block-buttons>.wp-block-button.wp-block-button__width-100{flex-basis:100%;width:100%}.wp-block-buttons.is-vertical>.wp-block-button.wp-block-button__width-25{width:25%}.wp-block-buttons.is-vertical>.wp-block-button.wp-block-button__width-50{width:50%}.wp-block-buttons.is-vertical>.wp-block-button.wp-block-button__width-75{width:75%}.wp-block-button.is-style-squared,.wp-block-button__link.wp-block-button.is-style-squared{border-radius:0}.wp-block-button.no-border-radius,.wp-block-button__link.no-border-radius{border-radius:0!important}:root :where(.wp-block-button .wp-block-button__link.is-style-outline),:root :where(.wp-block-button.is-style-outline>.wp-block-button__link){border:2px solid;padding:.667em 1.333em}:root :where(.wp-block-button .wp-block-button__link.is-style-outline:not(.has-text-color)),:root :where(.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-text-color)){color:currentColor}:root :where(.wp-block-button .wp-block-button__link.is-style-outline:not(.has-background)),:root :where(.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-background)){background-color:initial;background-image:none} </style> <style id='wp-block-buttons-inline-css'> .wp-block-buttons.is-vertical{flex-direction:column}.wp-block-buttons.is-vertical>.wp-block-button:last-child{margin-bottom:0}.wp-block-buttons>.wp-block-button{display:inline-block;margin:0}.wp-block-buttons.is-content-justification-left{justify-content:flex-start}.wp-block-buttons.is-content-justification-left.is-vertical{align-items:flex-start}.wp-block-buttons.is-content-justification-center{justify-content:center}.wp-block-buttons.is-content-justification-center.is-vertical{align-items:center}.wp-block-buttons.is-content-justification-right{justify-content:flex-end}.wp-block-buttons.is-content-justification-right.is-vertical{align-items:flex-end}.wp-block-buttons.is-content-justification-space-between{justify-content:space-between}.wp-block-buttons.aligncenter{text-align:center}.wp-block-buttons:not(.is-content-justification-space-between,.is-content-justification-right,.is-content-justification-left,.is-content-justification-center) .wp-block-button.aligncenter{margin-left:auto;margin-right:auto;width:100%}.wp-block-buttons[style*=text-decoration] .wp-block-button,.wp-block-buttons[style*=text-decoration] .wp-block-button__link{text-decoration:inherit}.wp-block-buttons.has-custom-font-size .wp-block-button__link{font-size:inherit}.wp-block-button.aligncenter{text-align:center} </style> <style id='wp-block-post-title-inline-css'> .wp-block-post-title{box-sizing:border-box;word-break:break-word}.wp-block-post-title :where(a){display:inline-block;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;text-decoration:inherit} </style> <style id='wp-block-post-terms-inline-css'> .wp-block-post-terms{box-sizing:border-box}.wp-block-post-terms .wp-block-post-terms__separator{white-space:pre-wrap} </style> <style id='wp-block-post-author-name-inline-css'> .wp-block-post-author-name{box-sizing:border-box} </style> <style id='wp-block-post-featured-image-inline-css'> .wp-block-post-featured-image{margin-left:0;margin-right:0}.wp-block-post-featured-image a{display:block;height:100%}.wp-block-post-featured-image :where(img){box-sizing:border-box;height:auto;max-width:100%;vertical-align:bottom;width:100%}.wp-block-post-featured-image.alignfull img,.wp-block-post-featured-image.alignwide img{width:100%}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim{background-color:#000;inset:0;position:absolute}.wp-block-post-featured-image{position:relative}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-gradient{background-color:initial}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-0{opacity:0}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-10{opacity:.1}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-20{opacity:.2}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-30{opacity:.3}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-40{opacity:.4}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-50{opacity:.5}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-60{opacity:.6}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-70{opacity:.7}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-80{opacity:.8}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-90{opacity:.9}.wp-block-post-featured-image .wp-block-post-featured-image__overlay.has-background-dim-100{opacity:1}.wp-block-post-featured-image:where(.alignleft,.alignright){width:100%} </style> <style id='wp-block-columns-inline-css'> .wp-block-columns{align-items:normal!important;box-sizing:border-box;display:flex;flex-wrap:wrap!important}@media (min-width:782px){.wp-block-columns{flex-wrap:nowrap!important}}.wp-block-columns.are-vertically-aligned-top{align-items:flex-start}.wp-block-columns.are-vertically-aligned-center{align-items:center}.wp-block-columns.are-vertically-aligned-bottom{align-items:flex-end}@media (max-width:781px){.wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column{flex-basis:100%!important}}@media (min-width:782px){.wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column{flex-basis:0;flex-grow:1}.wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column[style*=flex-basis]{flex-grow:0}}.wp-block-columns.is-not-stacked-on-mobile{flex-wrap:nowrap!important}.wp-block-columns.is-not-stacked-on-mobile>.wp-block-column{flex-basis:0;flex-grow:1}.wp-block-columns.is-not-stacked-on-mobile>.wp-block-column[style*=flex-basis]{flex-grow:0}:where(.wp-block-columns){margin-bottom:1.75em}:where(.wp-block-columns.has-background){padding:1.25em 2.375em}.wp-block-column{flex-grow:1;min-width:0;overflow-wrap:break-word;word-break:break-word}.wp-block-column.is-vertically-aligned-top{align-self:flex-start}.wp-block-column.is-vertically-aligned-center{align-self:center}.wp-block-column.is-vertically-aligned-bottom{align-self:flex-end}.wp-block-column.is-vertically-aligned-stretch{align-self:stretch}.wp-block-column.is-vertically-aligned-bottom,.wp-block-column.is-vertically-aligned-center,.wp-block-column.is-vertically-aligned-top{width:100%} </style> <style id='wp-block-heading-inline-css'> h1.has-background,h2.has-background,h3.has-background,h4.has-background,h5.has-background,h6.has-background{padding:1.25em 2.375em}h1.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h1.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h2.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h2.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h3.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h3.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h4.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h4.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h5.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h5.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h6.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]){rotate:180deg} </style> <style id='wp-block-list-inline-css'> ol,ul{box-sizing:border-box}:root :where(.wp-block-list.has-background){padding:1.25em 2.375em} </style> <link rel='stylesheet' id='wp-block-cover-css' href='https://piwik.pro/wp-includes/blocks/cover/style.min.css?ver=6.7' media='all' /> <style id='piwikpro-youtube-style-inline-css'> /*!***************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***! \***************************************************************************************************************************************************************************************************************************************/ .pp-youtube-embed { position: relative; display: block; width: 100%; padding-bottom: 0; transition: all 0.2s ease-in; } .pp-youtube-embed .pp-youtube-embed__cover { opacity: 1; visibility: visible; transition: opacity 0.2s ease-in; } .pp-youtube-embed iframe { position: absolute; top: 0; height: 100%; left: 0; width: 100% !important; display: none; border: none !important; } .pp-youtube-embed.pp-youtube-embed__consent-given { height: 0; padding-bottom: 56.25%; } .pp-youtube-embed.pp-youtube-embed__consent-given iframe { display: block; } .pp-youtube-embed.pp-youtube-embed__conver-hide .pp-youtube-embed__cover { opacity: 0; visibility: hidden; } /*# sourceMappingURL=style-index.css.map*/ </style> <style id='wp-block-post-content-inline-css'> .wp-block-post-content{display:flow-root} </style> <style id='wp-block-separator-inline-css'> @charset "UTF-8";.wp-block-separator{border:none;border-top:2px solid}:root :where(.wp-block-separator.is-style-dots){height:auto;line-height:1;text-align:center}:root :where(.wp-block-separator.is-style-dots):before{color:currentColor;content:"···";font-family:serif;font-size:1.5em;letter-spacing:2em;padding-left:2em}.wp-block-separator.is-style-dots{background:none!important;border:none!important} </style> <style id='wp-block-post-template-inline-css'> .wp-block-post-template{list-style:none;margin-bottom:0;margin-top:0;max-width:100%;padding:0}.wp-block-post-template.is-flex-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:1.25em}.wp-block-post-template.is-flex-container>li{margin:0;width:100%}@media (min-width:600px){.wp-block-post-template.is-flex-container.is-flex-container.columns-2>li{width:calc(50% - .625em)}.wp-block-post-template.is-flex-container.is-flex-container.columns-3>li{width:calc(33.33333% - .83333em)}.wp-block-post-template.is-flex-container.is-flex-container.columns-4>li{width:calc(25% - .9375em)}.wp-block-post-template.is-flex-container.is-flex-container.columns-5>li{width:calc(20% - 1em)}.wp-block-post-template.is-flex-container.is-flex-container.columns-6>li{width:calc(16.66667% - 1.04167em)}}@media (max-width:600px){.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid{grid-template-columns:1fr}}.wp-block-post-template-is-layout-constrained>li>.alignright,.wp-block-post-template-is-layout-flow>li>.alignright{float:right;margin-inline-end:0;margin-inline-start:2em}.wp-block-post-template-is-layout-constrained>li>.alignleft,.wp-block-post-template-is-layout-flow>li>.alignleft{float:left;margin-inline-end:2em;margin-inline-start:0}.wp-block-post-template-is-layout-constrained>li>.aligncenter,.wp-block-post-template-is-layout-flow>li>.aligncenter{margin-inline-end:auto;margin-inline-start:auto} </style> <style id='wp-block-categories-inline-css'> .wp-block-categories{box-sizing:border-box}.wp-block-categories.alignleft{margin-right:2em}.wp-block-categories.alignright{margin-left:2em}.wp-block-categories.wp-block-categories-dropdown.aligncenter{text-align:center}.wp-block-categories .wp-block-categories__label{display:block;width:100%} </style> <style id='wp-block-library-inline-css'> :root{--wp-admin-theme-color:#007cba;--wp-admin-theme-color--rgb:0,124,186;--wp-admin-theme-color-darker-10:#006ba1;--wp-admin-theme-color-darker-10--rgb:0,107,161;--wp-admin-theme-color-darker-20:#005a87;--wp-admin-theme-color-darker-20--rgb:0,90,135;--wp-admin-border-width-focus:2px;--wp-block-synced-color:#7a00df;--wp-block-synced-color--rgb:122,0,223;--wp-bound-block-color:var(--wp-block-synced-color)}@media (min-resolution:192dpi){:root{--wp-admin-border-width-focus:1.5px}}.wp-element-button{cursor:pointer}:root{--wp--preset--font-size--normal:16px;--wp--preset--font-size--huge:42px}:root .has-very-light-gray-background-color{background-color:#eee}:root .has-very-dark-gray-background-color{background-color:#313131}:root .has-very-light-gray-color{color:#eee}:root .has-very-dark-gray-color{color:#313131}:root .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background{background:linear-gradient(135deg,#00d084,#0693e3)}:root .has-purple-crush-gradient-background{background:linear-gradient(135deg,#34e2e4,#4721fb 50%,#ab1dfe)}:root .has-hazy-dawn-gradient-background{background:linear-gradient(135deg,#faaca8,#dad0ec)}:root .has-subdued-olive-gradient-background{background:linear-gradient(135deg,#fafae1,#67a671)}:root .has-atomic-cream-gradient-background{background:linear-gradient(135deg,#fdd79a,#004a59)}:root .has-nightshade-gradient-background{background:linear-gradient(135deg,#330968,#31cdcf)}:root .has-midnight-gradient-background{background:linear-gradient(135deg,#020381,#2874fc)}.has-regular-font-size{font-size:1em}.has-larger-font-size{font-size:2.625em}.has-normal-font-size{font-size:var(--wp--preset--font-size--normal)}.has-huge-font-size{font-size:var(--wp--preset--font-size--huge)}.has-text-align-center{text-align:center}.has-text-align-left{text-align:left}.has-text-align-right{text-align:right}#end-resizable-editor-section{display:none}.aligncenter{clear:both}.items-justified-left{justify-content:flex-start}.items-justified-center{justify-content:center}.items-justified-right{justify-content:flex-end}.items-justified-space-between{justify-content:space-between}.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}.screen-reader-text:focus{background-color:#ddd;clip:auto!important;clip-path:none;color:#444;display:block;font-size:1em;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}html :where(.has-border-color){border-style:solid}html :where([style*=border-top-color]){border-top-style:solid}html :where([style*=border-right-color]){border-right-style:solid}html :where([style*=border-bottom-color]){border-bottom-style:solid}html :where([style*=border-left-color]){border-left-style:solid}html :where([style*=border-width]){border-style:solid}html :where([style*=border-top-width]){border-top-style:solid}html :where([style*=border-right-width]){border-right-style:solid}html :where([style*=border-bottom-width]){border-bottom-style:solid}html :where([style*=border-left-width]){border-left-style:solid}html :where(img[class*=wp-image-]){height:auto;max-width:100%}:where(figure){margin:0 0 1em}html :where(.is-position-sticky){--wp-admin--admin-bar--position-offset:var(--wp-admin--admin-bar--height,0px)}@media screen and (max-width:600px){html :where(.is-position-sticky){--wp-admin--admin-bar--position-offset:0px}} </style> <style id='global-styles-inline-css'> :root{--wp--preset--aspect-ratio--square: 1;--wp--preset--aspect-ratio--4-3: 4/3;--wp--preset--aspect-ratio--3-4: 3/4;--wp--preset--aspect-ratio--3-2: 3/2;--wp--preset--aspect-ratio--2-3: 2/3;--wp--preset--aspect-ratio--16-9: 16/9;--wp--preset--aspect-ratio--9-16: 9/16;--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--color--primary: #006bd6;--wp--preset--color--primary-light: #0D95FD;--wp--preset--color--primary-dark: #0254C0;--wp--preset--color--secondary: #697077;--wp--preset--color--secondary-dark: #373D42;--wp--preset--color--secondary-extra-dark: #13171A;--wp--preset--color--transparent-black: rgba(0,0,0,.5);--wp--preset--color--transparent-dark-blue: rgba(87,179,250,.25);--wp--preset--color--grey-90: #242A2E;--wp--preset--color--grey-80: #373D42;--wp--preset--color--grey-70: #50565B;--wp--preset--color--grey-60: #697077;--wp--preset--color--grey-50: #868D95;--wp--preset--color--grey-40: #9FA5AD;--wp--preset--color--grey-30: #B9BFC7;--wp--preset--color--grey-20: #D5D9E0;--wp--preset--color--grey-10: #F2F4F8;--wp--preset--color--yellow-30: #FFEA99;--wp--preset--color--yellow-20: #FFF3C5;--wp--preset--color--yellow-10: #FFFBEB;--wp--preset--color--red-30: #EF9A9A;--wp--preset--color--red-20: #FFCDD2;--wp--preset--color--red-10: #FFECEE;--wp--preset--color--pink-30: #FFBDE4;--wp--preset--color--pink-20: #FFDCF0;--wp--preset--color--pink-10: #FFEEF7;--wp--preset--color--violet-30: #DAC2FC;--wp--preset--color--violet-20: #EEE2FF;--wp--preset--color--violet-10: #F6F0FD;--wp--preset--color--blue-30: #93CEFB;--wp--preset--color--blue-20: #BBDFFB;--wp--preset--color--blue-10: #E2F2FD;--wp--preset--color--cyan-30: #AEF6FF;--wp--preset--color--cyan-20: #BDF6FF;--wp--preset--color--cyan-10: #E0FBFF;--wp--preset--color--teal-10: #EFFAFA;--wp--preset--color--teal-20: #D7F3F3;--wp--preset--color--teal-30: #B7ECED;--wp--preset--color--green-30: #A5D6A7;--wp--preset--color--green-20: #C8E6C9;--wp--preset--color--green-10: #E8F5E9;--wp--preset--color--label-violet: #9C6ADE;--wp--preset--color--label-teal: #24ACAB;--wp--preset--color--label-red: #D32F2F;--wp--preset--color--label-orange: #FFA400;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 0.875em;--wp--preset--font-size--medium: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.244), 1rem);--wp--preset--font-size--large: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.488), 1.125rem);--wp--preset--font-size--x-large: clamp(25.014px, 1.563rem + ((1vw - 3.2px) * 2.071), 42px);--wp--preset--font-size--extra-large: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.732), 1.25rem);--wp--preset--font-family--inter: Inter;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--spacing--8: clamp(.75rem, 2vw, 1rem);--wp--preset--spacing--16: clamp(1.5rem, 5vw, 2rem);--wp--preset--spacing--32: clamp(1.8rem, 1.8rem + ((1vw - 0.48rem) * 2.885), 3rem);--wp--preset--spacing--64: clamp(2.5rem, 8vw, 4.5rem);--wp--preset--spacing--96: clamp(2.75rem, 13.6vw, 6.25rem);--wp--preset--spacing--128: clamp(3rem, 19.2vw, 8rem);--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);}:root { --wp--style--global--content-size: 1140px;--wp--style--global--wide-size: 1140px; }:where(body) { margin: 0; }.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }.wp-site-blocks > .alignright { float: right; margin-left: 2em; }.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }:where(.wp-site-blocks) > * { margin-block-start: var(--wp--preset--spacing--16); margin-block-end: 0; }:where(.wp-site-blocks) > :first-child { margin-block-start: 0; }:where(.wp-site-blocks) > :last-child { margin-block-end: 0; }:root { --wp--style--block-gap: var(--wp--preset--spacing--16); }:root :where(.is-layout-flow) > :first-child{margin-block-start: 0;}:root :where(.is-layout-flow) > :last-child{margin-block-end: 0;}:root :where(.is-layout-flow) > *{margin-block-start: var(--wp--preset--spacing--16);margin-block-end: 0;}:root :where(.is-layout-constrained) > :first-child{margin-block-start: 0;}:root :where(.is-layout-constrained) > :last-child{margin-block-end: 0;}:root :where(.is-layout-constrained) > *{margin-block-start: var(--wp--preset--spacing--16);margin-block-end: 0;}:root :where(.is-layout-flex){gap: var(--wp--preset--spacing--16);}:root :where(.is-layout-grid){gap: var(--wp--preset--spacing--16);}.is-layout-flow > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}.is-layout-flow > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}.is-layout-flow > .aligncenter{margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}.is-layout-constrained > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}.is-layout-constrained > .aligncenter{margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width: var(--wp--style--global--content-size);margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > .alignwide{max-width: var(--wp--style--global--wide-size);}body .is-layout-flex{display: flex;}.is-layout-flex{flex-wrap: wrap;align-items: center;}.is-layout-flex > :is(*, div){margin: 0;}body .is-layout-grid{display: grid;}.is-layout-grid > :is(*, div){margin: 0;}body{color: var(--wp--preset--color--black);font-family: var(--wp--preset--font-family--inter);font-size: var(--wp--preset--font-size--medium);font-weight: 400;letter-spacing: -0.4px;line-height: 1.5;padding-top: 0px;padding-right: 0px;padding-bottom: 0px;padding-left: 0px;}a:where(:not(.wp-element-button)){color: var(--wp--preset--color--primary);font-weight: 400;text-decoration: none;}:root :where(a:where(:not(.wp-element-button)):hover){text-decoration: underline;}h1, h2, h3, h4, h5, h6{font-style: normal;font-weight: 800;}h1{font-size: clamp(1.743rem, 1.743rem + ((1vw - 0.2rem) * 2.453), 3rem);line-height: 1.08;}h2{font-size: clamp(1.378rem, 1.378rem + ((1vw - 0.2rem) * 1.701), 2.25rem);line-height: 1.111;}h3{font-size: clamp(0.915rem, 0.915rem + ((1vw - 0.2rem) * 0.898), 1.375rem);line-height: 1.185;}h4{font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.488), 1.125rem);line-height: 1.222;}h5{font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.244), 1rem);line-height: 1.285;}h6{font-size: 0.875rem;line-height: 1.285;}:root :where(.wp-element-button, .wp-block-button__link){background-color: #32373c;border-width: 0;color: #fff;font-family: inherit;font-size: inherit;line-height: inherit;padding: calc(0.667em + 2px) calc(1.333em + 2px);text-decoration: none;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-primary-color{color: var(--wp--preset--color--primary) !important;}.has-primary-light-color{color: var(--wp--preset--color--primary-light) !important;}.has-primary-dark-color{color: var(--wp--preset--color--primary-dark) !important;}.has-secondary-color{color: var(--wp--preset--color--secondary) !important;}.has-secondary-dark-color{color: var(--wp--preset--color--secondary-dark) !important;}.has-secondary-extra-dark-color{color: var(--wp--preset--color--secondary-extra-dark) !important;}.has-transparent-black-color{color: var(--wp--preset--color--transparent-black) !important;}.has-transparent-dark-blue-color{color: var(--wp--preset--color--transparent-dark-blue) !important;}.has-grey-90-color{color: var(--wp--preset--color--grey-90) !important;}.has-grey-80-color{color: var(--wp--preset--color--grey-80) !important;}.has-grey-70-color{color: var(--wp--preset--color--grey-70) !important;}.has-grey-60-color{color: var(--wp--preset--color--grey-60) !important;}.has-grey-50-color{color: var(--wp--preset--color--grey-50) !important;}.has-grey-40-color{color: var(--wp--preset--color--grey-40) !important;}.has-grey-30-color{color: var(--wp--preset--color--grey-30) !important;}.has-grey-20-color{color: var(--wp--preset--color--grey-20) !important;}.has-grey-10-color{color: var(--wp--preset--color--grey-10) !important;}.has-yellow-30-color{color: var(--wp--preset--color--yellow-30) !important;}.has-yellow-20-color{color: var(--wp--preset--color--yellow-20) !important;}.has-yellow-10-color{color: var(--wp--preset--color--yellow-10) !important;}.has-red-30-color{color: var(--wp--preset--color--red-30) !important;}.has-red-20-color{color: var(--wp--preset--color--red-20) !important;}.has-red-10-color{color: var(--wp--preset--color--red-10) !important;}.has-pink-30-color{color: var(--wp--preset--color--pink-30) !important;}.has-pink-20-color{color: var(--wp--preset--color--pink-20) !important;}.has-pink-10-color{color: var(--wp--preset--color--pink-10) !important;}.has-violet-30-color{color: var(--wp--preset--color--violet-30) !important;}.has-violet-20-color{color: var(--wp--preset--color--violet-20) !important;}.has-violet-10-color{color: var(--wp--preset--color--violet-10) !important;}.has-blue-30-color{color: var(--wp--preset--color--blue-30) !important;}.has-blue-20-color{color: var(--wp--preset--color--blue-20) !important;}.has-blue-10-color{color: var(--wp--preset--color--blue-10) !important;}.has-cyan-30-color{color: var(--wp--preset--color--cyan-30) !important;}.has-cyan-20-color{color: var(--wp--preset--color--cyan-20) !important;}.has-cyan-10-color{color: var(--wp--preset--color--cyan-10) !important;}.has-teal-10-color{color: var(--wp--preset--color--teal-10) !important;}.has-teal-20-color{color: var(--wp--preset--color--teal-20) !important;}.has-teal-30-color{color: var(--wp--preset--color--teal-30) !important;}.has-green-30-color{color: var(--wp--preset--color--green-30) !important;}.has-green-20-color{color: var(--wp--preset--color--green-20) !important;}.has-green-10-color{color: var(--wp--preset--color--green-10) !important;}.has-label-violet-color{color: var(--wp--preset--color--label-violet) !important;}.has-label-teal-color{color: var(--wp--preset--color--label-teal) !important;}.has-label-red-color{color: var(--wp--preset--color--label-red) !important;}.has-label-orange-color{color: var(--wp--preset--color--label-orange) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-primary-background-color{background-color: var(--wp--preset--color--primary) !important;}.has-primary-light-background-color{background-color: var(--wp--preset--color--primary-light) !important;}.has-primary-dark-background-color{background-color: var(--wp--preset--color--primary-dark) !important;}.has-secondary-background-color{background-color: var(--wp--preset--color--secondary) !important;}.has-secondary-dark-background-color{background-color: var(--wp--preset--color--secondary-dark) !important;}.has-secondary-extra-dark-background-color{background-color: var(--wp--preset--color--secondary-extra-dark) !important;}.has-transparent-black-background-color{background-color: var(--wp--preset--color--transparent-black) !important;}.has-transparent-dark-blue-background-color{background-color: var(--wp--preset--color--transparent-dark-blue) !important;}.has-grey-90-background-color{background-color: var(--wp--preset--color--grey-90) !important;}.has-grey-80-background-color{background-color: var(--wp--preset--color--grey-80) !important;}.has-grey-70-background-color{background-color: var(--wp--preset--color--grey-70) !important;}.has-grey-60-background-color{background-color: var(--wp--preset--color--grey-60) !important;}.has-grey-50-background-color{background-color: var(--wp--preset--color--grey-50) !important;}.has-grey-40-background-color{background-color: var(--wp--preset--color--grey-40) !important;}.has-grey-30-background-color{background-color: var(--wp--preset--color--grey-30) !important;}.has-grey-20-background-color{background-color: var(--wp--preset--color--grey-20) !important;}.has-grey-10-background-color{background-color: var(--wp--preset--color--grey-10) !important;}.has-yellow-30-background-color{background-color: var(--wp--preset--color--yellow-30) !important;}.has-yellow-20-background-color{background-color: var(--wp--preset--color--yellow-20) !important;}.has-yellow-10-background-color{background-color: var(--wp--preset--color--yellow-10) !important;}.has-red-30-background-color{background-color: var(--wp--preset--color--red-30) !important;}.has-red-20-background-color{background-color: var(--wp--preset--color--red-20) !important;}.has-red-10-background-color{background-color: var(--wp--preset--color--red-10) !important;}.has-pink-30-background-color{background-color: var(--wp--preset--color--pink-30) !important;}.has-pink-20-background-color{background-color: var(--wp--preset--color--pink-20) !important;}.has-pink-10-background-color{background-color: var(--wp--preset--color--pink-10) !important;}.has-violet-30-background-color{background-color: var(--wp--preset--color--violet-30) !important;}.has-violet-20-background-color{background-color: var(--wp--preset--color--violet-20) !important;}.has-violet-10-background-color{background-color: var(--wp--preset--color--violet-10) !important;}.has-blue-30-background-color{background-color: var(--wp--preset--color--blue-30) !important;}.has-blue-20-background-color{background-color: var(--wp--preset--color--blue-20) !important;}.has-blue-10-background-color{background-color: var(--wp--preset--color--blue-10) !important;}.has-cyan-30-background-color{background-color: var(--wp--preset--color--cyan-30) !important;}.has-cyan-20-background-color{background-color: var(--wp--preset--color--cyan-20) !important;}.has-cyan-10-background-color{background-color: var(--wp--preset--color--cyan-10) !important;}.has-teal-10-background-color{background-color: var(--wp--preset--color--teal-10) !important;}.has-teal-20-background-color{background-color: var(--wp--preset--color--teal-20) !important;}.has-teal-30-background-color{background-color: var(--wp--preset--color--teal-30) !important;}.has-green-30-background-color{background-color: var(--wp--preset--color--green-30) !important;}.has-green-20-background-color{background-color: var(--wp--preset--color--green-20) !important;}.has-green-10-background-color{background-color: var(--wp--preset--color--green-10) !important;}.has-label-violet-background-color{background-color: var(--wp--preset--color--label-violet) !important;}.has-label-teal-background-color{background-color: var(--wp--preset--color--label-teal) !important;}.has-label-red-background-color{background-color: var(--wp--preset--color--label-red) !important;}.has-label-orange-background-color{background-color: var(--wp--preset--color--label-orange) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-primary-border-color{border-color: var(--wp--preset--color--primary) !important;}.has-primary-light-border-color{border-color: var(--wp--preset--color--primary-light) !important;}.has-primary-dark-border-color{border-color: var(--wp--preset--color--primary-dark) !important;}.has-secondary-border-color{border-color: var(--wp--preset--color--secondary) !important;}.has-secondary-dark-border-color{border-color: var(--wp--preset--color--secondary-dark) !important;}.has-secondary-extra-dark-border-color{border-color: var(--wp--preset--color--secondary-extra-dark) !important;}.has-transparent-black-border-color{border-color: var(--wp--preset--color--transparent-black) !important;}.has-transparent-dark-blue-border-color{border-color: var(--wp--preset--color--transparent-dark-blue) !important;}.has-grey-90-border-color{border-color: var(--wp--preset--color--grey-90) !important;}.has-grey-80-border-color{border-color: var(--wp--preset--color--grey-80) !important;}.has-grey-70-border-color{border-color: var(--wp--preset--color--grey-70) !important;}.has-grey-60-border-color{border-color: var(--wp--preset--color--grey-60) !important;}.has-grey-50-border-color{border-color: var(--wp--preset--color--grey-50) !important;}.has-grey-40-border-color{border-color: var(--wp--preset--color--grey-40) !important;}.has-grey-30-border-color{border-color: var(--wp--preset--color--grey-30) !important;}.has-grey-20-border-color{border-color: var(--wp--preset--color--grey-20) !important;}.has-grey-10-border-color{border-color: var(--wp--preset--color--grey-10) !important;}.has-yellow-30-border-color{border-color: var(--wp--preset--color--yellow-30) !important;}.has-yellow-20-border-color{border-color: var(--wp--preset--color--yellow-20) !important;}.has-yellow-10-border-color{border-color: var(--wp--preset--color--yellow-10) !important;}.has-red-30-border-color{border-color: var(--wp--preset--color--red-30) !important;}.has-red-20-border-color{border-color: var(--wp--preset--color--red-20) !important;}.has-red-10-border-color{border-color: var(--wp--preset--color--red-10) !important;}.has-pink-30-border-color{border-color: var(--wp--preset--color--pink-30) !important;}.has-pink-20-border-color{border-color: var(--wp--preset--color--pink-20) !important;}.has-pink-10-border-color{border-color: var(--wp--preset--color--pink-10) !important;}.has-violet-30-border-color{border-color: var(--wp--preset--color--violet-30) !important;}.has-violet-20-border-color{border-color: var(--wp--preset--color--violet-20) !important;}.has-violet-10-border-color{border-color: var(--wp--preset--color--violet-10) !important;}.has-blue-30-border-color{border-color: var(--wp--preset--color--blue-30) !important;}.has-blue-20-border-color{border-color: var(--wp--preset--color--blue-20) !important;}.has-blue-10-border-color{border-color: var(--wp--preset--color--blue-10) !important;}.has-cyan-30-border-color{border-color: var(--wp--preset--color--cyan-30) !important;}.has-cyan-20-border-color{border-color: var(--wp--preset--color--cyan-20) !important;}.has-cyan-10-border-color{border-color: var(--wp--preset--color--cyan-10) !important;}.has-teal-10-border-color{border-color: var(--wp--preset--color--teal-10) !important;}.has-teal-20-border-color{border-color: var(--wp--preset--color--teal-20) !important;}.has-teal-30-border-color{border-color: var(--wp--preset--color--teal-30) !important;}.has-green-30-border-color{border-color: var(--wp--preset--color--green-30) !important;}.has-green-20-border-color{border-color: var(--wp--preset--color--green-20) !important;}.has-green-10-border-color{border-color: var(--wp--preset--color--green-10) !important;}.has-label-violet-border-color{border-color: var(--wp--preset--color--label-violet) !important;}.has-label-teal-border-color{border-color: var(--wp--preset--color--label-teal) !important;}.has-label-red-border-color{border-color: var(--wp--preset--color--label-red) !important;}.has-label-orange-border-color{border-color: var(--wp--preset--color--label-orange) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;}.has-extra-large-font-size{font-size: var(--wp--preset--font-size--extra-large) !important;}.has-inter-font-family{font-family: var(--wp--preset--font-family--inter) !important;} </style> <style id='block-style-variation-styles-inline-css'> :root :where(.wp-block-button.is-style-outline--1 .wp-block-button__link){background: transparent none;border-color: currentColor;border-width: 2px;border-style: solid;color: currentColor;padding-top: 0.667em;padding-right: 1.33em;padding-bottom: 0.667em;padding-left: 1.33em;} </style> <style id='wp-emoji-styles-inline-css'> img.wp-smiley, img.emoji { display: inline !important; border: none !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 0.07em !important; vertical-align: -0.1em !important; background: none !important; padding: 0 !important; } </style> <style id='core-block-supports-inline-css'> .wp-elements-33fe82ab0dd28f06c6c7f216c27bade0 a:where(:not(.wp-element-button)){color:var(--wp--preset--color--white);}.wp-container-core-group-is-layout-1{flex-wrap:nowrap;gap:var(--wp--preset--spacing--16);justify-content:space-between;}.wp-container-core-group-is-layout-2 > .alignfull{margin-right:calc(0px * -1);margin-left:calc(0px * -1);}.wp-container-core-group-is-layout-3 > .alignfull{margin-right:calc(var(--wp--preset--spacing--8) * -1);margin-left:calc(var(--wp--preset--spacing--8) * -1);}.wp-container-core-navigation-is-layout-1{flex-wrap:nowrap;}.wp-container-core-group-is-layout-9{flex-wrap:nowrap;gap:var(--wp--preset--spacing--8);justify-content:flex-end;}.wp-container-core-group-is-layout-11{flex-wrap:nowrap;justify-content:space-between;}.wp-container-core-buttons-is-layout-2{gap:var(--wp--preset--spacing--8);}.wp-container-core-group-is-layout-20{flex-wrap:nowrap;gap:4px;}.wp-container-core-group-is-layout-21 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-21 > * + *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-22 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-22 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-columns-is-layout-1{flex-wrap:nowrap;}.wp-container-core-group-is-layout-24 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-24 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-2{top:calc(0px + var(--wp-admin--admin-bar--position-offset, 0px));position:sticky;z-index:10;}.wp-container-core-group-is-layout-26{flex-wrap:nowrap;justify-content:center;}.wp-container-core-group-is-layout-27{flex-wrap:nowrap;justify-content:flex-start;}.wp-container-core-column-is-layout-4 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-4 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-columns-is-layout-2{flex-wrap:nowrap;}.wp-container-core-group-is-layout-28 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-29{flex-wrap:nowrap;}.wp-container-core-group-is-layout-30 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-30 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-30 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-group-is-layout-31{flex-wrap:nowrap;gap:0;justify-content:flex-start;align-items:stretch;}.wp-container-core-group-is-layout-32{flex-wrap:nowrap;}.wp-container-core-group-is-layout-33 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-33 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-33 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-group-is-layout-34{flex-wrap:nowrap;gap:0;justify-content:flex-start;align-items:stretch;}.wp-container-core-group-is-layout-35{flex-wrap:nowrap;}.wp-container-core-group-is-layout-36 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-36 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-36 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-group-is-layout-37{flex-wrap:nowrap;gap:0;justify-content:flex-start;align-items:stretch;}.wp-elements-ce648b1b6af2909c0ac8e62a523f5a4d a:where(:not(.wp-element-button)){color:var(--wp--preset--color--black);}.wp-container-core-group-is-layout-38 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-38 > * + *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-39{flex-wrap:nowrap;align-items:center;}.wp-container-core-cover-is-layout-1 > .alignfull{margin-right:calc(0px * -1);margin-left:calc(0px * -1);}.wp-container-core-group-is-layout-41{flex-wrap:nowrap;}.wp-container-core-group-is-layout-42 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-42 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-42 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-group-is-layout-43{flex-wrap:nowrap;gap:0;justify-content:flex-start;align-items:stretch;}.wp-container-core-buttons-is-layout-4{justify-content:center;}.wp-container-core-group-is-layout-45 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-45 > * + *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-46{gap:var(--wp--preset--spacing--8);}.wp-container-core-group-is-layout-47 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-47 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-47 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-group-is-layout-48 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-48 > * + *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-49{gap:var(--wp--preset--spacing--8);}.wp-container-core-group-is-layout-50 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-50 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-50 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-elements-49fa4119cc5c2308c68d75609517aadc a:where(:not(.wp-element-button)){color:var(--wp--preset--color--black);}.wp-container-core-group-is-layout-51{gap:4px;}.wp-container-core-group-is-layout-52{gap:6px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-53{gap:4px;}.wp-container-core-group-is-layout-54{gap:6px;flex-direction:column;align-items:flex-end;}.wp-container-core-columns-is-layout-3{flex-wrap:nowrap;}.wp-elements-3e4aefefedcf42a77b28820350f55a44 a:where(:not(.wp-element-button)){color:var(--wp--preset--color--black);}.wp-container-core-group-is-layout-56 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-56 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-56 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-elements-53278e4015333ce466906d692e56109c a:where(:not(.wp-element-button)){color:var(--wp--preset--color--black);}.wp-container-core-group-is-layout-57 > .alignfull{margin-right:calc(var(--wp--preset--spacing--16) * -1);margin-left:calc(var(--wp--preset--spacing--16) * -1);}.wp-container-core-group-is-layout-57 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-57 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-columns-is-layout-4{flex-wrap:nowrap;}.wp-container-core-group-is-layout-60 > .alignfull{margin-right:calc(var(--wp--preset--spacing--8) * -1);margin-left:calc(var(--wp--preset--spacing--8) * -1);}.wp-container-core-group-is-layout-60 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-60 > * + *{margin-block-start:var(--wp--preset--spacing--64);margin-block-end:0;}.wp-container-core-navigation-is-layout-2{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-61 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-61 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-9 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-9 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-navigation-is-layout-3{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-62 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-62 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-navigation-is-layout-4{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-63 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-63 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-10 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-10 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-navigation-is-layout-5{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-64 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-64 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-navigation-is-layout-6{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-65 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-65 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-11 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-11 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-navigation-is-layout-7{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-66 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-66 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-12 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-12 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-columns-is-layout-5{flex-wrap:nowrap;gap:var(--wp--preset--spacing--16) var(--wp--preset--spacing--8);}.wp-container-core-navigation-is-layout-8{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-67 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-67 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-13 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-13 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-navigation-is-layout-9{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-68 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-68 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-14 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-14 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-navigation-is-layout-10{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-69 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-69 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-15 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-15 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-navigation-is-layout-11{gap:2px;flex-direction:column;align-items:flex-start;}.wp-container-core-group-is-layout-70 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-70 > * + *{margin-block-start:var(--wp--preset--spacing--8);margin-block-end:0;}.wp-container-core-column-is-layout-16 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-column-is-layout-16 > * + *{margin-block-start:var(--wp--preset--spacing--16);margin-block-end:0;}.wp-container-core-columns-is-layout-6{flex-wrap:nowrap;gap:var(--wp--preset--spacing--16) var(--wp--preset--spacing--8);}.wp-container-core-group-is-layout-72 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-72 > * + *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-73{flex-wrap:nowrap;gap:var(--wp--preset--spacing--16);}.wp-container-core-navigation-is-layout-12{gap:6px;justify-content:flex-end;}.wp-container-core-columns-is-layout-7{flex-wrap:nowrap;gap:var(--wp--preset--spacing--16) 2em;}.wp-container-core-group-is-layout-74 > .alignfull{margin-right:calc(var(--wp--preset--spacing--8) * -1);margin-left:calc(var(--wp--preset--spacing--8) * -1);}.wp-container-core-group-is-layout-74 > *{margin-block-start:0;margin-block-end:0;}.wp-container-core-group-is-layout-74 > * + *{margin-block-start:var(--wp--preset--spacing--64);margin-block-end:0;} </style> <style id='wp-block-template-skip-link-inline-css'> .skip-link.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; } .skip-link.screen-reader-text:focus { background-color: #eee; clip: auto !important; clip-path: none; color: #444; display: block; font-size: 1em; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; } </style> <link rel='stylesheet' id='cc-heading-anchor-css' href='https://piwik.pro/wp-content/plugins/cc-heading-anchor/assets/css/style.css?ver=1.0.0' media='all' /> <link rel='stylesheet' id='theme-style-css' href='https://piwik.pro/wp-content/themes/main/assets/dist/css/style.css?ver=1732097677' media='all' /> <link rel='stylesheet' id='line-numbers-css' href='https://piwik.pro/wp-content/plugins/cc-syntax-highlight/line-numbers/highlightjs-line-numbers.min.css?ver=1.2.3' media='all' /> <link rel='stylesheet' id='tomorrow-night-css' href='https://piwik.pro/wp-content/plugins/cc-syntax-highlight/highlight/tomorrow-night.css?ver=1.2.3' media='all' /> <link rel='stylesheet' id='copy-to-clipboard-css' href='https://piwik.pro/wp-content/plugins/cc-syntax-highlight/clipboard/clipboard.css?ver=1.2.3' media='all' /> <script src="https://piwik.pro/wp-content/plugins/pp-plugin-youtube/build/front-script.js?ver=d485041adfacb19debf9" id="piwikpro-youtube-view-script-js" defer data-wp-strategy="defer"></script> <script src="https://piwik.pro/wp-content/plugins/cc-heading-anchor/build/js/script.js?ver=1.0.0" id="cc-heading-anchor-js"></script> <script src="https://piwik.pro/wp-content/plugins/stop-user-enumeration/frontend/js/frontend.js?ver=1.6.3" id="stop-user-enumeration-js" defer data-wp-strategy="defer"></script> <script src="https://piwik.pro/wp-content/plugins/cc-syntax-highlight/highlight/highlight.pack.js?ver=1.2.3" id="highlight-js"></script> <script src="https://piwik.pro/wp-content/plugins/cc-syntax-highlight/line-numbers/highlightjs-line-numbers.min.js?ver=1.2.3" id="line-numbers-js"></script> <script src="https://piwik.pro/wp-includes/js/jquery/jquery.min.js?ver=3.7.1" id="jquery-core-js"></script> <script src="https://piwik.pro/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.4.1" id="jquery-migrate-js"></script> <link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://piwik.pro/xmlrpc.php?rsd" /> <meta name="generator" content="WordPress 6.7" /> <link rel='shortlink' href='https://piwik.pro/?p=28370' /> <link rel="alternate" title="oEmbed (JSON)" type="application/json+oembed" href="https://piwik.pro/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fpiwik.pro%2Fblog%2Fhow-to-track-single-page-applications-spas%2F" /> <link rel="alternate" title="oEmbed (XML)" type="text/xml+oembed" href="https://piwik.pro/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fpiwik.pro%2Fblog%2Fhow-to-track-single-page-applications-spas%2F&format=xml" /> <meta name="google-site-verification" content="MbvqEqLW68SvZYkp04VIPXk85GYi1xlMmZimeIePJv8" /><link rel="alternate" hreflang="en-US" href="https://piwik.pro/blog/how-to-track-single-page-applications-spas/" /><link rel="alternate" hreflang="de-DE" href="https://piwikpro.de/blog/3-wege-single-page-applications-spas-mittels-tag-manager-zu-tracken-ein-schritt-fur-schritt-guide/" /><link rel="alternate" hreflang="nl-NL" href="https://piwikpro.nl/blog/hoe-single-page-applications-spas-tracken/" /><script type="importmap" id="wp-importmap"> {"imports":{"@wordpress\/interactivity":"https:\/\/piwik.pro\/wp-includes\/js\/dist\/script-modules\/interactivity\/index.min.js?ver=06b8f695ef48ab2d9277"}} </script> <script type="module" src="https://piwik.pro/wp-includes/js/dist/script-modules/block-library/image/view.min.js?ver=acfec7b3c0be4a859b31" id="@wordpress/block-library/image/view-js-module"></script> <script type="module" src="https://piwik.pro/wp-includes/js/dist/script-modules/block-library/navigation/view.min.js?ver=8ff192874fc8910a284c" id="@wordpress/block-library/navigation/view-js-module"></script> <link rel="modulepreload" href="https://piwik.pro/wp-includes/js/dist/script-modules/interactivity/index.min.js?ver=06b8f695ef48ab2d9277" id="@wordpress/interactivity-js-modulepreload"><style class='wp-fonts-local'> @font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter400.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter400.woff') format('woff');} @font-face{font-family:Inter;font-style:italic;font-weight:400;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter400_italic.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter400_italic.woff') format('woff');} @font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter600.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter600.woff') format('woff');} @font-face{font-family:Inter;font-style:italic;font-weight:600;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter600_italic.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter600_italic.woff') format('woff');} @font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter700.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter700.woff') format('woff');} @font-face{font-family:Inter;font-style:italic;font-weight:700;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter700_italic.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter700_italic.woff') format('woff');} @font-face{font-family:Inter;font-style:normal;font-weight:800;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter800.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter800.woff') format('woff');} @font-face{font-family:Inter;font-style:italic;font-weight:800;font-display:swap;src:url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter800_italic.woff2') format('woff2'), url('https://piwik.pro/wp-content/themes/main/assets/fonts/inter800_italic.woff') format('woff');} </style> <link rel="icon" href="https://piwik.pro/wp-content/uploads/2024/04/favicon.png" sizes="32x32" /> <link rel="icon" href="https://piwik.pro/wp-content/uploads/2024/04/favicon.png" sizes="192x192" /> <link rel="apple-touch-icon" href="https://piwik.pro/wp-content/uploads/2024/04/favicon.png" /> <meta name="msapplication-TileImage" content="https://piwik.pro/wp-content/uploads/2024/04/favicon.png" /> </head> <body class="post-template-default single single-post postid-28370 single-format-standard wp-custom-logo wp-embed-responsive"> <script> (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("&")):""; tags.async=!0,tags.src="https://piwik.pro/containers/"+id+".js"+qPString,scripts.parentNode.insertBefore(tags,scripts); !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=[].slice.call(arguments,0);"string"==typeof a[0]&&window[dataLayerName].push({event:n+"."+i+":"+a[0],parameters:[].slice.call(arguments,1)})}}(i[c])}(window,"ppms",["tm","cm"]); })(window,document,'dataLayer','819958cc-4f49-11e7-963e-000d3a2a450a'); </script> <div class="wp-site-blocks"><header class="wp-block-template-part"> <div class="wp-block-group alignfull nav_action_bar has-primary-background-color has-background is-layout-constrained wp-container-core-group-is-layout-3 wp-block-group-is-layout-constrained" style="padding-right:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8)"> <a class="pp-link pp-link--wide pp-link__box" href="https://campaign.piwik.pro/webinar-protect-paid-ads-from-fraud/" target="_blank" rel="noreferrer noopener"> <div class="wp-block-group has-white-color has-text-color has-link-color wp-elements-33fe82ab0dd28f06c6c7f216c27bade0 is-layout-constrained wp-container-core-group-is-layout-2 wp-block-group-is-layout-constrained" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--8);padding-right:0;padding-bottom:var(--wp--preset--spacing--8);padding-left:0"> <div class="wp-block-group is-content-justification-space-between is-nowrap is-layout-flex wp-container-core-group-is-layout-1 wp-block-group-is-layout-flex" style="margin-top:0;margin-bottom:0"> <p><strong>Live webinar:</strong> How to protect your paid ads from fraud and fake traffic – Sign up now</p> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image size-large"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/white/arrow_right.svg" alt=""/></figure> </div> </div> </div> </a> </div> <div class="wp-block-group navigation-main is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group is-content-justification-space-between is-nowrap is-layout-flex wp-container-core-group-is-layout-11 wp-block-group-is-layout-flex"> <div class="wp-block-group navigation-main__logo is-layout-constrained wp-block-group-is-layout-constrained"> <figure class="wp-block-image size-large is-resized navigation-main__logo--dark"><a href="/"><img decoding="async" src="/wp-content/themes/main/assets/images/pp-logo_dark.svg" alt="ico_logo_main" style="width:116px;height:undefinedpx"/></a></figure> </div> <div class="wp-block-group navigation-main__menu is-layout-constrained wp-block-group-is-layout-constrained"><nav class="no-wrap wp-block-navigation is-nowrap is-layout-flex wp-container-core-navigation-is-layout-1 wp-block-navigation-is-layout-flex" aria-label="Main"><ul class="wp-block-navigation__container no-wrap wp-block-navigation"><li data-wp-context="{ "submenuOpenedBy": { "click": false, "hover": false, "focus": false }, "type": "submenu" }" data-wp-interactive="core/navigation" data-wp-on--focusout="actions.handleMenuFocusout" data-wp-on--keydown="actions.handleMenuKeydown" data-wp-on-async--mouseenter="actions.openMenuOnHover" data-wp-on-async--mouseleave="actions.closeMenuOnHover" data-wp-watch="callbacks.initMenu" tabindex="-1" class=" wp-block-navigation-item has-child open-on-hover-click wp-block-navigation-submenu"><a class="wp-block-navigation-item__content">Product</a><button data-wp-bind--aria-expanded="state.isMenuOpen" data-wp-on-async--click="actions.toggleMenuOnClick" aria-label="Product submenu" class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" ><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path></svg></button><ul data-wp-on-async--focus="actions.openMenuOnFocus" class="wp-block-navigation__submenu-container wp-block-navigation-submenu"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="#"><span class="wp-block-navigation-item__label">Modules</span></a></li><li class=" wp-block-navigation-item navigation-main__menu-element-with-icon web-analytics wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/web-analytics/"><span class="wp-block-navigation-item__label">Analytics</span></a></li><li class=" wp-block-navigation-item navigation-main__menu-element-with-icon tag-manager wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/tag-manager/"><span class="wp-block-navigation-item__label">Tag Manager</span></a></li><li class=" wp-block-navigation-item navigation-main__menu-element-with-icon customer-data-platform wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/customer-data-platform/"><span class="wp-block-navigation-item__label">Customer Data Platform</span></a></li><li class=" wp-block-navigation-item navigation-main__menu-element-with-icon consent-manager wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/gdpr-consent-manager/"><span class="wp-block-navigation-item__label">Consent Manager</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="#"><span class="wp-block-navigation-item__label">Learn more</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/integrations/"><span class="wp-block-navigation-item__label">Integrations</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://changelog.piwik.pro/"><span class="wp-block-navigation-item__label">Changelog</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/services/"><span class="wp-block-navigation-item__label">Professional services</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/privacy-security/"><span class="wp-block-navigation-item__label">Privacy & security</span></a></li></ul></li><li data-wp-context="{ "submenuOpenedBy": { "click": false, "hover": false, "focus": false }, "type": "submenu" }" data-wp-interactive="core/navigation" data-wp-on--focusout="actions.handleMenuFocusout" data-wp-on--keydown="actions.handleMenuKeydown" data-wp-on-async--mouseenter="actions.openMenuOnHover" data-wp-on-async--mouseleave="actions.closeMenuOnHover" data-wp-watch="callbacks.initMenu" tabindex="-1" class=" wp-block-navigation-item has-child open-on-hover-click wp-block-navigation-submenu"><a class="wp-block-navigation-item__content">Solutions</a><button data-wp-bind--aria-expanded="state.isMenuOpen" data-wp-on-async--click="actions.toggleMenuOnClick" aria-label="Solutions submenu" class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" ><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path></svg></button><ul data-wp-on-async--focus="actions.openMenuOnFocus" class="wp-block-navigation__submenu-container wp-block-navigation-submenu"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/analytics-for-web-mobile/"><span class="wp-block-navigation-item__label">Analytics for web & mobile</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/product-analytics/"><span class="wp-block-navigation-item__label">Analytics for product teams</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/tag-management/"><span class="wp-block-navigation-item__label">Tag management</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/data-activation/"><span class="wp-block-navigation-item__label">Data activation</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/privacy-compliance/"><span class="wp-block-navigation-item__label">Privacy compliance</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/hipaa/"><span class="wp-block-navigation-item__label">HIPAA-compliant analytics</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/ecommerce-analytics/"><span class="wp-block-navigation-item__label">Ecommerce analytics</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/server-side-tracking-tagging/"><span class="wp-block-navigation-item__label">Server-side tracking & tagging</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="#"><span class="wp-block-navigation-item__label">Compare</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/ga4-knowledge-hub/"><span class="wp-block-navigation-item__label">GA4 knowledge hub</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/switch-from-matomo/"><span class="wp-block-navigation-item__label">Switch from Matomo</span></a></li></ul></li><li data-wp-context="{ "submenuOpenedBy": { "click": false, "hover": false, "focus": false }, "type": "submenu" }" data-wp-interactive="core/navigation" data-wp-on--focusout="actions.handleMenuFocusout" data-wp-on--keydown="actions.handleMenuKeydown" data-wp-on-async--mouseenter="actions.openMenuOnHover" data-wp-on-async--mouseleave="actions.closeMenuOnHover" data-wp-watch="callbacks.initMenu" tabindex="-1" class=" wp-block-navigation-item has-child open-on-hover-click wp-block-navigation-submenu"><a class="wp-block-navigation-item__content">Resources</a><button data-wp-bind--aria-expanded="state.isMenuOpen" data-wp-on-async--click="actions.toggleMenuOnClick" aria-label="Resources submenu" class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" ><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path></svg></button><ul data-wp-on-async--focus="actions.openMenuOnFocus" class="wp-block-navigation__submenu-container wp-block-navigation-submenu"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/resources/"><span class="wp-block-navigation-item__label">Content library</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/webinars/"><span class="wp-block-navigation-item__label">Webinars</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/resources/#success-stories"><span class="wp-block-navigation-item__label">Success stories</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://piwik.pro/video-tutorials/"><span class="wp-block-navigation-item__label">Video tutorials</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://help.piwik.pro/" target="_blank" ><span class="wp-block-navigation-item__label">Help center</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://community.piwik.pro/" target="_blank" ><span class="wp-block-navigation-item__label">Community forum</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/glossary/"><span class="wp-block-navigation-item__label">Glossary</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://developers.piwik.pro/en/latest/" target="_blank" ><span class="wp-block-navigation-item__label">Developers & API</span></a></li></ul></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/"><span class="wp-block-navigation-item__label">Blog</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/pricing/"><span class="wp-block-navigation-item__label">Pricing</span></a></li><li data-wp-context="{ "submenuOpenedBy": { "click": false, "hover": false, "focus": false }, "type": "submenu" }" data-wp-interactive="core/navigation" data-wp-on--focusout="actions.handleMenuFocusout" data-wp-on--keydown="actions.handleMenuKeydown" data-wp-on-async--mouseenter="actions.openMenuOnHover" data-wp-on-async--mouseleave="actions.closeMenuOnHover" data-wp-watch="callbacks.initMenu" tabindex="-1" class=" wp-block-navigation-item has-child open-on-hover-click wp-block-navigation-submenu"><a class="wp-block-navigation-item__content">Contact</a><button data-wp-bind--aria-expanded="state.isMenuOpen" data-wp-on-async--click="actions.toggleMenuOnClick" aria-label="Contact submenu" class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" ><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path></svg></button><ul data-wp-on-async--focus="actions.openMenuOnFocus" class="wp-block-navigation__submenu-container wp-block-navigation-submenu"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/contact/"><span class="wp-block-navigation-item__label">Contact</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/media/"><span class="wp-block-navigation-item__label">Media</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/partners/"><span class="wp-block-navigation-item__label">Partners</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/careers/"><span class="wp-block-navigation-item__label">Careers</span></a></li></ul></li></ul></nav></div> <div class="wp-block-group navigation-main__side-options is-content-justification-right is-nowrap is-layout-flex wp-container-core-group-is-layout-9 wp-block-group-is-layout-flex"> <div class="wp-block-group navigation-main__get-demo is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex"> <div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="/request-a-demo/">Get a demo</a></div> </div> </div> <div class="wp-block-group navigation-main__lang-selector is-layout-constrained wp-block-group-is-layout-constrained"><div class="wp-block-group navigation-main__lang-selector is-layout-constrained wp-block-group-is-layout-constrained"> <nav class="wp-block-navigation is-layout-flex wp-block-navigation-is-layout-flex"> <ul class="wp-block-navigation__container wp-block-navigation"> <li class=" wp-block-navigation-item has-child open-on-hover-click wp-block-navigation-submenu"> <a class="wp-block-navigation-item__content">EN</a> <button class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle"> <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true" focusable="false"> <path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path> </svg> </button> <ul class="wp-block-navigation__submenu-container wp-block-navigation-submenu"> <li class="wp-block-navigation-item wp-block-navigation-link"> <a class="wp-block-navigation-item__content" href="https://piwikpro.de/blog/3-wege-single-page-applications-spas-mittels-tag-manager-zu-tracken-ein-schritt-fur-schritt-guide/"> <span class="wp-block-navigation-item__label">DE</span> </a> </li> <li class="wp-block-navigation-item wp-block-navigation-link"> <a class="wp-block-navigation-item__content" href="https://piwikpro.nl/blog/hoe-single-page-applications-spas-tracken/"> <span class="wp-block-navigation-item__label">NL</span> </a> </li> <li class="wp-block-navigation-item wp-block-navigation-link"> <a class="wp-block-navigation-item__content" href="https://piwikpro.fr"> <span class="wp-block-navigation-item__label">FR</span> </a> </li> <li class="wp-block-navigation-item wp-block-navigation-link"> <a class="wp-block-navigation-item__content" href="https://piwikpro.pl"> <span class="wp-block-navigation-item__label">PL</span> </a> </li> <li class="wp-block-navigation-item wp-block-navigation-link"> <a class="wp-block-navigation-item__content" href="https://piwikpro.se"> <span class="wp-block-navigation-item__label">SV</span> </a> </li> <li class="wp-block-navigation-item wp-block-navigation-link"> <a class="wp-block-navigation-item__content" href="https://piwikpro.it"> <span class="wp-block-navigation-item__label">IT</span> </a> </li> <li class="wp-block-navigation-item wp-block-navigation-link"> <a class="wp-block-navigation-item__content" href="https://piwikpro.dk"> <span class="wp-block-navigation-item__label">DA</span> </a> </li> </ul> </li> </ul> </nav> </div></div> <div class="wp-block-group navigation-main__login is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image"><a href="/login/"><img decoding="async" src="https://piwik.pro/wp-content/plugins/pp-block-icon/build/images/black/login.svg" alt=""/></a></figure> </div> <p>My account</p> </div> </div> <div class="wp-block-group navigation-main__burger is-layout-constrained wp-block-group-is-layout-constrained"> <figure class="wp-block-image size-large is-resized"><img decoding="async" src="/wp-content/themes/main/assets/images/ico_burger_dark.svg" alt="ico_burger_dark" style="width:30px"/></figure> </div> </div> </div> <div class="wp-block-group navigation-main-mobile is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group navigation-main-mobile__menu-wrapper is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-buttons navigation-main-mobile__buttons is-layout-flex wp-container-core-buttons-is-layout-2 wp-block-buttons-is-layout-flex"> <div class="wp-block-button is-style-outline is-style-outline--1"><a class="wp-block-button__link wp-element-button" href="#">Get a demo</a></div> <div class="wp-block-button is-style-fill"><a class="wp-block-button__link wp-element-button" href="#">My account</a></div> </div> </div> <div class="wp-block-group navigation-main-mobile__close is-layout-constrained wp-block-group-is-layout-constrained"> <figure class="wp-block-image size-large is-resized"><img decoding="async" src="/wp-content/themes/main/assets/images/ico_close-dark.svg" alt="ico_close" style="width:24px"/></figure> </div> <div class="wp-block-group navigation-main__menu is-layout-constrained wp-block-group-is-layout-constrained"></div> <div class="wp-block-group navigation-main__lang-selector is-layout-constrained wp-block-group-is-layout-constrained"></div> </div> </div> </header> <div id="main-content" class="wp-block-group main-content main_content bg-blob bg-blob--top is-layout-constrained wp-container-core-group-is-layout-60 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--96);padding-right:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--96);padding-left:var(--wp--preset--spacing--8)"> <div class="wp-block-group is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-20 wp-block-group-is-layout-flex"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image"><img src="/wp-content/plugins/pp-block-icon/build/images/blue/arrow_left.svg" alt=""/></figure> </div> <div class="wp-block-group is-layout-constrained wp-block-group-is-layout-constrained" style="font-style:normal;font-weight:700"> <p class="has-text-align-left pp-action-link" style="font-style:normal;font-weight:700"><a href="/blog/">Back to blog</a></p> </div> </div> <div class="wp-block-columns is-layout-flex wp-container-core-columns-is-layout-1 wp-block-columns-is-layout-flex"> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:66.66%"><h1 class="wp-block-post-title">3 ways to track single-page applications (SPAs) with Tag Manager: a step-by-step guide</h1> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-22 wp-block-group-is-layout-constrained"><div class="taxonomy-category wp-block-post-terms"><a href="https://piwik.pro/blog/category/analytics/" rel="tag">Analytics</a><span class="wp-block-post-terms__separator">, </span><a href="https://piwik.pro/blog/category/tag-manager/" rel="tag">Tag Manager</a></div> <div class="wp-block-group has-small-font-size is-layout-constrained wp-container-core-group-is-layout-21 wp-block-group-is-layout-constrained"> <p>Written by <span class="pp-authors">Karolina Lubowicka, Karolina Matuszewska</span></p> <p>Published April 14, 2020</p> </div> </div> </div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:33.33%"><figure class="aligncenter wp-block-post-featured-image"><img width="620" height="400" src="https://piwik.pro/wp-content/uploads/2020/02/2020-02-03_how-to-track-single-page-applications-spas_blog-1.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" style="object-fit:cover;" decoding="async" fetchpriority="high" srcset="https://piwik.pro/wp-content/uploads/2020/02/2020-02-03_how-to-track-single-page-applications-spas_blog-1.png 620w, https://piwik.pro/wp-content/uploads/2020/02/2020-02-03_how-to-track-single-page-applications-spas_blog-1-300x194.png 300w" sizes="(max-width: 620px) 100vw, 620px" /></figure></div> </div> </div> <div class="wp-block-group is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-columns is-layout-flex wp-container-core-columns-is-layout-4 wp-block-columns-is-layout-flex"> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:66.66%"> <div id="single-post_content" class="wp-block-group single-post_content is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group scrollable-social-share-widget is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group scrollable-social-share-widget__socials-wrapper is-layout-constrained wp-container-core-group-is-layout-24 wp-block-group-is-layout-constrained wp-container-2 is-position-sticky" style="padding-top:var(--wp--preset--spacing--8)"> <a class="pp-link" href="http://www.facebook.com/share.php?u=https://piwik.pro/blog/how-to-track-single-page-applications-spas/&title=3+ways+to+track+single-page+applications+%28SPAs%29+with+Tag+Manager%3A+a+step-by-step+guide" target="_blank" rel="noreferrer noopener"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image"><img src="/wp-content/plugins/pp-block-icon/build/images/blue/s_facebook.svg" alt="" style="object-fit:cover"/></figure> </div> </a> <a class="pp-link" href="http://twitter.com/intent/tweet?text=3+ways+to+track+single-page+applications+%28SPAs%29+with+Tag+Manager%3A+a+step-by-step+guide:%20https://piwik.pro/blog/how-to-track-single-page-applications-spas/" target="_blank" rel="noreferrer noopener"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image"><img src="/wp-content/plugins/pp-block-icon/build/images/blue/s_x_circle.svg" alt=""/></figure> </div> </a> <a class="pp-link" href="http://www.linkedin.com/shareArticle?mini=true&url=https://piwik.pro/blog/how-to-track-single-page-applications-spas/&title=3+ways+to+track+single-page+applications+%28SPAs%29+with+Tag+Manager%3A+a+step-by-step+guide&source=" target="_blank" rel="noreferrer noopener"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image"><img src="/wp-content/plugins/pp-block-icon/build/images/blue/s_linkedin.svg" alt=""/></figure> </div> </a> </div> </div> <div class="entry-content wp-block-post-content is-layout-flow wp-block-post-content-is-layout-flow"> <p><strong>Single-page applications (SPAs)</strong> are said to provide stellar performance and user experience. However, to make sure that your SPA does the job, you need to measure how users interact with it. In this post, we’ll tell you how to track SPAs so as to gather as much data as possible with the least amount of work.</p> <h2 class="wp-block-heading" id="h-the-right-approach-to-tracking-spas">The right approach to tracking SPAs<a href="#h-the-right-approach-to-tracking-spas" class="heading-anchor"></a></h2> <p>SPAs react to user interactions and dynamically rewrite the content of the current page instead of loading a new one. Those traits contribute to a smooth experience, but at the same time they make SPAs tricky to track with regular web analytics. How are we supposed to analyze pages that never really reload?<br> <br>The answer is: with a Tag Manager. Using a Tag Manager lets you go beyond standard browser-reload based tracking without the need for creating your own method of observing and interpreting user interactions. </p> <h2 class="wp-block-heading" id="h-creating-a-tracking-plan-is-key">Creating a tracking plan is key<a href="#h-creating-a-tracking-plan-is-key" class="heading-anchor"></a></h2> <p>Before we dive into the practicalities, let’s talk about a tracking plan. In the case of SPAs, it will be different than with multi-page apps. Since there are no real pageviews, you need to determine what actions you want to consider as pageviews – screen reload, view reload or maybe something else? Those will be your key interactions. <br> <br>More granular actions should be tracked as custom events, and key custom events should be considered as conversions. </p> <h3 class="wp-block-heading" id="h-and-what-if-i-can-t-assign-conversions">And what if I can’t assign conversions?<a href="#h-and-what-if-i-can-t-assign-conversions" class="heading-anchor"></a></h3> <p>Well, at first, you may struggle with deciding which actions to label as “conversions”. Fortunately, with <strong>Piwik PRO</strong> you don’t have to decide right away. You can wait for ideas to bubble up as you gather new information about user behavior in your app. </p> <div class="wp-block-group blogpost-lead-magnet-box has-grey-10-background-color has-background is-layout-constrained wp-container-core-group-is-layout-28 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <div class="wp-block-columns are-vertically-aligned-center is-layout-flex wp-container-core-columns-is-layout-2 wp-block-columns-is-layout-flex"> <div class="wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:25%"> <div class="wp-block-group is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-26 wp-block-group-is-layout-flex"> <figure class="wp-block-image size-full"><a href="https://landing.piwik.pro/tag-manager-vendors-comparison/"><img decoding="async" src="https://piwik.pro/wp-content/uploads/2022/11/Cover-70-point-comparison-of-6-tag-managers-EN.png" alt="" class="wp-image-41682"/></a></figure> </div> </div> <div class="wp-block-column is-vertically-aligned-center is-layout-flow wp-container-core-column-is-layout-4 wp-block-column-is-layout-flow" style="flex-basis:75%"> <div class="wp-block-group is-style-default has-small-font-size is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-27 wp-block-group-is-layout-flex"> <p class="has-white-color has-label-red-background-color has-text-color has-background has-small-font-size" style="padding-top:6px;padding-right:6px;padding-bottom:6px;padding-left:6px;letter-spacing:0.2px;line-height:1;text-transform:uppercase"><strong>read also</strong></p> </div> <p class="h3">Comparison of 7 tag managers – 70 factors from tag types to privacy</p> <p>Understand the differences between Piwik PRO Tag Manager, Google Tag Manager, Tealium IQ Tag Management, Segment, TagCommander, Matomo Tag Manager and Ensighten Manage</p> <div class="wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex"> <div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="https://landing.piwik.pro/tag-manager-vendors-comparison/">Download your copy now</a></div> </div> </div> </div> </div> <h3 class="wp-block-heading" id="h-building-conversion-funnels">Building conversion funnels<a href="#h-building-conversion-funnels" class="heading-anchor"></a></h3> <p>After you have a hierarchy of pageviews and events in place, it’s time to group them into conversion funnels. This will give you an understanding of what the customer journey in your application looks like. You’ll see where users convert and drop off.<br> <br>Not sure what steps your funnel should contain? Thankfully, you don’t have to define that right away either. In Piwik PRO you can build funnels out of any type of pageview and custom event. In addition, funnels are:</p> <ul class="wp-block-list"> <li>Retroactive – they present historical data tracked before the funnel was defined</li> <li>Available immediately after creation</li> <li>Flexible – they don’t require a goal as a last step </li> <li>Filtrable – they allow you to define each step in the funnel at a very granular level</li> </ul> <p>No matter when you decide to configure your funnel, you’ll always have access to a full dataset of both historical and recent user actions. </p> <p>You can also examine how visitors use your application with the user flow report. Learn more about it from <a href="https://help.piwik.pro/support/analytics-new/user-flow/" target="_blank" aria-label="this helpful guide (opens in a new tab)" rel="noopener">this helpful guide</a>.</p> <div class="wp-block-group blogpost-info-box has-border-color has-black-border-color has-yellow-10-background-color has-background is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-31 wp-block-group-is-layout-flex" style="border-width:1px"> <div class="wp-block-group has-black-background-color has-background is-nowrap is-layout-flex wp-container-core-group-is-layout-29 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8)"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image aligncenter is-resized"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/white/interjection.fill.svg" alt="" style="object-fit:cover;width:42px;height:42px"/></figure> </div> </div> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-30 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <p>Make sure you document your tracking plan. You can use a spreadsheet or any other format you’d like. Write down each event, page view and stage of the funnel and use it throughout the whole process. That gives you better control over your actions and makes sure everyone involved is on the same page.<br><br>Learn more about it here: </p> <ul class="wp-block-list"> <li><a href="https://piwik.pro/blog/analytics-implementation-in-12-steps-an-exhaustive-guide-tracking-plan-included/">Analytics Implementation in 12 Steps: An Exhaustive Guide (Tracking Plan Included!)</a></li> <li><a href="https://piwik.pro/blog/business-requirements-web-analytics-strategy/">10 Steps to Gather Business Requirements for a Robust Web Analytics Strategy</a></li> </ul> </div> </div> <h2 class="wp-block-heading" id="h-how-to-integrate-tag-manager-with-an-spa">How to integrate Tag Manager with an SPA<a href="#h-how-to-integrate-tag-manager-with-an-spa" class="heading-anchor"></a></h2> <p>Once you’ve established a hierarchy of events and pageviews, it’s time to consider how Tag Manager will communicate with your site and to put your tracking plan into action.<br> <br>There are at least three ways to go:</p> <ul class="wp-block-list"> <li><a href="#manual-integration">Manual integration</a></li> <li><a href="#history-change">History change trigger</a></li> <li><a href="#data-layer">Data layer</a></li> </ul> <h3 class="wp-block-heading" id="manual-integration">Manual integration – slow and burdensome<a href="#manual-integration" class="heading-anchor"></a></h3> <p>With manual integration, all events are detected by Tag Manager configurations that capture either specific events or groups of dynamically parameterized events. <br> <br>It’s definitely more labor intensive, since you have to consider each scenario, screen and type of control separately. It also requires lots of testing to ensure that the tags are working properly in all cases. For instance, the same button may appear on multiple views, but it may not always be the same object for <a href="https://piwik.pro/tag-manager/">Tag Manager</a> – this depends on how the app works with its HTML code.<br> <br>What’s more, changes in the app’s code may affect the performance of your implementation. In the long run, this can multiply implementation costs depending on the amount of work put into those tweaks.<br> <br>But if for some reason your organization requires this kind of approach, here’s where you will find more guidance:</p> <ul class="wp-block-list"> <li><a aria-label=" (opens in a new tab)" href="https://help.piwik.pro/support/questions/why-is-virtual-page-view-important-for-funnel-analytics/" target="_blank" rel="noopener">Why virtual page view is important in funnel analytics</a></li> <li><a aria-label=" (opens in a new tab)" href="https://help.piwik.pro/support/tag-manager/piwik-pro-custom-event/" target="_blank" rel="noopener">Piwik PRO custom event tag</a></li> <li><a aria-label=" (opens in a new tab)" href="https://help.piwik.pro/support/good-practices/custom-events-business-use-cases/" target="_blank" rel="noopener">Custom event use cases</a></li> </ul> <h3 class="wp-block-heading" id="history-change">History change – fast and convenient<a href="#history-change" class="heading-anchor"></a></h3> <p>A far quicker and easier way is using the History change trigger. It’s perfect for tracking SPAs that update the URL in the address bar when visitors are navigating through them. <br><br>When you enable a History change listener, it will monitor the browser history and wait for the moment when the URL of your SPA changes. There’s no need for manual integrations, a special library, workarounds, ugly hacks or tampering with your application’s code. All this contributes to the durable popularity of this method.<br><br>Here’s how to configure a virtual page view tag with the use of the History change trigger in Piwik PRO Tag Manager:<br></p> <h4 class="wp-block-heading" id="h-1-create-a-new-document-variable-and-type-in-title-as-the-variable-content">1. Create a new Document variable and type in “title” as the variable content:<br><a href="#h-1-create-a-new-document-variable-and-type-in-title-as-the-variable-content" class="heading-anchor"></a></h4> <figure data-wp-context="{"imageId":"674348dc27b0f"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/04/image4.png" alt="" class="wp-image-30017" style="width:700px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <h4 class="wp-block-heading" id="h-2-then-create-a-new-history-change-spa-trigger">2. Then, create a new History change (SPA) trigger:<br><a href="#h-2-then-create-a-new-history-change-spa-trigger" class="heading-anchor"></a></h4> <figure data-wp-context="{"imageId":"674348dc2878e"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/04/image6.png" alt="" class="wp-image-30018" style="width:615px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <h4 class="wp-block-heading" id="h-3-next-create-a-new-piwik-pro-virtual-page-view-tag">3. Next, create a new Piwik PRO Virtual Page View tag:<a href="#h-3-next-create-a-new-piwik-pro-virtual-page-view-tag" class="heading-anchor"></a></h4> <figure data-wp-context="{"imageId":"674348dc29349"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/04/image1.png" alt="" class="wp-image-30019" style="width:700px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>Set up the tag:</p> <figure data-wp-context="{"imageId":"674348dc29f8a"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/04/image7.png" alt="" class="wp-image-30020" style="width:615px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>In the URL field, type in:<em> {{ Page Url }}</em><br><br>In the Document Title field, type in:<em> {{ Document title }}</em><br><br>Ignore the Referrer URL field as it’s not necessary in this case.<br></p> <h4 class="wp-block-heading" id="h-4-add-a-relationship-between-the-newly-created-tag-and-trigger">4. Add a relationship between the newly created tag and trigger:<br><a href="#h-4-add-a-relationship-between-the-newly-created-tag-and-trigger" class="heading-anchor"></a></h4> <figure data-wp-context="{"imageId":"674348dc2b019"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/04/image5.png" alt="" class="wp-image-30021" style="width:700px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>Then, save the tag. From here it’s a matter of testing the container, debugging and publishing the changes, then you’re done!</p> <div class="wp-block-group blogpost-info-box has-border-color has-black-border-color has-green-10-background-color has-background is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-34 wp-block-group-is-layout-flex" style="border-width:1px"> <div class="wp-block-group has-black-background-color has-background is-nowrap is-layout-flex wp-container-core-group-is-layout-32 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8)"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image aligncenter is-resized"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/white/check.fill.svg" alt="" style="object-fit:cover;width:42px;height:42px"/></figure> </div> </div> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-33 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <p>By default, the tag fires on all history changes, but you can adjust its conditions so that the tag fires for a certain page. To learn more, be sure to check out <a href="https://help.piwik.pro/support/tag-manager/history-change-trigger/">this article about the History Change trigger</a> in our help center.</p> </div> </div> <h3 class="wp-block-heading" id="data-layer">Data layer – reliable and future-proof<a href="#data-layer" class="heading-anchor"></a></h3> <p>The History change trigger is easy to configure, but it won’t be useful for all types of single page apps, as some of them don’t present user paths in the browser’s address bar. For example, there are SPAs that don’t update the browser history. This is when data layer tracking comes in handy.<br> <br>In case you’re not familiar with the notion: a data layer is an ordered array of events that can be posted by your SPA and picked up by Tag Manager as they occur.<br> <br>In this way, you can pass almost every action a user performs on your site, app or portal through the data layer, then a Tag Manager can translate the details into descriptions of various types of events in your analytics.<br> <br>This is what a page view communicated to a data layer typically looks like</p> <pre class="wp-block-code"><code>window.dataLayer.push({ event: "analytics_interaction", event_type: "screen_load", screen_url: "/contact-us-page", screen_title: "Contact us", screen_previous_url:"/home" });</code></pre> <p>And this is a custom event representing a granular interaction within such a pageview:</p> <pre class="wp-block-code"><code>window.dataLayer.push({ event: "analytics_interaction", event_type: "button_click", button_type: "CTA", button_name: "Contact us" }); </code></pre> <p>When you use a data layer, Tag Manager picks up every interaction posted to the data layer instead of scraping the information passively from the website. You don’t have to worry about missing out on data, because data layer implementation is consistent throughout your whole application. Every view and UI control posts events in the same way, so you don’t have to create separate tags for each page or button.<br> <br>That contributes to greater data accuracy.<br> <br>Other advantages of a data layer are: </p> <ul class="wp-block-list"> <li>it’s stable and won’t be affected by changes to the app layout</li> <li>it simplifies implementation architecture, reducing long-term maintenance and development costs</li> <li>it makes you vendor-agnostic, because you use the code of your application to post events, so any solution can pick them up in the same way from the data layer</li> </ul> <p>All this makes it a great way to track SPAs.<br> <br>However, maintaining data layer standards takes work. To ensure your data layer does its job, you need to remember about applying the proper labelling of tracked actions. Your event descriptions and variable names should be as generic and consistent as possible. Otherwise, it will be hard to make sense out of them. <br> <br>This is where the potential drawback of this solution comes from – if your naming convention is not consistent, your IT department will have to fix it. And if you don’t have data layer documentation, you’ll need to create it. This will, however, pay off in the long term.</p> <div class="wp-block-group blogpost-info-box has-border-color has-black-border-color has-green-10-background-color has-background is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-37 wp-block-group-is-layout-flex" style="border-width:1px"> <div class="wp-block-group has-black-background-color has-background is-nowrap is-layout-flex wp-container-core-group-is-layout-35 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8)"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image aligncenter is-resized"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/white/check.fill.svg" alt="" style="object-fit:cover;width:42px;height:42px"/></figure> </div> </div> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-36 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <p>If you want to read more about data layers and how they can benefit your analytics, be sure to check out this blog post: <br><a href="https://piwik.pro/blog/data-layer-helps-improve-analytics-strategy/">How Data Layer Helps You Improve Your Analytics Strategy</a></p> </div> </div> <p>Now, let’s get to more practical applications of data layers in Tag Management Systems.</p> <h3 class="wp-block-heading" id="h-1-creating-custom-events">1. Creating custom events<a href="#h-1-creating-custom-events" class="heading-anchor"></a></h3> <p>Pushing a new event to the data layer lets you use the event trigger. This helps you define more precisely when a tag is fired. For example, you could create a new event when a user finishes watching a video and then show a pop-up to this user.<br> <br>Here’s how to create a custom event using a data layer in Piwik PRO Tag Manager. <br> <br>In our case, the data layer’s <em>“event”</em> value is what you need to create your trigger, and <em>“event_type, “button_type”</em> and <em>“button_name”</em> are the values you’ll use to set up your variables.</p> <pre class="wp-block-code"><code>window.dataLayer.push({ event: "analytics_interaction", // MAIN TRIGGER CONDITION event_type: "button_click", // VARIABLE - USED IN TRIGGER CONDITION button_type: "CTA", // VARIABLE - USED IN EVENT DESCRIPTION button_name: "Contact us?" // VARIABLE - USED IN EVENT DESCRIPTION });</code></pre> <p>First, map each variable you want to use to describe the event with Tag Manager Variables. This will allow you to choose them from the dropdown list when configuring your tag.</p> <figure data-wp-context="{"imageId":"674348dc30b18"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/03/image1.png" alt="" class="wp-image-29392" style="width:700px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>After it’s done, create a tag using the Custom Event template:</p> <figure data-wp-context="{"imageId":"674348dc317f5"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/03/image3.png" alt="" class="wp-image-29401" style="width:523px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>And choose the correct variables from the dropdown list:</p> <figure data-wp-context="{"imageId":"674348dc325df"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/03/image4.png" alt="" class="wp-image-29404" style="width:700px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>Now, it’s time to define the trigger. You can narrow it down using conditions – in this case, you would define templates (pageview, custom event) for different data layer events. To do so, choose the <em>“Event”</em> type of trigger and configure your conditions:</p> <figure data-wp-context="{"imageId":"674348dc332d6"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/03/image2.png" alt="" class="wp-image-29397" style="width:700px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>Voila!</p> <h3 class="wp-block-heading" id="h-2-building-funnels-out-of-a-data-layer-s-custom-events-and-virtual-page-views">2. Building funnels out of a data layer’s custom events and virtual page views<a href="#h-2-building-funnels-out-of-a-data-layer-s-custom-events-and-virtual-page-views" class="heading-anchor"></a></h3> <p>Let’s say you want to track users who sign up in a transactional system and make a money transfer. By breaking the process down, we get the following stages:</p> <ul class="wp-block-list"> <li>arriving at the dashboard</li> <li>viewing a new transfer screen</li> <li>sending a transfer</li> <li>receiving a transfer confirmation</li> <li>making another transfer</li> </ul> <p>Here what this setup would look like in Piwik PRO:</p> <figure data-wp-context="{"imageId":"674348dc358db"}" data-wp-interactive="core/image" class="wp-block-image aligncenter size-full is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://piwik.pro/wp-content/uploads/2020/03/image5.png" alt="" class="wp-image-29408" style="width:700px"/><button class="lightbox-trigger" type="button" aria-haspopup="dialog" aria-label="Enlarge image" data-wp-init="callbacks.initTriggerButton" data-wp-on-async--click="actions.showLightbox" data-wp-style--right="state.imageButtonRight" data-wp-style--top="state.imageButtonTop" > <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12"> <path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" /> </svg> </button></figure> <p>And here’s how you do it:</p> <div class="wp-block-group is-layout-constrained wp-block-group-is-layout-constrained"> <div class="pp-youtube-embed--wrapper"><div class="pp-youtube-embed"><iframe data-src="sIwOTYKQ36g"></iframe><div class="pp-youtube-embed__cover"> <div class="wp-block-cover is-light pp-youtube-embed__consent" style="padding-top:var(--wp--preset--spacing--32);padding-right:0;padding-bottom:var(--wp--preset--spacing--32);padding-left:0"><span aria-hidden="true" class="wp-block-cover__background has-background-dim"></span><div class="wp-block-cover__inner-container is-layout-constrained wp-container-core-cover-is-layout-1 wp-block-cover-is-layout-constrained"> <div class="wp-block-group has-blue-10-background-color has-background is-nowrap is-layout-flex wp-container-core-group-is-layout-39 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--16)"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image is-resized"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/blue/signed_document_ALT02.svg" alt="" style="width:64px"/></figure> </div> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-38 wp-block-group-is-layout-constrained"> <p class="has-black-color has-text-color has-link-color wp-elements-ce648b1b6af2909c0ac8e62a523f5a4d" style="font-size:clamp(0.984em, 0.984rem + ((1vw - 0.2em) * 1.007), 1.5em);font-style:normal;font-weight:900;line-height:1.2">This content is hosted by a third party (YouTube). By clicking the button below, you consent to loading the video.</p> </div> </div> </div></div> </div></div></div> </div> <h2 class="wp-block-heading" id="h-meta-setup-in-tag-manager">Meta setup in Tag Manager<a href="#h-meta-setup-in-tag-manager" class="heading-anchor"></a></h2> <p>A meta setup in Tag Manager is a way to create a setup for a group of sites or apps. It is also a way to apply it to all of them at once. It includes tags, triggers, and variables. This tool is helpful if you want to run an advertising campaign or simultaneously display the same message on multiple sites or apps.</p> <div class="wp-block-group blogpost-info-box has-border-color has-black-border-color has-blue-10-background-color has-background is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-43 wp-block-group-is-layout-flex" style="border-width:1px"> <div class="wp-block-group has-black-background-color has-background is-nowrap is-layout-flex wp-container-core-group-is-layout-41 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8)"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image aligncenter is-resized"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/white/question.fill.svg" alt="" style="object-fit:cover;width:42px;height:42px"/></figure> </div> </div> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-42 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <p>You need a meta site/app to use a meta setup. If you want to create a setup for a group of sites, you first need to <a href="https://help.piwik.pro/support/reports/meta-sites/" target="_blank" aria-label=" (opens in a new tab)" rel="noopener">create a meta site</a>.</p> </div> </div> <p>Let’s look at use cases for meta setup in Tag Manager:</p> <ul class="wp-block-list"> <li>Meta setup allows displaying a popup (or another form of promotion) across multiple sites based on one meta site (with the ability to customize it per site via variables).</li> <li>You can easily install marketing tools for all sites that are a part of the meta site.</li> <li>You can quickly create one shareable setup for multiple SharePoint sites (in many cases, most of the setup is identical).</li> </ul> <p>Using a meta setup for your meta sites means simplified tag management. It allows fast-track tag management by importing configurations and using them across your SPAs.</p> <h2 class="wp-block-heading" id="h-final-thoughts">Final thoughts<a href="#h-final-thoughts" class="heading-anchor"></a></h2> <p>We hope this post has shown you how much easier and more pleasant it is to track an SPA using the data layer. This method will require some work at the beginning (unification of names), but you’ll soon see it’s the gift that keeps on giving.<br> <br>If you’ve got any questions, make sure to contact us. Our team will be happy to show you how using a data layer to track your SPA can benefit your organization.</p> <div class="wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-4 wp-block-buttons-is-layout-flex"> <div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="https://piwik.pro/request-a-demo/">Request a demo</a></div> </div> <h2 class="wp-block-heading" id="h-"></h2> </div></div> <div id="post_footer" class="wp-block-group post_footer is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group has-blue-10-background-color has-background is-layout-constrained wp-container-core-group-is-layout-47 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <div class="wp-block-group is-layout-flex wp-container-core-group-is-layout-46 wp-block-group-is-layout-flex"> <figure class="wp-block-image size-full is-resized is-style-rounded"><img width="256" height="256" src="/wp-content/uploads/2024/03/k.lubowicka.jpeg" alt="" class="wp-image-3534" style="width:48px" srcset="https://piwik.pro/wp-content/uploads/2024/03/k.lubowicka.jpeg 256w, https://piwik.pro/wp-content/uploads/2024/03/k.lubowicka-150x150.jpeg 150w" sizes="(max-width: 256px) 100vw, 256px" /></figure> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-45 wp-block-group-is-layout-constrained"> <h3 class="wp-block-heading" id="karolina-lubowicka">Karolina Lubowicka</h3> <p class="has-small-font-size">Senior Content Marketer and Social Media Specialist</p> </div> </div> <p class="has-small-font-size">An experienced copywriter who takes complex topics of data privacy & GDPR and makes them understandable for all. <a href="https://www.linkedin.com/in/karolinalubowicka/" target="_blank" rel="noreferrer noopener">LinkedIn Profile</a></p> </div> <div class="wp-block-group has-blue-10-background-color has-background is-layout-constrained wp-container-core-group-is-layout-50 wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <div class="wp-block-group is-layout-flex wp-container-core-group-is-layout-49 wp-block-group-is-layout-flex"> <figure class="wp-block-image size-full is-resized is-style-rounded"><img width="512" height="512" src="/wp-content/uploads/2024/03/k.matuszewska.jpeg" alt="" class="wp-image-4197" style="object-fit:cover;width:48px;height:48px" srcset="https://piwik.pro/wp-content/uploads/2024/03/k.matuszewska.jpeg 512w, https://piwik.pro/wp-content/uploads/2024/03/k.matuszewska-300x300.jpeg 300w, https://piwik.pro/wp-content/uploads/2024/03/k.matuszewska-150x150.jpeg 150w" sizes="(max-width: 512px) 100vw, 512px" /></figure> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-48 wp-block-group-is-layout-constrained"> <h3 class="wp-block-heading" id="karolina-matuszewska">Karolina Matuszewska</h3> <p class="has-small-font-size">Senior Content Marketer</p> </div> </div> <p class="has-small-font-size">Writer and content marketer. Transforms technical jargon into engaging and informative articles.</p> </div> <hr class="wp-block-separator has-alpha-channel-opacity"/> <div class="wp-block-columns has-link-color wp-elements-49fa4119cc5c2308c68d75609517aadc is-layout-flex wp-container-core-columns-is-layout-3 wp-block-columns-is-layout-flex"> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow"> <div class="wp-block-query is-layout-flow wp-block-query-is-layout-flow"><ul class="wp-block-post-template is-layout-flow wp-block-post-template-is-layout-flow"><li class="wp-block-post post-29975 post type-post status-publish format-standard has-post-thumbnail hentry category-analytics category-data-privacy"> <div class="wp-block-group is-vertical is-content-justification-left is-layout-flex wp-container-core-group-is-layout-52 wp-block-group-is-layout-flex"> <p class="has-small-font-size" style="font-style:normal;font-weight:700;text-transform:uppercase">Previous article</p> <h4 class="wp-block-post-title"><a href="https://piwik.pro/blog/dpia-for-google-analytics/" target="_self" >Should you run a DPIA for Google Analytics?</a></h4> <div class="wp-block-group has-small-font-size is-layout-flex wp-container-core-group-is-layout-51 wp-block-group-is-layout-flex"> <p>April 10, 2020 by <span class="pp-authors">Karolina Lubowicka</span></p> </div> </div> </li></ul></div> </div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow"> <div class="wp-block-query is-layout-flow wp-block-query-is-layout-flow"><ul class="wp-block-post-template is-layout-flow wp-block-post-template-is-layout-flow"><li class="wp-block-post post-31595 post type-post status-publish format-standard has-post-thumbnail hentry category-analytics"> <div class="wp-block-group is-vertical is-content-justification-right is-layout-flex wp-container-core-group-is-layout-54 wp-block-group-is-layout-flex"> <p class="has-small-font-size" style="font-style:normal;font-weight:700;text-transform:uppercase">Next article</p> <h4 class="wp-block-post-title"><a href="https://piwik.pro/blog/analyze-multi-channel-attribution-affiliate-marketing-raw-data/" target="_self" >How to analyze multi-channel attribution in affiliate marketing using raw data</a></h4> <div class="wp-block-group has-small-font-size is-layout-flex wp-container-core-group-is-layout-53 wp-block-group-is-layout-flex"> <p>June 05, 2020 by <span class="pp-authors">Karolina Matuszewska, Lennart Ruigrok</span></p> </div> </div> </li></ul></div> </div> </div> </div> </div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:33.33%"> <div id="blog_sidesection" class="wp-block-group blog_sidesection is-layout-constrained wp-block-group-is-layout-constrained"> <form role="search" method="get" action="/" class="wp-block-search__no-button wp-block-search"><label class="wp-block-search__label screen-reader-text" for="wp-block-search__input-3">Search</label><div class="wp-block-search__inside-wrapper "><input class="wp-block-search__input" id="wp-block-search__post-type" placeholder="Search" value="" type="search" name="s" required=""><input type="hidden" name="post_type" value="post"></div></form> <div id="single-post-custom-content-tag-manager"> </div> <div class="wp-block-group has-border-color has-grey-20-border-color has-white-background-color has-background has-link-color wp-elements-3e4aefefedcf42a77b28820350f55a44 is-layout-constrained wp-container-core-group-is-layout-56 wp-block-group-is-layout-constrained" style="border-width:1px;padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <h4 class="wp-block-heading" id="h-categories">Categories</h4> <ul style="font-style:normal;font-weight:400; padding-top:0;padding-bottom:0;padding-left:0;padding-right:0;" class="wp-block-categories-list wp-block-categories has-small-font-size"> <li class="cat-item cat-item-6"><a href="https://piwik.pro/blog/category/analytics/">Analytics</a> (181) </li> <li class="cat-item cat-item-49"><a href="https://piwik.pro/blog/category/banking-finance/">Banking & finance</a> (13) </li> <li class="cat-item cat-item-7"><a href="https://piwik.pro/blog/category/comparisons/">Comparisons</a> (12) </li> <li class="cat-item cat-item-54"><a href="https://piwik.pro/blog/category/consent-manager/">Consent Manager</a> (7) </li> <li class="cat-item cat-item-41"><a href="https://piwik.pro/blog/category/conversion-optimization/">Conversion optimization</a> (24) </li> <li class="cat-item cat-item-53"><a href="https://piwik.pro/blog/category/customer-data-platform/">Customer Data Platform</a> (16) </li> <li class="cat-item cat-item-47"><a href="https://piwik.pro/blog/category/data-management/">Data management</a> (56) </li> <li class="cat-item cat-item-11"><a href="https://piwik.pro/blog/category/data-privacy-security/">Data Privacy & Security</a> (1) </li> <li class="cat-item cat-item-40"><a href="https://piwik.pro/blog/category/data-privacy/">Data privacy & security</a> (121) </li> <li class="cat-item cat-item-48"><a href="https://piwik.pro/blog/category/gdpr/">GDPR</a> (51) </li> <li class="cat-item cat-item-51"><a href="https://piwik.pro/blog/category/government/">Government</a> (8) </li> <li class="cat-item cat-item-52"><a href="https://piwik.pro/blog/category/healthcare/">Healthcare</a> (17) </li> <li class="cat-item cat-item-44"><a href="https://piwik.pro/blog/category/interviews/">Interviews</a> (24) </li> <li class="cat-item cat-item-45"><a href="https://piwik.pro/blog/category/news-releases/">News & releases</a> (42) </li> <li class="cat-item cat-item-43"><a href="https://piwik.pro/blog/category/content-personalization/">Personalization</a> (22) </li> <li class="cat-item cat-item-42"><a href="https://piwik.pro/blog/category/product-best-practices/">Product best practices</a> (25) </li> <li class="cat-item cat-item-46"><a href="https://piwik.pro/blog/category/tag-manager/">Tag Manager</a> (10) </li> <li class="cat-item cat-item-50"><a href="https://piwik.pro/blog/category/use-cases/">Use cases</a> (35) </li> </ul></div> <div class="wp-block-group has-border-color has-grey-20-border-color has-white-background-color has-background has-link-color wp-elements-53278e4015333ce466906d692e56109c is-layout-constrained wp-container-core-group-is-layout-57 wp-block-group-is-layout-constrained" style="border-width:1px;padding-top:var(--wp--preset--spacing--16);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--16);padding-left:var(--wp--preset--spacing--16)"> <h4 class="wp-block-heading">Similar posts</h4> <ul class="has-small-font-size related-posts__list wp-block-list"> <li><a href="https://piwik.pro/blog/tag-manager-comparison/">70-point comparison of 7 tag managers</a></li> <li><a href="https://piwik.pro/blog/analytics-cdp-help-track-full-customer-journey/">How Analytics & Customer Data Platform Can Help You Track the Full Customer Journey</a></li> <li><a href="https://piwik.pro/blog/4-sound-reasons-to-choose-marketing-platform-use-cases/">4 Sound Reasons to Choose Digital Marketing Platform (+Use Cases)</a></li> <li><a href="https://piwik.pro/blog/how-consent-manager-and-tag-manager-work-together-for-your-gdpr-compliance/">How cookie consent manager and tag manager work together for your GDPR compliance</a></li> </ul> </div> </div> </div> </div> </div> </div> <footer class="wp-block-template-part"> <div class="wp-block-group alignfull main-footer has-white-color has-black-background-color has-text-color has-background is-layout-constrained wp-container-core-group-is-layout-74 wp-block-group-is-layout-constrained" id="main-footer" style="padding-top:var(--wp--preset--spacing--64);padding-right:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--64);padding-left:var(--wp--preset--spacing--8)"> <div class="wp-block-group is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-columns has-small-font-size is-layout-flex wp-container-core-columns-is-layout-5 wp-block-columns-is-layout-flex" style="padding-right:0;padding-left:0"> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-9 wp-block-column-is-layout-flow" style="border-right-color:var(--wp--preset--color--secondary-dark);border-right-width:1px"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-61 wp-block-group-is-layout-constrained"> <h6 class="wp-block-heading" id="product" style="text-transform:uppercase">Product</h6> <nav class="is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-2 wp-block-navigation-is-layout-flex" aria-label="Footer – Product"><ul class="wp-block-navigation__container is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/web-analytics/"><span class="wp-block-navigation-item__label">Analytics</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/tag-manager/"><span class="wp-block-navigation-item__label">Tag Manager</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/gdpr-consent-manager/"><span class="wp-block-navigation-item__label">Consent Manager</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/customer-data-platform/"><span class="wp-block-navigation-item__label">Customer Data Platform</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/pricing/"><span class="wp-block-navigation-item__label">Pricing</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/integrations/"><span class="wp-block-navigation-item__label">Integrations</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://piwik.pro/changelog/"><span class="wp-block-navigation-item__label">Changelog</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/privacy-security/"><span class="wp-block-navigation-item__label">Privacy & security</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/services/"><span class="wp-block-navigation-item__label">Professional services</span></a></li></ul></nav></div> </div> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-10 wp-block-column-is-layout-flow" style="border-right-color:var(--wp--preset--color--secondary-dark);border-right-width:1px"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-62 wp-block-group-is-layout-constrained"> <h6 class="wp-block-heading" id="solutions" style="text-transform:uppercase">Solutions</h6> <nav class="is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-3 wp-block-navigation-is-layout-flex" aria-label="Footer - Solutions"><ul class="wp-block-navigation__container is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/analytics-for-web-mobile/"><span class="wp-block-navigation-item__label">Analytics for web & mobile</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/product-analytics/"><span class="wp-block-navigation-item__label">Analytics for product teams</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/tag-management/"><span class="wp-block-navigation-item__label">Tag management</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/data-activation/"><span class="wp-block-navigation-item__label">Data activation</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/privacy-compliance/"><span class="wp-block-navigation-item__label">Privacy compliance</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/hipaa/"><span class="wp-block-navigation-item__label">HIPAA-compliant analytics</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/ecommerce-analytics/"><span class="wp-block-navigation-item__label">Ecommerce analytics</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/server-side-tracking-tagging/"><span class="wp-block-navigation-item__label">Server-side tracking & tagging</span></a></li></ul></nav></div> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-63 wp-block-group-is-layout-constrained"> <h6 class="wp-block-heading" id="switch-from" style="text-transform:uppercase">Switch from</h6> <nav class="is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-4 wp-block-navigation-is-layout-flex" aria-label="Footer - Switch from"><ul class="wp-block-navigation__container is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/switch-from-google-analytics/"><span class="wp-block-navigation-item__label">Google Analytics</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/switch-from-matomo/"><span class="wp-block-navigation-item__label">Matomo</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/switch-from-at-internet/"><span class="wp-block-navigation-item__label">AT Internet</span></a></li></ul></nav></div> </div> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-11 wp-block-column-is-layout-flow" style="border-right-color:var(--wp--preset--color--secondary-dark);border-right-width:1px"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-64 wp-block-group-is-layout-constrained"> <h6 class="wp-block-heading" id="resources" style="text-transform:uppercase">Resources</h6> <nav class="is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-5 wp-block-navigation-is-layout-flex" aria-label="Footer - Resources"><ul class="wp-block-navigation__container is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/"><span class="wp-block-navigation-item__label">Blog</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/resources/"><span class="wp-block-navigation-item__label">Content library</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/webinars/"><span class="wp-block-navigation-item__label">Webinars</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/resources/#type=success-stories"><span class="wp-block-navigation-item__label">Success stories</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/glossary/"><span class="wp-block-navigation-item__label">Glossary</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://help.piwik.pro/"><span class="wp-block-navigation-item__label">Help center</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://developers.piwik.pro/"><span class="wp-block-navigation-item__label">Developers & API</span></a></li></ul></nav></div> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-65 wp-block-group-is-layout-constrained"> <h6 class="wp-block-heading" id="tools" style="text-transform:uppercase">Tools</h6> <nav class="is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-6 wp-block-navigation-is-layout-flex" aria-label="Footer - Tools"><ul class="wp-block-navigation__container is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/cookie-scanner/"><span class="wp-block-navigation-item__label">Cookie Scanner</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/url-builder-tool/"><span class="wp-block-navigation-item__label">URL Builder</span></a></li></ul></nav></div> </div> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-12 wp-block-column-is-layout-flow"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-66 wp-block-group-is-layout-constrained"> <h6 class="wp-block-heading" id="company" style="text-transform:uppercase">Company</h6> <nav class="is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-7 wp-block-navigation-is-layout-flex" aria-label="Footer - Company"><ul class="wp-block-navigation__container is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/about/"><span class="wp-block-navigation-item__label">About</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/clients/"><span class="wp-block-navigation-item__label">Clients</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/careers/"><span class="wp-block-navigation-item__label">Careers</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/partners/"><span class="wp-block-navigation-item__label">Partners</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/media/"><span class="wp-block-navigation-item__label">Media</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/contact/"><span class="wp-block-navigation-item__label">Contact</span></a></li></ul></nav></div> </div> </div> <div class="wp-block-columns has-small-font-size is-layout-flex wp-container-core-columns-is-layout-6 wp-block-columns-is-layout-flex" style="padding-right:0;padding-left:0"> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-13 wp-block-column-is-layout-flow" style="border-right-color:var(--wp--preset--color--secondary-dark);border-right-width:1px"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-67 wp-block-group-is-layout-constrained"><nav class="has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-8 wp-block-navigation-is-layout-flex" aria-label="Footer Secondary - Column 1"><ul class="wp-block-navigation__container has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-google-analytics-4/"><span class="wp-block-navigation-item__label">Piwik PRO vs. GA Universal & GA4</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-google-analytics-360/"><span class="wp-block-navigation-item__label">Piwik PRO vs. GA3 360 & GA4 360</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-matomo-comparison/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Matomo</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/piwik-pro-vs-adobe-analytics/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Adobe Analytics</span></a></li></ul></nav></div> </div> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-14 wp-block-column-is-layout-flow" style="border-right-color:var(--wp--preset--color--secondary-dark);border-right-width:1px"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-68 wp-block-group-is-layout-constrained"><nav class="has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-9 wp-block-navigation-is-layout-flex" aria-label="Footer Secondary - Column 2"><ul class="wp-block-navigation__container has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-google-analytics-vs-ga360/"><span class="wp-block-navigation-item__label">Piwik PRO vs. GA3 & GA4 (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-matomo/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Matomo (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-adobe-analytics/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Adobe Analytics (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-at-internet/"><span class="wp-block-navigation-item__label">Piwik PRO vs. AT Internet (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-countly-enterprise/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Countly (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-amplitude-enterprise/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Amplitude (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-mixpanel-enterprise/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Mixpanel (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-snowplow-enterprise/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Snowplow (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-vs-heap-premier/"><span class="wp-block-navigation-item__label">Piwik PRO vs. Heap (table)</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/piwik-pro-tag-manager-vs-google-tag-manager-table/"><span class="wp-block-navigation-item__label">PP Tag Manager vs. GTM (table)</span></a></li></ul></nav></div> </div> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-15 wp-block-column-is-layout-flow" style="border-right-color:var(--wp--preset--color--secondary-dark);border-right-width:1px"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-69 wp-block-group-is-layout-constrained"><nav class="has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-10 wp-block-navigation-is-layout-flex" aria-label="Footer Secondary - Column 3"><ul class="wp-block-navigation__container has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/web-analytics-vendors-comparison-sheet/"><span class="wp-block-navigation-item__label">Web analytics comparison</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/tag-manager-comparison/"><span class="wp-block-navigation-item__label">Tag manager comparison</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/free-comparison-of-four-enterprise-ready-customer-data-platforms/"><span class="wp-block-navigation-item__label">CDP vendor comparison</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/consent-management-platforms-comparison/"><span class="wp-block-navigation-item__label">Consent management comparison</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/free-web-analytics-platforms/"><span class="wp-block-navigation-item__label">Free web analytics platforms comparison</span></a></li></ul></nav></div> </div> <div class="wp-block-column is-layout-flow wp-container-core-column-is-layout-16 wp-block-column-is-layout-flow" style="border-right-color:var(--wp--preset--color--secondary-dark);border-right-width:1px"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-70 wp-block-group-is-layout-constrained"><nav class="has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation is-layout-flex wp-container-core-navigation-is-layout-11 wp-block-navigation-is-layout-flex" aria-label="Footer Secondary - Column 4"><ul class="wp-block-navigation__container has-text-color has-grey-70-color is-vertical footer-navigation__column wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/core-vs-enterprise/"><span class="wp-block-navigation-item__label">Core vs. Enterprise</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/tracking-methods/"><span class="wp-block-navigation-item__label">6 ways analytics software collects data</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/privacy-laws-around-globe/"><span class="wp-block-navigation-item__label">17 new privacy laws around the world</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/is-google-analytics-gdpr-compliant/"><span class="wp-block-navigation-item__label">Is GA GDPR-compliant?</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/is-google-analytics-hipaa-compliant/"><span class="wp-block-navigation-item__label">Is GA HIPAA-compliant?</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/blog/a-review-of-hipaa-compliant-analytics-platforms/"><span class="wp-block-navigation-item__label">A review of HIPAA-compliant analytics platforms</span></a></li></ul></nav></div> </div> </div> </div> <div class="wp-block-columns is-layout-flex wp-container-core-columns-is-layout-7 wp-block-columns-is-layout-flex"> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:33.33%"> <div class="wp-block-group is-layout-constrained wp-container-core-group-is-layout-72 wp-block-group-is-layout-constrained"> <p class="has-text-align-left"><strong>© 2024 Piwik PRO</strong></p> <p class="has-grey-70-color has-text-color has-small-font-size">Take control of your data</p> </div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-73 wp-block-group-is-layout-flex"> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image is-resized"><a href="https://www.facebook.com/PiwikPro/" target="_blank" rel="noopener"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/dark-gray/s_facebook.svg" alt="" style="object-fit:cover;width:18px;height:18px"/></a></figure> </div> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image is-resized"><a href="https://x.com/piwikpro/" target="_blank" rel="noopener"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/dark-gray/s_x_circle.svg" alt="" style="object-fit:cover;width:18px;height:18px"/></a></figure> </div> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image is-resized"><a href="https://www.linkedin.com/company/piwik-pro/" target="_blank" rel="noopener"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/dark-gray/s_linkedin.svg" alt="" style="object-fit:cover;width:18px;height:18px"/></a></figure> </div> <div class="wp-block-piwikpro-icon"> <figure class="wp-block-image is-resized"><a href="https://github.com/PiwikPRO/" target="_blank" rel="noopener"><img decoding="async" src="/wp-content/plugins/pp-block-icon/build/images/dark-gray/s_github.svg" alt="" style="object-fit:cover;width:18px;height:18px"/></a></figure> </div> </div> </div> <div class="wp-block-column has-small-font-size is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:66.66%"><nav class="has-text-color has-primary-color items-justified-right footer-navigation__subfooter wp-block-navigation is-horizontal is-content-justification-right is-layout-flex wp-container-core-navigation-is-layout-12 wp-block-navigation-is-layout-flex" aria-label="Footer – Subfooter"><ul class="wp-block-navigation__container has-text-color has-primary-color items-justified-right footer-navigation__subfooter wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/privacy-policy/"><span class="wp-block-navigation-item__label"><strong>Privacy policy</strong></span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/cloud-sla/"><span class="wp-block-navigation-item__label"><strong>Service Level Agreement</strong></span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/sitemap/"><span class="wp-block-navigation-item__label"><strong>Sitemap</strong></span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="/bug-bounty-program/"><span class="wp-block-navigation-item__label"><strong>Bug bounty program</strong></span></a></li></ul></nav></div> </div> </div> </footer></div> <script> var _paq = _paq || []; _paq.push( ["setTrackingSource","wordpress","1.3.7"] ); </script> <script type="application/json" id="wp-script-module-data-@wordpress/interactivity"> {"state":{"core/image":{"metadata":{"674348dc27b0f":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/04/image4-2.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-30017","imgStyles":"width:700px","targetWidth":1999,"targetHeight":703,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc2878e":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/04/image6-2.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-30018","imgStyles":"width:615px","targetWidth":1212,"targetHeight":339,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc29349":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/04/image1-2.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-30019","imgStyles":"width:700px","targetWidth":1278,"targetHeight":1170,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc29f8a":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/04/image7-2.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-30020","imgStyles":"width:615px","targetWidth":981,"targetHeight":207,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc2b019":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/04/image5-2.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-30021","imgStyles":"width:700px","targetWidth":1289,"targetHeight":609,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc30b18":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/03/image1-2.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-29392","imgStyles":"width:700px","targetWidth":1261,"targetHeight":605,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc317f5":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/03/image3-2.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-29401","imgStyles":"width:523px","targetWidth":805,"targetHeight":891,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc325df":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/03/image4-3.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-29404","imgStyles":"width:700px","targetWidth":1999,"targetHeight":1042,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc332d6":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/03/image2-3.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-29397","imgStyles":"width:700px","targetWidth":1059,"targetHeight":820,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""},"674348dc358db":{"uploadedSrc":"https://piwik.pro/wp-content/uploads/2020/03/image5-4.png","figureClassNames":"wp-block-image aligncenter size-full is-resized","figureStyles":null,"imgClassNames":"wp-image-29408","imgStyles":"width:700px","targetWidth":1675,"targetHeight":938,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""}}}}} </script> <div class="wp-lightbox-overlay zoom" data-wp-interactive="core/image" data-wp-context='{}' data-wp-bind--role="state.roleAttribute" data-wp-bind--aria-label="state.currentImage.ariaLabel" data-wp-bind--aria-modal="state.ariaModal" data-wp-class--active="state.overlayEnabled" data-wp-class--show-closing-animation="state.showClosingAnimation" data-wp-watch="callbacks.setOverlayFocus" data-wp-on--keydown="actions.handleKeydown" data-wp-on-async--touchstart="actions.handleTouchStart" data-wp-on--touchmove="actions.handleTouchMove" data-wp-on-async--touchend="actions.handleTouchEnd" data-wp-on-async--click="actions.hideLightbox" data-wp-on-async-window--resize="callbacks.setOverlayStyles" data-wp-on-async-window--scroll="actions.handleScroll" tabindex="-1" > <button type="button" aria-label="Close" style="fill: var(--wp--preset--color--black)" class="close-button"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" focusable="false"><path d="m13.06 12 6.47-6.47-1.06-1.06L12 10.94 5.53 4.47 4.47 5.53 10.94 12l-6.47 6.47 1.06 1.06L12 13.06l6.47 6.47 1.06-1.06L13.06 12Z"></path></svg> </button> <div class="lightbox-image-container"> <figure data-wp-bind--class="state.currentImage.figureClassNames" data-wp-bind--style="state.figureStyles"> <img data-wp-bind--alt="state.currentImage.alt" data-wp-bind--class="state.currentImage.imgClassNames" data-wp-bind--style="state.imgStyles" data-wp-bind--src="state.currentImage.currentSrc"> </figure> </div> <div class="lightbox-image-container"> <figure data-wp-bind--class="state.currentImage.figureClassNames" data-wp-bind--style="state.figureStyles"> <img data-wp-bind--alt="state.currentImage.alt" data-wp-bind--class="state.currentImage.imgClassNames" data-wp-bind--style="state.imgStyles" data-wp-bind--src="state.enlargedSrc"> </figure> </div> <div class="scrim" style="background-color: #fff" aria-hidden="true"></div> <style data-wp-text="state.overlayStyles"></style> </div><script src="https://piwik.pro/wp-content/plugins/pp-block-tooltip/build/front-script.js" id="pp-tooltip-script-js"></script> <script id="wp-block-template-skip-link-js-after"> ( function() { var skipLinkTarget = document.querySelector( 'main' ), sibling, skipLinkTargetID, skipLink; // Early exit if a skip-link target can't be located. if ( ! skipLinkTarget ) { return; } /* * Get the site wrapper. * The skip-link will be injected in the beginning of it. */ sibling = document.querySelector( '.wp-site-blocks' ); // Early exit if the root element was not found. if ( ! sibling ) { return; } // Get the skip-link target's ID, and generate one if it doesn't exist. skipLinkTargetID = skipLinkTarget.id; if ( ! skipLinkTargetID ) { skipLinkTargetID = 'wp--skip-link--target'; skipLinkTarget.id = skipLinkTargetID; } // Create the skip link. skipLink = document.createElement( 'a' ); skipLink.classList.add( 'skip-link', 'screen-reader-text' ); skipLink.href = '#' + skipLinkTargetID; skipLink.innerHTML = 'Skip to content'; // Inject the skip link. sibling.parentElement.insertBefore( skipLink, sibling ); }() ); </script> <script src="https://piwik.pro/wp-content/themes/main/assets/dist/js/script.js?ver=1732097677" id="theme-script-js"></script> <script src="https://piwik.pro/wp-content/plugins/cc-syntax-highlight/highlight/syntax_highlight.js?ver=1.2.3" id="syntax_highlight-js"></script> <script src="https://piwik.pro/wp-content/plugins/cc-syntax-highlight/clipboard/clipboard.min.js?ver=1.2.3" id="copy-to-clipboard-js"></script> <script src="https://piwik.pro/wp-content/plugins/cc-syntax-highlight/clipboard/clipboard.js?ver=1.2.3" id="clipboard_run-js"></script> </body> </html>