Hi,
So I recently started using GA4 with my Dash app published on Heroku and I have been trying to use it to track certain interactions. Because my app is run as a single page application, I only retrieve information on GA when the page is first loaded. I saw that to track interactions on single page applications with GA, it is recommended that you execute the GA script again whenever the page is interacted with.
Right now, to embed GA4 on my page, I have used this code:
app.index_string = """<!DOCTYPE html>
<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=###########"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);
dataLayer.push({
'pageTitle' : pageTitle
});}
gtag('js', new Date());
gtag('config', #########);
</script>
{%metas%}
<title>{%title%}</title>
{%favicon%}
{%css%}
</head>
<body>
{%app_entry%}
<footer>
{%config%}
{%scripts%}
{%renderer%}
</footer>
</body>
</html>"""
Is there any way I can execute the index_string command in a callback or use another method to execute the GA4 script in a Dash callback?
Thanks for the help!