feat: Add Google Analytics integration and centralize app title and footer links via configuration.

junian · junian · commit 02facc1fa1e1 · 2026-01-28T16:42:05.000+07:00
diff --git a/src/BlazorApps/Components/GoogleAnalytics.razor b/src/BlazorApps/Components/GoogleAnalytics.razor
@@ -0,0 +1,38 @@
+@inject NavigationManager Nav
+@inject IJSRuntime JS
+
+@using Microsoft.AspNetCore.Components
+
+@if (_markup.HasValue)
+{
+    @_markup.Value
+}
+
+@code {
+    [Parameter, EditorRequired]
+    public string Id { get; set; } = default!;
+
+    private MarkupString? _markup;
+
+    protected override void OnParametersSet()
+    {
+        if (string.IsNullOrWhiteSpace(Id))
+        {
+            _markup = null;
+            return;
+        }
+
+        _markup = new MarkupString(
+            $$"""
+              <!-- Google tag (gtag.js) -->
+              <script async src="https://www.googletagmanager.com/gtag/js?id={{Id}}"></script>
+              <script>
+                window.dataLayer = window.dataLayer || [];
+                function gtag(){dataLayer.push(arguments);}
+                gtag('js', new Date());
+              
+                gtag('config', '{{Id}}');
+              </script>
+              """);
+    }
+}
diff --git a/src/BlazorApps/Layout/MainLayout.razor b/src/BlazorApps/Layout/MainLayout.razor
@@ -1,8 +1,12 @@
-﻿@inherits LayoutComponentBase
+﻿@using BlazorApps.Components
+@inherits LayoutComponentBase
+@inject IConfiguration Config
+
+<GoogleAnalytics Id="@Config["GoogleAnalytics:Id"]" />
 
 <FluentLayout>
     <FluentHeader>
-        BlazorApps
+        @Config["Title"]
     </FluentHeader>
     <FluentStack Class="main" Orientation="Orientation.Horizontal" Width="100%">
         <NavMenu />
@@ -20,8 +24,8 @@
         </FluentBodyContent>
     </FluentStack>
     <FluentFooter>
-        <a href="https://www.fluentui-blazor.net" target="_blank">Documentation and demos</a>
+        Copyright &copy; 2024 - @DateTime.UtcNow.Year &nbsp;<a href="https://www.junian.dev/" target="_blank">junian.dev</a>
         <FluentSpacer />
-        <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor" target="_blank">About Blazor</a>
+        <a href="https://github.com/junian/blazor-apps" target="_blank">GitHub</a>
     </FluentFooter>
 </FluentLayout>
diff --git a/src/BlazorApps/wwwroot/appsettings.json b/src/BlazorApps/wwwroot/appsettings.json
@@ -0,0 +1,6 @@
+{
+    "Title": "Blazor Lab",
+    "GoogleAnalytics": {
+        "Id": "G-YDEHTJ6WH0"
+    }
+}
diff --git a/src/BlazorApps/wwwroot/index.html b/src/BlazorApps/wwwroot/index.html
@@ -4,7 +4,7 @@
 <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>BlazorApps</title>
+    <title>Blazor Apps</title>
     <base href="/" />
     <link rel="preload" id="webassembly" />
     <link href="_content/Microsoft.FluentUI.AspNetCore.Components/css/reboot.css" rel="stylesheet" />
@@ -31,4 +31,4 @@
     <script src="_framework/blazor.webassembly#[.{fingerprint}].js"></script>
 </body>
 
-</html>
+</html>
