diff options
| author | Yuval Adam <_@yuv.al> | 2025-05-23 17:15:05 +0200 |
|---|---|---|
| committer | Yuval Adam <_@yuv.al> | 2025-05-23 17:15:20 +0200 |
| commit | a4b1886b210213b0becf1a134d06882db631f647 (patch) | |
| tree | d20cc2b0f1b8498d14f5c69f54c619f47b215fd0 /src | |
| parent | f32aa30f2f0722fb659a22ddc57cdf3bd79a4ab5 (diff) | |
Add analytics
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/Analytics.astro | 33 | ||||
| -rw-r--r-- | src/config/analytics.js | 7 | ||||
| -rw-r--r-- | src/layouts/CenteredLayout.astro | 4 | ||||
| -rw-r--r-- | src/layouts/StandardLayout.astro | 15 |
4 files changed, 52 insertions, 7 deletions
diff --git a/src/components/Analytics.astro b/src/components/Analytics.astro new file mode 100644 index 0000000..0352bea --- /dev/null +++ b/src/components/Analytics.astro @@ -0,0 +1,33 @@ +--- +import { analytics } from "../config/analytics"; + +const GOOGLE_ANALYTICS_ID = analytics.googleAnalyticsId; +const FATHOM_ANALYTICS_ID = analytics.fathomAnalyticsId; +--- + +{ + GOOGLE_ANALYTICS_ID && ( + <script + async + src={`https://www.googletagmanager.com/gtag/js?id=${GOOGLE_ANALYTICS_ID}`} + /> + <script define:vars={{ GOOGLE_ANALYTICS_ID }} is:inline> + window.dataLayer = window.dataLayer || []; + function gtag() { + dataLayer.push(arguments); + } + gtag("js", new Date()); + gtag("config", GOOGLE_ANALYTICS_ID); + </script> + ) +} +{ + FATHOM_ANALYTICS_ID && ( + <script + src="https://cdn.usefathom.com/script.js" + data-site={FATHOM_ANALYTICS_ID} + defer + /> + ) +} + diff --git a/src/config/analytics.js b/src/config/analytics.js new file mode 100644 index 0000000..e17350d --- /dev/null +++ b/src/config/analytics.js @@ -0,0 +1,7 @@ + +export const analytics = { + googleAnalyticsId: '', + fathomAnalyticsId: '' +}; + +export default analytics; diff --git a/src/layouts/CenteredLayout.astro b/src/layouts/CenteredLayout.astro index 5505b65..1b9286c 100644 --- a/src/layouts/CenteredLayout.astro +++ b/src/layouts/CenteredLayout.astro @@ -1,5 +1,6 @@ --- -import '../styles/global.css'; +import "../styles/global.css"; +import Analytics from "../components/Analytics.astro"; interface Props { title?: string; @@ -15,6 +16,7 @@ const { title = "Astro Site" } = Astro.props; <meta name="viewport" content="width=device-width" /> <meta name="generator" content={Astro.generator} /> <title>{title}</title> + <Analytics /> </head> <body class="min-h-screen bg-white"> <main class="flex min-h-screen flex-col items-center justify-center p-4"> diff --git a/src/layouts/StandardLayout.astro b/src/layouts/StandardLayout.astro index a6c9151..e6a4bec 100644 --- a/src/layouts/StandardLayout.astro +++ b/src/layouts/StandardLayout.astro @@ -1,15 +1,17 @@ --- -import '../styles/global.css'; +import "../styles/global.css"; interface Props { title?: string; description?: string; } -const { - title = "Astro Site", - description = "A simple Astro site with blog functionality" +const { + title = "Astro Site", + description = "A simple Astro site with blog functionality", } = Astro.props; + +import Analytics from "../components/Analytics.astro"; --- <html lang="en"> @@ -20,6 +22,7 @@ const { <meta name="generator" content={Astro.generator} /> <meta name="description" content={description} /> <title>{title}</title> + <Analytics /> </head> <body class="min-h-screen bg-gray-50 flex flex-col"> <header class="bg-white shadow-sm"> @@ -33,13 +36,13 @@ const { </nav> </div> </header> - + <main class="flex-grow"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8"> <slot /> </div> </main> - + <footer class="bg-white border-t border-gray-200"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6"> <p class="text-center text-gray-500 text-sm"> |