diff --git a/src/BootstrapBlazor.Server/Components/App.razor b/src/BootstrapBlazor.Server/Components/App.razor
index f913f6f4cd4..7f3983d0606 100644
--- a/src/BootstrapBlazor.Server/Components/App.razor
+++ b/src/BootstrapBlazor.Server/Components/App.razor
@@ -1,5 +1,6 @@
 ﻿@inject IWebHostEnvironment Env
 @inject IStringLocalizer<BaseLayout> Localizer
+@inject IOptions<WebsiteOptions> WebsiteOption
 
 <!DOCTYPE html>
 <html lang="en" data-bs-theme='light'>
@@ -18,23 +19,13 @@
     <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
     <link rel="apple-touch-icon" href="favicon.png">
 
-    @if (Env.IsSupportAssets())
-    {
-        @this.RenderAssets()
-    }
-    else
-    {
-        <link rel="stylesheet" href="_content/BootstrapBlazor.AntDesignIcon/BootstrapBlazor.AntDesignIcon.bundle.scp.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor.BootstrapIcon/css/bootstrap.min.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor.ElementIcon/BootstrapBlazor.ElementIcon.bundle.scp.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor.FontAwesome/css/font-awesome.min.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor.MaterialDesign/css/md.min.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor.IconPark/BootstrapBlazor.IconPark.bundle.scp.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor/css/bootstrap.blazor.bundle.min.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor/css/motronic.min.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor.Shared/BootstrapBlazor.Shared.bundle.scp.css" />
-        <link rel="stylesheet" href="_content/BootstrapBlazor.Shared/css/site.css" />
-    }
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.FontAwesome/css/font-awesome.min.css"]" />
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.MaterialDesign/css/md.min.css"]" />
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor/css/bootstrap.blazor.bundle.min.css"]" />
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor/css/motronic.min.css"]" />
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.Shared/BootstrapBlazor.Shared.bundle.scp.css"]" />
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.Shared/css/site.css"]" />
+
     <HeadOutlet @rendermode="new InteractiveServerRenderMode(false)" />
 </head>
 
@@ -53,7 +44,7 @@
     @if (Env.IsProduction())
     {
         <script type="text/javascript" src="https://cdn.wwads.cn/js/makemoney.js"></script>
-        <script type="text/javascript" src="./_content/BootstrapBlazor.Shared/lib/wwads/wwads.js"></script>
+        <script type="text/javascript" src="@WebsiteOption.Value.GetAssetUrl("lib/wwads/wwads.js")"></script>
         <script>
             var _hmt = _hmt || [];
             (function () {
diff --git a/src/BootstrapBlazor.Server/Controllers/WaterfallController.cs b/src/BootstrapBlazor.Server/Controllers/WaterfallController.cs
index 2b1c3255b53..d5086486755 100644
--- a/src/BootstrapBlazor.Server/Controllers/WaterfallController.cs
+++ b/src/BootstrapBlazor.Server/Controllers/WaterfallController.cs
@@ -4,6 +4,7 @@
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
 using Microsoft.AspNetCore.Mvc;
+using Microsoft.Extensions.Options;
 
 namespace BootstrapBlazor.Server.Controllers;
 
@@ -15,19 +16,19 @@ public class WaterfallController : Controller
     /// <summary>
     /// 获得图片方法
     /// </summary>
-    /// <param name="env"></param>
+    /// <param name="options"></param>
     /// <param name="id"></param>
     /// <returns></returns>
-    public async Task<IActionResult> Index([FromServices] IWebHostEnvironment env, [FromQuery] string? id)
+    public async Task<IActionResult> Index([FromServices] IOptions<WebsiteOptions> options, [FromQuery] string? id)
     {
         var interval = Random.Shared.Next(1, 2000);
         await Task.Delay(interval);
+
 #if DEBUG
-        var fileName = Path.Combine(env.WebRootPath, "../../");
+        var fileName = Path.Combine(options.Value.WebRootPath, "../../BootstrapBlazor.Shared/wwwroot/images/waterfall", $"{id}.jpeg");
 #else
-        var fileName = Path.Combine(AppContext.BaseDirectory, "_content");
+        var fileName = Path.Combine(options.Value.WebRootPath, "_content/BootstrapBlazor.Shared/wwwroot/images/waterfall", $"{id}.jpeg");
 #endif
-        fileName = Path.Combine(fileName, "BootstrapBlazor.Shared/wwwroot/images/waterfall", $"{id}.jpeg");
         return new PhysicalFileResult(fileName, "images/jpeg");
     }
 }
diff --git a/src/BootstrapBlazor.Server/Extensions/StaticFileResponseContextExtensions.cs b/src/BootstrapBlazor.Server/Extensions/StaticFileResponseContextExtensions.cs
index bb22bba963d..aeeefc6523c 100644
--- a/src/BootstrapBlazor.Server/Extensions/StaticFileResponseContextExtensions.cs
+++ b/src/BootstrapBlazor.Server/Extensions/StaticFileResponseContextExtensions.cs
@@ -36,12 +36,8 @@ public static RenderFragment RenderAssets(this ComponentBase component) => build
             var v = pi.GetValue(component);
             if (v is ResourceAssetCollection assets)
             {
-                builder.RenderCss($"{assets["_content/BootstrapBlazor.AntDesignIcon/BootstrapBlazor.AntDesignIcon.bundle.scp.css"]}");
-                builder.RenderCss($"{assets["_content/BootstrapBlazor.BootstrapIcon/css/bootstrap.min.css"]}");
-                builder.RenderCss($"{assets["_content/BootstrapBlazor.ElementIcon/BootstrapBlazor.ElementIcon.bundle.scp.css"]}");
                 builder.RenderCss($"{assets["_content/BootstrapBlazor.FontAwesome/css/font-awesome.min.css"]}");
                 builder.RenderCss($"{assets["_content/BootstrapBlazor.MaterialDesign/css/md.min.css"]}");
-                builder.RenderCss($"{assets["_content/BootstrapBlazor.IconPark/BootstrapBlazor.IconPark.bundle.scp.css"]}");
                 builder.RenderCss($"{assets["_content/BootstrapBlazor/css/bootstrap.blazor.bundle.min.css"]}");
                 builder.RenderCss($"{assets["_content/BootstrapBlazor/css/motronic.min.css"]}");
                 builder.RenderCss($"{assets["_content/BootstrapBlazor.Shared/BootstrapBlazor.Shared.bundle.scp.css"]}");
diff --git a/src/BootstrapBlazor.Server/Services/ClearUploadFilesService.cs b/src/BootstrapBlazor.Server/Services/ClearUploadFilesService.cs
index c134e2bf0cb..b0ff7e62891 100644
--- a/src/BootstrapBlazor.Server/Services/ClearUploadFilesService.cs
+++ b/src/BootstrapBlazor.Server/Services/ClearUploadFilesService.cs
@@ -4,30 +4,14 @@
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
 using Longbow.Tasks;
-using Microsoft.Extensions.Options;
 
 namespace BootstrapBlazor.Service.Services;
 
 /// <summary>
 /// 后台任务服务类
 /// </summary>
-internal class ClearTempFilesService : BackgroundService
+internal class ClearTempFilesService(IWebHostEnvironment env) : BackgroundService
 {
-    private readonly IWebHostEnvironment _env;
-
-    /// <summary>
-    /// 
-    /// </summary>
-    /// <param name="env"></param>
-    /// <param name="websiteOption"></param>
-    public ClearTempFilesService(IWebHostEnvironment env, IOptionsMonitor<WebsiteOptions> websiteOption)
-    {
-        _env = env;
-        websiteOption.CurrentValue.WebRootPath = env.WebRootPath;
-        websiteOption.CurrentValue.ContentRootPath = env.ContentRootPath;
-        websiteOption.CurrentValue.IsDevelopment = env.IsDevelopment();
-    }
-
     /// <summary>
     /// 运行任务
     /// </summary>
@@ -37,15 +21,14 @@ protected override Task ExecuteAsync(CancellationToken stoppingToken)
     {
         TaskServicesManager.GetOrAdd("Clear Upload Files", (provider, token) =>
         {
-            var webSiteUrl = $"images{Path.DirectorySeparatorChar}uploader{Path.DirectorySeparatorChar}";
-            var filePath = Path.Combine(_env.WebRootPath, webSiteUrl);
+            var filePath = Path.Combine(env.WebRootPath, "images", "uploader");
             if (Directory.Exists(filePath))
             {
                 Directory.EnumerateFiles(filePath).Take(10).ToList().ForEach(file => DeleteFile(file, token));
             }
 
             // 清除导出临时文件
-            var exportFilePath = Path.Combine(_env.WebRootPath, "pdf");
+            var exportFilePath = Path.Combine(env.WebRootPath, "pdf");
             if (Directory.Exists(exportFilePath))
             {
                 Directory.EnumerateFiles(exportFilePath, "*.html").Take(10).Where(file =>
diff --git a/src/BootstrapBlazor.Shared/Components/Components/BBLogo.razor b/src/BootstrapBlazor.Shared/Components/Components/BBLogo.razor
index 38b026d0165..030d2b6657f 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/BBLogo.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/BBLogo.razor
@@ -1 +1,3 @@
-﻿<img alt="logo" class="bb-icon" src="./_content/BootstrapBlazor.Shared/images/logo.png" />
+﻿@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
+
+<img alt="logo" class="bb-icon" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/logo.png")" />
diff --git a/src/BootstrapBlazor.Shared/Components/Components/BlazorReconnector.razor b/src/BootstrapBlazor.Shared/Components/Components/BlazorReconnector.razor
index 6881d5e6f6e..9034df81a09 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/BlazorReconnector.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/BlazorReconnector.razor
@@ -71,7 +71,7 @@
                 <p></p>
                 <div>已提供项目模板方便快速上手 <a class="connection-link" href="@TemplateUrl" target="_blank">项目模板</a></div>
             </div>
-            <img altt="QQ" src="./_content/BootstrapBlazor.Shared/images/QQGroup@2x.png" alt="QQGroup" />
+            <img altt="QQ" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/QQGroup@2x.png")" alt="QQGroup" />
             <div class="connection-body-tail d-none d-sm-block"></div>
         </div>
     </div>;
diff --git a/src/BootstrapBlazor.Shared/Components/Components/ComponentCard.razor.cs b/src/BootstrapBlazor.Shared/Components/Components/ComponentCard.razor.cs
index a6b9942727a..08056da1758 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/ComponentCard.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Components/ComponentCard.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Components;
 
 /// <summary>
@@ -10,7 +12,10 @@ namespace BootstrapBlazor.Shared.Components.Components;
 /// </summary>
 public sealed partial class ComponentCard
 {
-    private string ImageUrl => $"./_content/BootstrapBlazor.Shared/images/{Image}";
+    [Inject, NotNull]
+    private IOptionsMonitor<WebsiteOptions>? WebsiteOption { get; set; }
+
+    private string ImageUrl => $"{WebsiteOption.CurrentValue.AssetRootPath}images/{Image}";
 
     private string? ClassString => CssBuilder.Default("col-12 col-sm-6 col-md-4 col-lg-3")
         .AddClass("d-none", IsHide)
diff --git a/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor b/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor
index 97117e04f70..d8647db1f3e 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor
@@ -1,4 +1,6 @@
-﻿<div class="bb-winbox-body">
+﻿@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
+
+<div class="bb-winbox-body">
     <h3>Custom WinBox Content Create @DateTime.Now</h3>
 </div>
 
diff --git a/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor.cs b/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor.cs
index a657d4d1119..3c1282ae7ae 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Components/CustomWinBoxContent.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Components;
 
 /// <summary>
@@ -49,7 +51,7 @@ private async Task SetIconWinBox()
     {
         if (Option != null)
         {
-            Option.Icon = "./_content/BootstrapBlazor.Shared/images/Argo-C.png";
+            Option.Icon = $"{WebsiteOption.CurrentValue.AssetRootPath}images/Argo-C.png";
             await WinBoxService.SetIcon(Option);
         }
     }
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Header.razor b/src/BootstrapBlazor.Shared/Components/Components/Header.razor
index 9c3514da9de..baa74c34958 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Header.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/Header.razor
@@ -1,5 +1,5 @@
 ﻿@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Components/Header.razor.js")]
+@attribute [JSModuleAutoLoader("Components/Header.razor.js")]
 
 <header class="navbar-header navbar navbar-expand flex-column flex-md-row px-3">
     <div class="header-img navbar-brand">
@@ -34,12 +34,12 @@
     <ul class="navbar-nav nav-repo ms-3">
         <li class="nav-item">
             <a class="nav-link p-2" href="@WebsiteOption.CurrentValue.GithubRepositoryUrl" target="_blank">
-                <img alt="git" src="./_content/BootstrapBlazor.Shared/images/git.svg" />
+                <img alt="git" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/git.svg")" />
             </a>
         </li>
         <li class="nav-item">
             <a class="nav-link p-2" href="@WebsiteOption.CurrentValue.GiteeRepositoryUrl" target="_blank">
-                <img alt="gitee" src="./_content/BootstrapBlazor.Shared/images/gitee.svg" />
+                <img alt="gitee" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/gitee.svg")" />
             </a>
         </li>
         <li class="nav-item">
diff --git a/src/BootstrapBlazor.Shared/Components/Components/InstallContent.razor b/src/BootstrapBlazor.Shared/Components/Components/InstallContent.razor
index 94abb29d619..3267710dfcd 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/InstallContent.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/InstallContent.razor
@@ -5,6 +5,7 @@
 <h3>@Title</h3>
 
 <h4>@Localizer["Heading"]</h4>
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <p>@Localizer["P1"]</p>
 <ul class="ul-demo">
@@ -23,17 +24,17 @@
 <p class="code-label">1. @Localizer["P11"]</p>
 <p class="code-label">2. @Localizer["P12"]</p>
 <p class="code-label">3. @Localizer["P13"] <b>Blazor App</b> @Localizer["P14"] <b>@Localizer["P15"]</b>, @Localizer["P16"] <b>Create</b></p>
-<img alt="install" src="./_content/BootstrapBlazor.Shared/images/create-new-application.png" style="border-radius: 6px;" class="d-none d-sm-block" />
+<img alt="install" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/create-new-application.png")" style="border-radius: 6px;" class="d-none d-sm-block" />
 @ChooseTemplate
 
 <h5>@Localizer["P17"]</h5>
 <p class="code-label">1. @Localizer["P18"] <b>nuget.org</b> @Localizer["P19"] <code>BootstrapBlazor</code></p>
 <p>@Localizer["P20"] <b>Manage Nuget Packages</b></p>
 <Pre @key="@Version" class="no-highlight">dotnet add package BootstrapBlazor --version @Version</Pre>
-<img alt="install" src="./_content/BootstrapBlazor.Shared/images/manage-nuget-packages-for-server-app.png" style="border-radius: 6px;" class="d-none d-sm-block" />
+<img alt="install" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/manage-nuget-packages-for-server-app.png")" style="border-radius: 6px;" class="d-none d-sm-block" />
 
 <p class="code-label">2. @Localizer["P21"]</p>
-<img alt="install" src="./_content/BootstrapBlazor.Shared/images/nuget_install.png" style="width: 1000px; border-radius: 6px;" class="d-none d-sm-block" />
+<img alt="install" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/nuget_install.png")" style="width: 1000px; border-radius: 6px;" class="d-none d-sm-block" />
 
 <p class="code-label">3. @Localizer["P22"]</p>
 <p>@Localizer["P23"]</p>
@@ -92,4 +93,4 @@
 <p class="code-label">1. @Localizer["P39"] <code>Button</code> @Localizer["P40"]</p>
 <Pre>&lt;Button Color="Color.Primary" Icon="fa-solid fa-font-awesome" Text="@Localizer["P41"]" /&gt;</Pre>
 <p class="code-label">2. @Localizer["P42"] <b>Visual studio</b> @Localizer["P43"] <kbd>F5</kbd> @Localizer["P44"]</p>
-<img alt="install" src="./_content/BootstrapBlazor.Shared/images/preview.png" style="border-radius: 6px;" class="d-none d-sm-block" />
+<img alt="install" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/preview.png")" style="border-radius: 6px;" class="d-none d-sm-block" />
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Pre.razor b/src/BootstrapBlazor.Shared/Components/Components/Pre.razor
index 1c78123b49b..e2cb8a536bd 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Pre.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/Pre.razor
@@ -1,5 +1,6 @@
 ﻿@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Components/Pre.razor.js")]
+@attribute [JSModuleAutoLoader("Components/Pre.razor.js")]
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <div @attributes="@AdditionalAttributes" class="@ClassString" id="@Id" data-bb-title="@CopiedText">
     <p class="loading">@LoadingText</p>
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.cs b/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.cs
index 16790ef736e..4ef0d7e8b5a 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.cs
@@ -114,7 +114,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
     /// <inheritdoc/>
     /// </summary>
     /// <returns></returns>
-    protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, CopiedText);
+    protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, CopiedText, WebsiteOption.CurrentValue.AssetRootPath);
 
     private async Task GetCodeAsync()
     {
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.js b/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.js
index ce32522232e..774de32124f 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.js
+++ b/src/BootstrapBlazor.Shared/Components/Components/Pre.razor.js
@@ -1,15 +1,15 @@
 ﻿import { copy, getDescribedElement, addLink, removeLink, addScript, getHeight, getPreferredTheme } from "../../../BootstrapBlazor/modules/utility.js"
 import EventHandler from "../../../BootstrapBlazor/modules/event-handler.js"
 
-export async function init(id, title) {
+export async function init(id, title, assetRoot) {
     const el = document.getElementById(id);
     if (el === null) {
         return
     }
 
-    await addScript('./_content/BootstrapBlazor.Shared/lib/highlight/highlight.min.js')
-    await addScript('./_content/BootstrapBlazor.Shared/lib/highlight/cshtml-razor.min.js')
-    await switchTheme(getPreferredTheme());
+    await addScript(`${assetRoot}lib/highlight/highlight.min.js`)
+    await addScript(`${assetRoot}lib/highlight/cshtml-razor.min.js`)
+    await switchTheme(getPreferredTheme(), assetRoot);
 
     const preElement = el.querySelector('pre')
     const code = el.querySelector('pre > code')
@@ -78,14 +78,14 @@ export async function highlight(id) {
     }
 }
 
-export async function switchTheme(theme) {
+export async function switchTheme(theme, assetPath) {
     if (theme === 'dark') {
-        removeLink('./_content/BootstrapBlazor.Shared/lib/highlight/vs.min.css')
-        await addLink('./_content/BootstrapBlazor.Shared/lib/highlight/vs2015.min.css')
+        removeLink(`${assetPath}lib/highlight/vs.min.css`);
+        await addLink(`${assetPath}lib/highlight/vs2015.min.css`);
     }
     else {
-        removeLink('./_content/BootstrapBlazor.Shared/lib/highlight/vs2015.min.css');
-        await addLink('./_content/BootstrapBlazor.Shared/lib/highlight/vs.min.css')
+        removeLink(`${assetPath}lib/highlight/vs2015.min.css`);
+        await addLink(`${assetPath}lib/highlight/vs.min.css`);
     }
 }
 
diff --git a/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor b/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor
index 01ebdca2fea..2c7b5039710 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor
@@ -1,8 +1,9 @@
 ﻿@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor.js")]
+@attribute [JSModuleAutoLoader("Components/ThemeChooser.razor.js")]
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <div id="@Id" class="theme">
-    <PulseButton class="btn-fade btn-theme" Color="Color.None" ImageUrl="./_content/BootstrapBlazor.Shared/images/m.svg" TooltipText="@Title" TooltipPlacement="Placement.Left" />
+    <PulseButton class="btn-fade btn-theme" Color="Color.None" ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/m.svg")" TooltipText="@Title" TooltipPlacement="Placement.Left" />
     <div class="theme-list">
         <div class="theme-header">
             <div class="flex-fill">@HeaderText</div>
diff --git a/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor.cs b/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor.cs
index b161c8dc9f5..70ad2ea2399 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Components/ThemeChooser.razor.cs
@@ -3,8 +3,6 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
-using Microsoft.Extensions.Options;
-
 namespace BootstrapBlazor.Shared.Components.Components;
 
 /// <summary>
@@ -25,10 +23,6 @@ public partial class ThemeChooser
     [NotNull]
     private IStringLocalizer<ThemeChooser>? Localizer { get; set; }
 
-    [Inject]
-    [NotNull]
-    private IOptionsMonitor<WebsiteOptions>? SiteOptions { get; set; }
-
     /// <summary>
     /// OnInitialized 方法
     /// </summary>
@@ -38,14 +32,14 @@ protected override void OnInitialized()
 
         Title ??= Localizer[nameof(Title)];
         HeaderText ??= Localizer[nameof(HeaderText)];
-        Themes = SiteOptions.CurrentValue.Themes.Select(i => new SelectedItem { Text = i.Name, Value = i.Key });
-        SiteOptions.CurrentValue.CurrentTheme = "bootstrap";
+        Themes = WebsiteOption.CurrentValue.Themes.Select(i => new SelectedItem { Text = i.Name, Value = i.Key });
+        WebsiteOption.CurrentValue.CurrentTheme = "bootstrap";
     }
 
     private async Task OnClickTheme(SelectedItem item)
     {
-        SiteOptions.CurrentValue.CurrentTheme = item.Value;
-        var theme = SiteOptions.CurrentValue.Themes.Find(i => i.Key == item.Value);
+        WebsiteOption.CurrentValue.CurrentTheme = item.Value;
+        var theme = WebsiteOption.CurrentValue.Themes.Find(i => i.Key == item.Value);
         if (theme != null)
         {
             await InvokeVoidAsync("updateTheme", [theme.Files]);
@@ -53,6 +47,6 @@ private async Task OnClickTheme(SelectedItem item)
     }
 
     private string? GetThemeItemClass(SelectedItem item) => CssBuilder.Default("theme-item")
-        .AddClass("active", SiteOptions.CurrentValue.CurrentTheme == item.Value)
+        .AddClass("active", WebsiteOption.CurrentValue.CurrentTheme == item.Value)
         .Build();
 }
diff --git a/src/BootstrapBlazor.Shared/Components/Components/UpdateIntro.razor b/src/BootstrapBlazor.Shared/Components/Components/UpdateIntro.razor
index 8c2150e9191..f7618001c20 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/UpdateIntro.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/UpdateIntro.razor
@@ -1,6 +1,6 @@
 ﻿@inherits WebSiteModuleComponentBase
 @inject IStringLocalizer<UpdateIntro> Localizer
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Components/UpdateIntro.razor.js")]
+@attribute [JSModuleAutoLoader("Components/UpdateIntro.razor.js")]
 
 <div class="blazor-intro" id="@Id" data-bb-button=".blazor-intro-button" data-bb-version="@PackageVersionService.Version">
     <h5><b>Bootstrap Blazor</b> @Localizer["H1"] <span class="version">@PackageVersionService.Version</span></h5>
@@ -10,15 +10,15 @@
             <p>
                 @Localizer["P1"] <span class="version">@PackageVersionService.Version</span> @Localizer["P2"] <a target="_blank" href="@UpdateLogUrl"><b>[@Localizer["P3"]]</b></a> @Localizer["P4"] <b>Star</b>
                 <a class="px-2" href="@WebsiteOption.CurrentValue.GithubRepositoryUrl" target="_blank">
-                    <img src="./_content/BootstrapBlazor.Shared/images/git.svg" alt="github" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/git.svg")" alt="github" />
                 </a>
                 <a href="@WebsiteOption.CurrentValue.GiteeRepositoryUrl" target="_blank">
-                    <img src="./_content/BootstrapBlazor.Shared/images/gitee.svg" alt="gitee" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/gitee.svg")" alt="gitee" />
                 </a>
             </p>
         </div>
         <div class="blazor-intro-barcode">
-            <img src="./_content/BootstrapBlazor.Shared/images/QQGroup@2x.png" alt="QQGroup" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/QQGroup@2x.png")" alt="QQGroup" />
             <div>QQ 795206915</div>
         </div>
     </div>
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Video.razor b/src/BootstrapBlazor.Shared/Components/Components/Video.razor
index e1e308ec18e..fe443bf0ae0 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Video.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/Video.razor
@@ -1,4 +1,4 @@
-﻿@inject IOptionsMonitor<WebsiteOptions> Options
+﻿@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 @inject IStringLocalizer<Video> Localizer
 
 <p><b>@Localizer["H1"]</b></p>
@@ -44,11 +44,11 @@ else
             Name = comNameWithHash.Split('?').First();
         }
 
-        if (!string.IsNullOrEmpty(Name) && Options.CurrentValue.Videos.TryGetValue(Name, out var url))
+        if (!string.IsNullOrEmpty(Name) && WebsiteOption.CurrentValue.Videos.TryGetValue(Name, out var url))
         {
             if (!string.IsNullOrEmpty(url))
             {
-                VideoUrl.AddRange(url.Split(';').Select(a => $"{Options.CurrentValue.VideoUrl}{a}"));
+                VideoUrl.AddRange(url.Split(';').Select(a => $"{WebsiteOption.CurrentValue.VideoUrl}{a}"));
             }
         }
     }
diff --git a/src/BootstrapBlazor.Shared/Components/Components/VideoDemo.razor b/src/BootstrapBlazor.Shared/Components/Components/VideoDemo.razor
index be8fe9687f5..40abcc833c3 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/VideoDemo.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/VideoDemo.razor
@@ -1,4 +1,4 @@
 ﻿@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Components/VideoDemo.razor.js", AutoInvokeInit = false, AutoInvokeDispose = false)]
+@attribute [JSModuleAutoLoader("Components/VideoDemo.razor.js", AutoInvokeInit = false, AutoInvokeDispose = false)]
 
 <video id="@Id" controls preload="auto" autoplay muted src="https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4"></video>
diff --git a/src/BootstrapBlazor.Shared/Components/Components/WebSiteModuleComponentBase.cs b/src/BootstrapBlazor.Shared/Components/Components/WebSiteModuleComponentBase.cs
index 9c22a2bc5c7..071047a435a 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/WebSiteModuleComponentBase.cs
+++ b/src/BootstrapBlazor.Shared/Components/Components/WebSiteModuleComponentBase.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Components;
 
 /// <summary>
@@ -10,6 +12,10 @@ namespace BootstrapBlazor.Shared.Components.Components;
 /// </summary>
 public abstract class WebSiteModuleComponentBase : BootstrapModuleComponentBase
 {
+    [Inject]
+    [NotNull]
+    private IOptions<WebsiteOptions>? WebsiteOption { get; set; }
+
     /// <summary>
     /// <inheritdoc/>
     /// </summary>
@@ -17,6 +23,9 @@ protected override void OnLoadJSModule()
     {
         base.OnLoadJSModule();
 
-        ModulePath = $"./Components/{ModulePath}";
+        if (!string.IsNullOrEmpty(ModulePath))
+        {
+            ModulePath = $"{WebsiteOption.Value.JSModuleRootPath}{ModulePath}";
+        }
     }
 }
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Widget.razor b/src/BootstrapBlazor.Shared/Components/Components/Widget.razor
index 1ee2f7e0c26..22323a0d904 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Widget.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/Widget.razor
@@ -1,4 +1,6 @@
-﻿<DropdownWidget class="px-3 d-none d-sm-block">
+﻿@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
+
+<DropdownWidget class="px-3 d-none d-sm-block">
     <DropdownWidgetItem Icon="fa-regular fa-envelope" BadgeNumber="4">
         <HeaderTemplate>
             <span>您有 4 个未读消息</span>
@@ -8,7 +10,7 @@
             {
                 <a class="dropdown-item d-flex align-items-center" href="#" @onclick:preventDefault>
                     <div style="width: 40px; height: 40px;">
-                        <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" Size="Size.Small" />
+                        <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" Size="Size.Small" />
                     </div>
                     <div class="ms-2">
                         <div class="d-flex position-relative">
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor b/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor
index 4bedfa252ef..4e6a670d30a 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor
+++ b/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor
@@ -1,4 +1,9 @@
 ﻿@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Components/Wwads.razor.js", AutoInvokeDispose = false)]
+@attribute [JSModuleAutoLoader("Components/Wwads.razor.js", AutoInvokeDispose = false)]
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
+
+<HeadContent>
+    <link rel="stylesheet" href="@Assets[$"{WebsiteOption.CurrentValue.AssetRootPath}css/wwads.css"]" />
+</HeadContent>
 
 <div @attributes="AdditionalAttributes" id="@Id" class="@ClassString"></div>
diff --git a/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor.js b/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor.js
index 5008bc343bb..8a662d5142c 100644
--- a/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor.js
+++ b/src/BootstrapBlazor.Shared/Components/Components/Wwads.razor.js
@@ -1,10 +1,6 @@
-﻿import { addLink } from '../../../BootstrapBlazor/modules/utility.js'
-
-export async function init(id, options) {
+﻿export function init(id, options) {
     var el = document.getElementById(id)
     if (el) {
-        await addLink("./_content/BootstrapBlazor.Shared/css/wwads.css");
-
         const { isVertical, isDebug } = options;
 
         if (isDebug === false) {
@@ -13,11 +9,6 @@ export async function init(id, options) {
             ad.classList.add("wwads-cn")
             ad.classList.add(isVertical ? "wwads-vertical" : "wwads-horizontal");
             el.appendChild(ad);
-
-            //    const cc = document.createElement('div');
-            //    cc.classList.add("cc-ad")
-            //    cc.innerHTML = `<a href="https://ccbpm.cn/index.html?Frm=argo" target="_blank"><img src='https://ccbpm.cn/img/GenerAD.png?Frm=argo' /></a>`
-            //    el.appendChild(cc);
         }
     }
 }
diff --git a/src/BootstrapBlazor.Shared/Components/Layout/ComponentLayout.razor.cs b/src/BootstrapBlazor.Shared/Components/Layout/ComponentLayout.razor.cs
index a942834e32c..6ac01bb9070 100644
--- a/src/BootstrapBlazor.Shared/Components/Layout/ComponentLayout.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Layout/ComponentLayout.razor.cs
@@ -104,7 +104,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
     {
         if (firstRender)
         {
-            Module = await JSRuntime.LoadModule("./_content/BootstrapBlazor.Shared/Components/Layout/ComponentLayout.razor.js");
+            Module = await JSRuntime.LoadModule($"{WebsiteOption.CurrentValue.AssetRootPath}Components/Layout/ComponentLayout.razor.js");
         }
         if (Module != null)
         {
diff --git a/src/BootstrapBlazor.Shared/Components/Layout/DockLayout.razor.cs b/src/BootstrapBlazor.Shared/Components/Layout/DockLayout.razor.cs
index e85afd6edbf..24838a53d0b 100644
--- a/src/BootstrapBlazor.Shared/Components/Layout/DockLayout.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Layout/DockLayout.razor.cs
@@ -3,6 +3,7 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
 using Microsoft.JSInterop;
 
 namespace BootstrapBlazor.Shared.Components.Layout;
@@ -24,6 +25,10 @@ public partial class DockLayout : IAsyncDisposable
     [NotNull]
     private IJSRuntime? JSRuntime { get; set; }
 
+    [Inject]
+    [NotNull]
+    private IOptionsMonitor<WebsiteOptions>? WebsiteOption { get; set; }
+
     /// <summary>
     /// <inheritdoc/>
     /// </summary>
@@ -33,7 +38,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
     {
         if (firstRender)
         {
-            Module = await JSRuntime.LoadModule("./_content/BootstrapBlazor.Shared/Components/Layout/DockLayout.razor.js");
+            Module = await JSRuntime.LoadModule($"{WebsiteOption.CurrentValue.AssetRootPath}Components/Layout/DockLayout.razor.js");
             await Module.InvokeVoidAsync("init");
         }
     }
diff --git a/src/BootstrapBlazor.Shared/Components/Layout/HomeLayout.razor b/src/BootstrapBlazor.Shared/Components/Layout/HomeLayout.razor
index 25a6f82ad22..4b73f1b7e02 100644
--- a/src/BootstrapBlazor.Shared/Components/Layout/HomeLayout.razor
+++ b/src/BootstrapBlazor.Shared/Components/Layout/HomeLayout.razor
@@ -14,7 +14,7 @@
     <div class="bb-foundation">
         <div class="bb-foundation-content">本项目属于 <a href="https://www.dotnetfoundation.org/">.NET 基金会</a>，并根据其 <a href="https://www.dotnetfoundation.org/code-of-conduct">行为准则</a> 运作</div>
         <a class="bb-foundation-img d-none d-sm-block" href="https://www.dotnetfoundation.org/">
-            <img src="./_content/BootstrapBlazor.Shared/images/dotnet_foundation_v4.png" width="100" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/dotnet_foundation_v4.png")" width="100" />
         </a>
     </div>
     <div class="footer-body">
@@ -79,7 +79,7 @@
             <a class="d-none d-lg-block me-3" href="https://beian.miit.gov.cn/" target="_blank">鲁ICP备19015061号-4</a>
         </div>
         <div class="d-md-flex d-none">
-            <img alt="global" class="footer-lang" src="./_content/BootstrapBlazor.Shared/images/global.svg" />
+            <img alt="global" class="footer-lang" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/global.svg")" />
             <a @onclick:preventDefault @onclick="@(e => SetLang("zh-CN"))">简 体</a>
             <span class="mx-1">/</span>
             <a @onclick:preventDefault @onclick="@(e => SetLang("en-US"))">English</a>
diff --git a/src/BootstrapBlazor.Shared/Components/Layout/MainLayout.razor b/src/BootstrapBlazor.Shared/Components/Layout/MainLayout.razor
index 2c1bd01568d..507146aa844 100644
--- a/src/BootstrapBlazor.Shared/Components/Layout/MainLayout.razor
+++ b/src/BootstrapBlazor.Shared/Components/Layout/MainLayout.razor
@@ -26,5 +26,5 @@
 
     <ThemeChooser></ThemeChooser>
 
-    <LinkButton TooltipPlacement="Placement.Left" ButtonStyle="ButtonStyle.Circle" Color="Color.None" TooltipText="@Title" class="btn-fade btn-update" Url="@WebsiteOption.CurrentValue.WikiUrl" Target="_blank" ImageUrl="./_content/BootstrapBlazor.Shared/images/log.svg"></LinkButton>
+    <LinkButton TooltipPlacement="Placement.Left" ButtonStyle="ButtonStyle.Circle" Color="Color.None" TooltipText="@Title" class="btn-fade btn-update" Url="@WebsiteOption.CurrentValue.WikiUrl" Target="_blank" ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/log.svg")"></LinkButton>
 </section>
diff --git a/src/BootstrapBlazor.Shared/Components/Layout/NavMenu.razor b/src/BootstrapBlazor.Shared/Components/Layout/NavMenu.razor
index 21ae1399efd..4d2c14fa695 100644
--- a/src/BootstrapBlazor.Shared/Components/Layout/NavMenu.razor
+++ b/src/BootstrapBlazor.Shared/Components/Layout/NavMenu.razor
@@ -1,5 +1,5 @@
 ﻿@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Layout/NavMenu.razor.js")]
+@attribute [JSModuleAutoLoader("Layout/NavMenu.razor.js")]
 
 <nav class="navbar navbar-dark d-flex d-md-none px-3" id="@Id">
     <a class="navbar-brand" href="">Bootstrap Blazor</a>
diff --git a/src/BootstrapBlazor.Shared/Components/Layout/PageLayout.razor b/src/BootstrapBlazor.Shared/Components/Layout/PageLayout.razor
index 1561b81fc00..a4c7fc6d4d4 100644
--- a/src/BootstrapBlazor.Shared/Components/Layout/PageLayout.razor
+++ b/src/BootstrapBlazor.Shared/Components/Layout/PageLayout.razor
@@ -2,7 +2,7 @@
 @inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <HeadContent>
-    <link href="./_content/BootstrapBlazor.Shared/css/layout.css" rel="stylesheet" />
+    <link href="@WebsiteOption.CurrentValue.GetAssetUrl("css/layout.css")" rel="stylesheet" />
 </HeadContent>
 
 <CascadingValue Value="this" IsFixed="true">
@@ -12,7 +12,7 @@
         <Header>
             <span class="ms-3 flex-fill">Bootstrap of Blazor</span>
             <Widget></Widget>
-            <Logout ImageUrl="./_content/BootstrapBlazor.Shared/images/Argo-C.png" DisplayName="超级管理员" UserName="Admin">
+            <Logout ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" DisplayName="超级管理员" UserName="Admin">
                 <LinkTemplate>
                     <a href="#"><i class="fa-solid fa-suitcase"></i>个人中心</a>
                     <a href="#"><i class="fa-solid fa-cog"></i>设置</a>
@@ -23,7 +23,7 @@
         </Header>
         <Side>
             <div class="layout-banner">
-                <img alt="logo" class="layout-logo" src="./_content/BootstrapBlazor.Shared/images/logo.png" />
+                <img alt="logo" class="layout-logo" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/logo.png")" />
                 <div class="layout-title">
                     <span>后台管理</span>
                 </div>
diff --git a/src/BootstrapBlazor.Shared/Components/Layout/TutorialsNavMenu.razor b/src/BootstrapBlazor.Shared/Components/Layout/TutorialsNavMenu.razor
index ba0593f2ff7..d9bdccfd0c5 100644
--- a/src/BootstrapBlazor.Shared/Components/Layout/TutorialsNavMenu.razor
+++ b/src/BootstrapBlazor.Shared/Components/Layout/TutorialsNavMenu.razor
@@ -1,5 +1,5 @@
 ﻿@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Layout/NavMenu.razor.js")]
+@attribute [JSModuleAutoLoader("Layout/NavMenu.razor.js")]
 @inject DownloadService DownloadService
 
 <div class="navbar navbar-dark d-flex d-md-none px-3" id="@Id">
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor b/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor
index c86c5240bf1..c252677c2b0 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor
@@ -1,7 +1,7 @@
 ﻿@page "/ai-chat"
 @using Azure.AI.OpenAI
 @inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Pages/Chats.razor.js")]
+@attribute [JSModuleAutoLoader("Pages/Chats.razor.js")]
 
 <h3>@Localizer["ChatsTitle"]</h3>
 
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor.cs b/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor.cs
index efa8c4b9bfc..ee8c2356749 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Chats.razor.cs
@@ -3,7 +3,6 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
-using Azure.AI.OpenAI;
 using System.Collections.Concurrent;
 
 namespace BootstrapBlazor.Shared.Components.Pages;
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Index.razor b/src/BootstrapBlazor.Shared/Components/Pages/Index.razor
index d5dda4fd054..d2fd3e2d060 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Index.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Index.razor
@@ -2,6 +2,7 @@
 @page "/"
 @page "/index"
 @page "/home"
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <section class="bd-masthead">
     <div class="container-xxl bd-gutter">
@@ -34,6 +35,6 @@
     <div class="donate">
         <h3>@Localizer["DonateH1"]</h3>
         <h5 class="d-none d-sm-block mb-3">@Localizer["DonateH2"]</h5>
-        <img alt="barcode" class="barcode" src="./_content/BootstrapBlazor.Shared/images/BarCode@2x.png" />
+        <img alt="barcode" class="barcode" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/BarCode@2x.png")" />
     </div>
 </section>
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Index.razor.js b/src/BootstrapBlazor.Shared/Components/Pages/Index.razor.js
deleted file mode 100644
index 4cd55e666cc..00000000000
--- a/src/BootstrapBlazor.Shared/Components/Pages/Index.razor.js
+++ /dev/null
@@ -1,79 +0,0 @@
-﻿import Data from '../../_content/BootstrapBlazor/modules/data.js'
-
-export function init(id, text1, text2, text3) {
-    const el = document.getElementById(id)
-    const index = {
-        element: el, text1, text2, text3,
-        cursorElement: el.nextElementSibling,
-        type: () => {
-            const typeChar = (original, reverse) => {
-                const plant = original.concat()
-                return new Promise((resolver, reject) => {
-                    index.cursorElement.classList.add('active')
-                    index.eventHandler = setInterval(() => {
-                        if (plant.length > 0) {
-                            if (!reverse) {
-                                index.element.textContent = index.element.textContent + plant.shift()
-                            }
-                            else {
-                                plant.pop()
-                                index.element.textContent = plant.join('')
-                            }
-                        }
-                        else {
-                            clearInterval(index.eventHandler)
-                            index.eventHandler = false
-                            index.cursorElement.classList.remove('active')
-
-                            index.typeHandler = window.setTimeout(() => {
-                                window.clearTimeout(index.typeHandler)
-                                index.typeHandler = false
-                                if (reverse) {
-                                    return resolver()
-                                } else {
-                                    typeChar(original, true).then(() => {
-                                        return resolver()
-                                    })
-                                }
-                            }, 1000)
-                        }
-                    }, 200)
-                })
-            }
-
-            const loop = () => {
-                index.handler = setTimeout(() => {
-                    clearTimeout(index.handler)
-                    index.handler = false
-                    typeChar(text1, false).then(() => {
-                        typeChar(text2, false).then(() => {
-                            typeChar(text3).then(() => {
-                                loop()
-                            })
-                        })
-                    })
-                }, 200)
-            }
-
-            loop()
-        }
-    }
-
-    index.type()
-    Data.set(id, index)
-}
-
-export function dispose(id) {
-    const index = Data.get(id)
-    Data.remove(id)
-
-    if (index.handler) {
-        clearTimeout(index.handler)
-    }
-    if (index.eventHandler) {
-        clearInterval(index.eventHandler)
-    }
-    if (index.typeHandler) {
-        clearTimeout(index.typeHandler)
-    }
-}
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Install.razor b/src/BootstrapBlazor.Shared/Components/Pages/Install.razor
index bbdf5bbc3d2..c13cb3b87c3 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Install.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Install.razor
@@ -12,13 +12,13 @@
 <div class="row mb-sm-3">
     <div class="git col-12 col-sm-6 mb-3 mb-sm-0">
         <a class="git-fork" href="https://fork.dev/" target="_blank">
-            <img alt="fork" src="./_content/BootstrapBlazor.Shared/images/fork.png" />
+            <img alt="fork" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/fork.png")" />
             <span>Fork</span>
         </a>
     </div>
     <div class="git col-12 col-sm-6 mb-3 mb-sm-0">
         <a href="https://tortoisegit.org/download/" target="_blank">
-            <img alt="tortoisegit" src="./_content/BootstrapBlazor.Shared/images/tortoisegit.svg" />
+            <img alt="tortoisegit" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/tortoisegit.svg")" />
         </a>
     </div>
 </div>
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Install_Maui.razor b/src/BootstrapBlazor.Shared/Components/Pages/Install_Maui.razor
index ed166a5c436..40af921122f 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Install_Maui.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Install_Maui.razor
@@ -1,6 +1,7 @@
 ﻿@page "/install-maui"
 @inject IStringLocalizer<Install_Maui> Localizer
 @inject PackageVersionService VersionManager
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Title</h3>
 
@@ -18,15 +19,15 @@
 <p class="code-label">1.Visual Studio</p>
 <p class="code-label">2. @Localizer["P5"]</p>
 <p class="code-label">3. @Localizer["P6"] <b>@Localizer["P7"]</b> @Localizer["P8"] <b>@Localizer["P9"]</b>, @Localizer["P10"] <b>@Localizer["P11"]</b>, <b>@Localizer["P12"]</b></p>
-<img src="./_content/BootstrapBlazor.Shared/images/choose-project-template-maui-blazor.png" style="border-radius: 6px;" class="d-none d-sm-block" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/choose-project-template-maui-blazor.png")" style="border-radius: 6px;" class="d-none d-sm-block" />
 
 <h5>@Localizer["P13"]</h5>
 <p class="code-label">@((MarkupString)Localizer["P14"].Value)</p>
 <p>@Localizer["P15"] <b>Manage Nuget Packages</b></p>
 <Pre @key="@Version" class="no-highlight">dotnet add package BootstrapBlazor --version @Version</Pre>
-<img src="./_content/BootstrapBlazor.Shared/images/manage-nuget-packages-for-maui-app.png" style="border-radius: 6px;" class="d-none d-sm-block" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/manage-nuget-packages-for-maui-app.png")" style="border-radius: 6px;" class="d-none d-sm-block" />
 <p class="code-label">@Localizer["P16"]</p>
-<img src="./_content/BootstrapBlazor.Shared/images/nuget_install.png" style="width: 1000px; border-radius: 6px;" class="d-none d-sm-block" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/nuget_install.png")" style="width: 1000px; border-radius: 6px;" class="d-none d-sm-block" />
 <p class="code-label">@Localizer["P17"]</p>
 <p>@Localizer["P18"]</p>
 <ul class="ul-demo">
@@ -92,7 +93,7 @@ return builder.Build();
 <p class="code-label">@Localizer["P34"] <code>Button</code> @Localizer["P35"]</p>
 <Pre>&lt;Button Color="Color.Primary" Icon="fa-solid fa-font-awesome" Text="@Localizer["P36"]" /&gt;</Pre>
 <p class="code-label">@Localizer["P37"] <b>Visual studio</b> @Localizer["P38"] <kbd>F5</kbd> @Localizer["P39"]</p>
-<img src="./_content/BootstrapBlazor.Shared/images/preview-maui.png" style="border-radius: 6px;" class="d-none d-sm-block" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/preview-maui.png")" style="border-radius: 6px;" class="d-none d-sm-block" />
 
 <h4 class="code-label">@Localizer["P40"]</h4>
 <p class="code-label">@Localizer["P41"] <code>NativeContent.xaml</code> @Localizer["P42"]</p>
@@ -205,7 +206,7 @@ return builder.Build();
     }
 }</Pre>
 <p class="code-label">@Localizer["P48"] <b>Visual studio</b> @Localizer["P49"] <kbd>F5</kbd> @Localizer["P50"]</p>
-<img src="./_content/BootstrapBlazor.Shared/images/maui-blazor.gif" style="border-radius: 6px;width: 320px;" class="d-none d-sm-block" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/maui-blazor.gif")" style="border-radius: 6px;width: 320px;" class="d-none d-sm-block" />
 
 @code
 {
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Install_Server.razor b/src/BootstrapBlazor.Shared/Components/Pages/Install_Server.razor
index 48c28192c8e..d467701409f 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Install_Server.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Install_Server.razor
@@ -1,10 +1,11 @@
 ﻿@page "/install-server"
 @inject IStringLocalizer<Install_Server> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <InstallContent Title="@Localizer["Title"]">
     <ChooseTemplate>
         <p class="code-label">4. @Localizer["D1"] <b>Blazor Server App</b> @Localizer["D2"] <b>Create</b></p>
-        <img src="./_content/BootstrapBlazor.Shared/images/choose-project-template-server-blazor.png" style="border-radius: 6px;" class="d-none d-sm-block" />
+        <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/choose-project-template-server-blazor.png")" style="border-radius: 6px;" class="d-none d-sm-block" />
     </ChooseTemplate>
     <SheetTemplate>
         <ul class="ul-demo">
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Install_wasm.razor b/src/BootstrapBlazor.Shared/Components/Pages/Install_wasm.razor
index c45799423c2..859d946c647 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Install_wasm.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Install_wasm.razor
@@ -1,10 +1,11 @@
 ﻿@page "/install-wasm"
 @inject IStringLocalizer<Install_wasm> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <InstallContent Title="@Localizer["Install_wasmHeading"]">
     <ChooseTemplate>
         <p class="code-label">4. @((MarkupString)Localizer["Install_wasmDescription"].Value)</p>
-        <img src="./_content/BootstrapBlazor.Shared/images/choose-project-template.png" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block" />
+        <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/choose-project-template.png")" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block" />
     </ChooseTemplate>
     <SheetTemplate>
         <p><code>wwwroot/index.html</code></p>
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Localization.razor b/src/BootstrapBlazor.Shared/Components/Pages/Localization.razor
index 8c5a857b0d6..f395c7f3f35 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Localization.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Localization.razor
@@ -9,7 +9,7 @@
 
 <Tips>
     <div>@Localizer["T1"] <a href="https://docs.microsoft.com/zh-cn/aspnet/core/blazor/globalization-localization" target="_blank">@Localizer["T2"]</a></div>
-    <div>@Localizer["T3"] <code>wasm</code> @Localizer["T4"] <code>en</code>，<Anchor Target="lang">@Localizer["T5"]</Anchor></div>
+    <div>@Localizer["T3"] <code>wasm</code> @Localizer["T4"] <code>en</code></div>
     <div>@((MarkupString)Localizer["LocalizationFileDesc"].Value)</div>
 </Tips>
 
diff --git a/src/BootstrapBlazor.Shared/Components/Pages/Template.razor b/src/BootstrapBlazor.Shared/Components/Pages/Template.razor
index 44fe5c1a351..8eca51827f9 100644
--- a/src/BootstrapBlazor.Shared/Components/Pages/Template.razor
+++ b/src/BootstrapBlazor.Shared/Components/Pages/Template.razor
@@ -32,20 +32,20 @@
 
 <p>@Localizer["P10"] <b>Visual Studio @Localizer["P11"]</b> @Localizer["P12"] <b>@Localizer["P13"]</b> <a href="https://marketplace.visualstudio.com/items?itemName=Longbow.BootstrapBlazorUITemplate" target="_blank">[@Localizer["P14"]]</a> @Localizer["P15"] <a href="@TemplateUrl" target="_blank">[@Localizer["P16"]]</a></p>
 
-<img src="./_content/BootstrapBlazor.Shared/images/search-extensions.png" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/search-extensions.png")" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
 
-<img src="./_content/BootstrapBlazor.Shared/images/download-extensions.png" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/download-extensions.png")" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
 
 <p class="code-label">2. @Localizer["P17"]</p>
 
-<img src="./_content/BootstrapBlazor.Shared/images/install-extensions.png" style="width: auto; border-radius: 6px;" class="d-none d-sm-block mb-3" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/install-extensions.png")" style="width: auto; border-radius: 6px;" class="d-none d-sm-block mb-3" />
 
-<img src="./_content/BootstrapBlazor.Shared/images/install-finish.png" style="width: auto; border-radius: 6px;" class="d-none d-sm-block mb-3" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/install-finish.png")" style="width: auto; border-radius: 6px;" class="d-none d-sm-block mb-3" />
 
 <p class="code-label">3. @Localizer["P18"]</p>
 
-<img src="./_content/BootstrapBlazor.Shared/images/create-project.png" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/create-project.png")" style="width: 800px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
 
-<img src="./_content/BootstrapBlazor.Shared/images/project.png" style="width: 400px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
+<img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/project.png")" style="width: 400px; border-radius: 6px;" class="d-none d-sm-block mb-3" />
 
 <Video Name="template" />
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/AutoFills.razor b/src/BootstrapBlazor.Shared/Components/Samples/AutoFills.razor
index 8fe89f96a1b..41487ad5d9b 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/AutoFills.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/AutoFills.razor
@@ -1,5 +1,6 @@
 ﻿@page "/auto-fill"
 @inject IStringLocalizer<AutoFills> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["Title"]</h3>
 <h4>@Localizer["Description"]</h4>
@@ -13,7 +14,7 @@
         <Template>
             <div class="d-flex">
                 <div>
-                    <img src="@Foo.GetAvatarUrl(context.Id)" class="bb-avatar" />
+                    <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(context.Id)" class="bb-avatar" />
                 </div>
                 <div class="ps-2">
                     <div>@context.Name</div>
@@ -22,7 +23,7 @@
             </div>
         </Template>
     </AutoFill>
-    <img src="@Foo.GetAvatarUrl(Model.Id)" class="shadow" style="width: 140px; margin-bottom: 1rem; border-radius: 6px;" />
+    <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(Model.Id)" class="shadow" style="width: 140px; margin-bottom: 1rem; border-radius: 6px;" />
     <EditorForm Model="@Model" RowType="RowType.Inline" ItemsPerRow="2" />
 </DemoBlock>
 
@@ -33,7 +34,7 @@
         <Template>
             <div class="d-flex">
                 <div>
-                    <img src="@Foo.GetAvatarUrl(context.Id)" class="bb-avatar" />
+                    <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(context.Id)" class="bb-avatar" />
                 </div>
                 <div class="ps-2">
                     <div>@context.Name</div>
@@ -54,7 +55,7 @@
         <Template>
             <div class="d-flex">
                 <div>
-                    <img src="@Foo.GetAvatarUrl(context.Id)" class="bb-avatar" />
+                    <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(context.Id)" class="bb-avatar" />
                 </div>
                 <div class="ps-2">
                     <div>@context.Name</div>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor b/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor
index 0c753c4a098..197bb641c95 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor
@@ -1,5 +1,6 @@
 ﻿@page "/avatar"
 @inject IStringLocalizer<Avatars> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["Title"]</h3>
 
@@ -9,24 +10,24 @@
     <div class="d-flex flex-column">
         <p class="text-center">Circle</p>
         <div class="d-flex justify-content-between align-items-center">
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" Size="Size.ExtraExtraLarge" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" Size="Size.ExtraLarge" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" Size="Size.Large" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" Size="Size.Small" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" Size="Size.ExtraSmall" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" Size="Size.ExtraExtraLarge" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" Size="Size.ExtraLarge" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" Size="Size.Large" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" Size="Size.Small" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" Size="Size.ExtraSmall" />
         </div>
     </div>
     <Divider Text="@Localizer["BasicUsageDivider"]" />
     <div class="d-flex flex-column">
         <p class="text-center mt-3">Square</p>
         <div class="d-flex justify-content-between align-items-center">
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo.png" Size="Size.ExtraExtraLarge" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo.png" Size="Size.ExtraLarge" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo.png" Size="Size.Large" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo.png" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo.png" Size="Size.Small" />
-            <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo.png" Size="Size.ExtraSmall" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" Size="Size.ExtraExtraLarge" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" Size="Size.ExtraLarge" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" Size="Size.Large" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" Size="Size.Small" />
+            <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" Size="Size.ExtraSmall" />
         </div>
     </div>
 </DemoBlock>
@@ -34,15 +35,15 @@
 <DemoBlock Title="@Localizer["IconTitle"]" Introduction="@Localizer["IconIntro"]" Name="Icon">
     <div class="d-flex justify-content-between align-items-center">
         <Avatar IsCircle="true" IsIcon="true" Icon="fa-solid fa-user" />
-        <Avatar IsCircle="true" Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" />
+        <Avatar IsCircle="true" Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" />
         <Avatar IsCircle="true" IsText="true" Text="User" />
     </div>
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["BorderTitle"]" Introduction="@Localizer["BorderIntro"]" Name="Border">
     <div class="d-flex justify-content-between align-items-center">
-        <Avatar IsCircle="false" IsBorder="true" Url="./_content/BootstrapBlazor.Shared/images/avatar2.png" />
-        <Avatar IsCircle="true" IsBorder="true" Url="./_content/BootstrapBlazor.Shared/images/Argo-c1.png" />
+        <Avatar IsCircle="false" IsBorder="true" Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/avatar2.png")" />
+        <Avatar IsCircle="true" IsBorder="true" Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-c1.png")" />
         <Avatar IsCircle="true" IsBorder="true" IsIcon="true" Icon="fa-solid fa-tv" />
         <Avatar IsCircle="true" IsBorder="true" IsText="true" Text="AZ" />
     </div>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor.cs
index 5ee86a6aa19..243d1100209 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Avatars.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
@@ -10,11 +12,11 @@ namespace BootstrapBlazor.Shared.Components.Samples;
 /// </summary>
 public sealed partial class Avatars
 {
-    private static async Task<string> GetUrlAsync()
+    private async Task<string> GetUrlAsync()
     {
         // 模拟异步获取图像地址
         await Task.Delay(500);
-        return "./_content/BootstrapBlazor.Shared/images/Argo-C.png";
+        return $"{WebsiteOption.CurrentValue.AssetRootPath}images/Argo-C.png";
     }
 
     /// <summary>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/BarcodeGenerators.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/BarcodeGenerators.razor.cs
index fafa27295c6..6799623e106 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/BarcodeGenerators.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/BarcodeGenerators.razor.cs
@@ -3,8 +3,6 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
-using System.ComponentModel;
-
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Captchas.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Captchas.razor.cs
index 31ab96f96e2..143305881ac 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Captchas.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Captchas.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
@@ -10,6 +12,10 @@ namespace BootstrapBlazor.Shared.Components.Samples;
 /// </summary>
 public sealed partial class Captchas
 {
+    [Inject]
+    [NotNull]
+    private IOptions<WebsiteOptions>? WebsiteOption { get; set; }
+
     private static Random ImageRandomer { get; set; } = new Random();
 
     /// <summary>
@@ -28,12 +34,13 @@ private string GetImageName()
     /// <summary>
     /// 获得/设置 图床路径 默认值为 Pic.jpg 通过设置 Max 取 Pic0.jpg ... Pic8.jpg
     /// </summary>
-    public string ImagesName { get; set; } = "Pic.jpg";
+    private string ImagesName { get; set; } = "Pic.jpg";
 
     /// <summary>
     /// 获得/设置 图床路径 默认值为 images
     /// </summary>
-    public string ImagesPath { get; set; } = "./_content/BootstrapBlazor.Shared/images";
+    [NotNull]
+    private string? ImagesPath { get; set; }
 
     [NotNull]
     private Captcha? NormalCaptcha { get; set; }
@@ -41,6 +48,16 @@ private string GetImageName()
     [NotNull]
     private ConsoleLogger? NormalLogger { get; set; }
 
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+
+        ImagesPath = $"{WebsiteOption.Value.AssetRootPath}images";
+    }
+
     private async Task OnValidAsync(bool ret)
     {
         var result = ret ? "成功" : "失败";
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor b/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor
index bfffdc57b90..dead938d0b1 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor
@@ -1,36 +1,37 @@
 ﻿@page "/carousel"
 @inject IStringLocalizer<Carousels> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["Title"]</h3>
 
 <h4>@Localizer["SubTitle"]</h4>
 
 <DemoBlock Title="@Localizer["BasicUsageTitle"]" Introduction="@Localizer["BasicUsageIntro"]" Name="Normal">
-    <Carousel Images="@Images" Width="280" ShowControls="false" ShowIndicators="false" />
+    <Carousel Images="@_images" Width="280" ShowControls="false" ShowIndicators="false" />
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["ShowControlsTitle"]" Introduction="@Localizer["ShowControlsIntro"]" Name="ShowControls">
-    <Carousel Images="@Images" Width="280" ShowControls="true" ShowIndicators="false" />
+    <Carousel Images="@_images" Width="280" ShowControls="true" ShowIndicators="false" />
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["ShowIndicatorsTitle"]" Introduction="@Localizer["ShowIndicatorsIntro"]" Name="ShowIndicators">
-    <Carousel Images="@Images" Width="280" ShowControls="true" ShowIndicators="true" />
+    <Carousel Images="@_images" Width="280" ShowControls="true" ShowIndicators="true" />
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["FadeTitle"]" Introduction="@Localizer["FadeIntro"]" Name="Fade">
-    <Carousel Images="@Images" Width="280" IsFade="true" />
+    <Carousel Images="@_images" Width="280" IsFade="true" />
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["CaptionTitle"]" Introduction="@Localizer["CaptionIntro"]" Name="Caption">
     <Carousel Width="280" IsFade="true">
         <CarouselItem Caption="First slide label">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic0.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic0.jpg")" alt="demo-image" />
         </CarouselItem>
         <CarouselItem Caption="Second slide label">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic1.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic1.jpg")" alt="demo-image" />
         </CarouselItem>
         <CarouselItem Caption="Thrid slide label">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic2.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic2.jpg")" alt="demo-image" />
         </CarouselItem>
     </Carousel>
 </DemoBlock>
@@ -38,13 +39,13 @@
 <DemoBlock Title="@Localizer["IntervalTitle"]" Introduction="@Localizer["IntervalIntro"]" Name="Interval">
     <Carousel Width="280" IsFade="true">
         <CarouselItem Caption="First slide label" Interval="5000">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic0.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic0.jpg")" alt="demo-image" />
         </CarouselItem>
         <CarouselItem Caption="Second slide label" Interval="2000">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic1.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic1.jpg")" alt="demo-image" />
         </CarouselItem>
         <CarouselItem Caption="Thrid slide label">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic2.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic2.jpg")" alt="demo-image" />
         </CarouselItem>
     </Carousel>
 </DemoBlock>
@@ -57,7 +58,7 @@
                 <p>Pic0.jpg</p>
             </CaptionTemplate>
             <ChildContent>
-                <img src="./_content/BootstrapBlazor.Shared/images/Pic0.jpg" alt="demo-image" />
+                <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic0.jpg")" alt="demo-image" />
             </ChildContent>
         </CarouselItem>
         <CarouselItem>
@@ -66,7 +67,7 @@
                 <p>Pic1.jpg</p>
             </CaptionTemplate>
             <ChildContent>
-                <img src="./_content/BootstrapBlazor.Shared/images/Pic1.jpg" alt="demo-image" />
+                <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic1.jpg")" alt="demo-image" />
             </ChildContent>
         </CarouselItem>
         <CarouselItem>
@@ -75,7 +76,7 @@
                 <p>Pic2.jpg</p>
             </CaptionTemplate>
             <ChildContent>
-                <img src="./_content/BootstrapBlazor.Shared/images/Pic2.jpg" alt="demo-image" />
+                <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic2.jpg")" alt="demo-image" />
             </ChildContent>
         </CarouselItem>
     </Carousel>
@@ -90,7 +91,7 @@
                 <p>Pic0.jpg</p>
             </CaptionTemplate>
             <ChildContent>
-                <img src="./_content/BootstrapBlazor.Shared/images/Pic0.jpg" alt="demo-image" />
+                <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic0.jpg")" alt="demo-image" />
             </ChildContent>
         </CarouselItem>
         <CarouselItem CaptionClass="d-none d-md-block">
@@ -99,7 +100,7 @@
                 <p>Pic1.jpg</p>
             </CaptionTemplate>
             <ChildContent>
-                <img src="./_content/BootstrapBlazor.Shared/images/Pic1.jpg" alt="demo-image" />
+                <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic1.jpg")" alt="demo-image" />
             </ChildContent>
         </CarouselItem>
         <CarouselItem CaptionClass="d-none d-md-block">
@@ -108,7 +109,7 @@
                 <p>Pic2.jpg</p>
             </CaptionTemplate>
             <ChildContent>
-                <img src="./_content/BootstrapBlazor.Shared/images/Pic2.jpg" alt="demo-image" />
+                <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic2.jpg")" alt="demo-image" />
             </ChildContent>
         </CarouselItem>
     </Carousel>
@@ -116,20 +117,20 @@
 
 <DemoBlock Title="@Localizer["OnClickTitle"]" Introduction="@Localizer["OnClickIntro"]" Name="OnClick">
     <h3>CarouselOnClick</h3>
-    <Carousel Images="@Images" Width="280" IsFade="true" OnClick="@OnClick"></Carousel>
+    <Carousel Images="@_images" Width="280" IsFade="true" OnClick="@OnClick"></Carousel>
     <ConsoleLogger @ref="OnClickLogger" />
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["TouchSwipingTitle"]" Introduction="@Localizer["TouchSwipingIntro"]" Name="DisableTouchSwiping">
     <Carousel Width="280" IsFade="true" DisableTouchSwiping="true">
         <CarouselItem Caption="First slide label" Interval="5000">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic0.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic0.jpg")" alt="demo-image" />
         </CarouselItem>
         <CarouselItem Caption="Second slide label" Interval="2000">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic1.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic1.jpg")" alt="demo-image" />
         </CarouselItem>
         <CarouselItem Caption="Thrid slide label">
-            <img src="./_content/BootstrapBlazor.Shared/images/Pic2.jpg" alt="demo-image" />
+            <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Pic2.jpg")" alt="demo-image" />
         </CarouselItem>
     </Carousel>
 </DemoBlock>
@@ -143,7 +144,7 @@
                         <div>Sales champion</div>
                         <div>www.blazor.zone</div>
                     </div>
-                    <img src="./_content/BootstrapBlazor.Shared/images/avatars/150-5.jpg" alt="demo-image" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/avatars/150-5.jpg")" alt="demo-image" />
                     <div class="bottom">
                         Carousel Item
                     </div>
@@ -153,7 +154,7 @@
                         <div>Sales champion</div>
                         <div>www.blazor.zone</div>
                     </div>
-                    <img src="./_content/BootstrapBlazor.Shared/images/avatars/150-7.jpg" alt="demo-image" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/avatars/150-7.jpg")" alt="demo-image" />
                     <div class="bottom">
                         Carousel Item
                     </div>
@@ -163,7 +164,7 @@
                         <div>Sales champion</div>
                         <div>www.blazor.zone</div>
                     </div>
-                    <img src="./_content/BootstrapBlazor.Shared/images/avatars/150-11.jpg" alt="demo-image" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/avatars/150-11.jpg")" alt="demo-image" />
                     <div class="bottom">
                         Carousel Item
                     </div>
@@ -177,7 +178,7 @@
                         <div>Sales champion</div>
                         <div>www.blazor.zone</div>
                     </div>
-                    <img src="./_content/BootstrapBlazor.Shared/images/avatars/150-6.jpg" alt="demo-image" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/avatars/150-6.jpg")" alt="demo-image" />
                     <div class="bottom">
                         Carousel Item
                     </div>
@@ -187,7 +188,7 @@
                         <div>Sales champion</div>
                         <div>www.blazor.zone</div>
                     </div>
-                    <img src="./_content/BootstrapBlazor.Shared/images/avatars/150-12.jpg" alt="demo-image" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/avatars/150-12.jpg")" alt="demo-image" />
                     <div class="bottom">
                         Carousel Item
                     </div>
@@ -197,7 +198,7 @@
                         <div>Sales champion</div>
                         <div>www.blazor.zone</div>
                     </div>
-                    <img src="./_content/BootstrapBlazor.Shared/images/avatars/150-15.jpg" alt="demo-image" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/avatars/150-15.jpg")" alt="demo-image" />
                     <div class="bottom">
                         Carousel Item
                     </div>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor.cs
index 919d8344a74..702ccd4bb6a 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Carousels.razor.cs
@@ -13,15 +13,21 @@ public sealed partial class Carousels
     [NotNull]
     private ConsoleLogger? OnClickLogger { get; set; }
 
+    private readonly List<string> _images = [];
+
     /// <summary>
-    /// Images
+    /// <inheritdoc/>
     /// </summary>
-    private static List<string> Images =>
-    [
-        "./_content/BootstrapBlazor.Shared/images/Pic0.jpg",
-        "./_content/BootstrapBlazor.Shared/images/Pic1.jpg",
-        "./_content/BootstrapBlazor.Shared/images/Pic2.jpg"
-    ];
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+
+        _images.AddRange([
+            $"{WebsiteOption.CurrentValue.AssetRootPath}images/Pic0.jpg",
+            $"{WebsiteOption.CurrentValue.AssetRootPath}images/Pic1.jpg",
+            $"{WebsiteOption.CurrentValue.AssetRootPath}images/Pic2.jpg"
+        ]);
+    }
 
     /// <summary>
     /// OnClick
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Charts/Line.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Charts/Line.razor.cs
index 0f612e4548c..f82e45b6496 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Charts/Line.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Charts/Line.razor.cs
@@ -10,7 +10,7 @@ namespace BootstrapBlazor.Shared.Components.Samples.Charts;
 /// <summary>
 /// Line 图表示例
 /// </summary>
-[JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Samples/Charts/Line.razor.js", JSObjectReference = true)]
+[JSModuleAutoLoader("Samples/Charts/Line.razor.js", JSObjectReference = true)]
 public partial class Line : IDisposable
 {
     private readonly Random _randomer = new();
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor b/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor
index a5a2c8706b1..9c7a9eaaf80 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor
@@ -1,4 +1,5 @@
 ﻿@page "/cherry-markdown"
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["Header"]</h3>
 <h4>@Localizer["Tip"]</h4>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor.cs
index a7201af0504..76c2168ffbf 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/CherryMarkdowns.razor.cs
@@ -3,8 +3,6 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
-using Microsoft.Extensions.Options;
-
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
@@ -50,15 +48,11 @@ private async Task InsertPicture()
         }
     };
 
-    [Inject]
-    [NotNull]
-    private IOptionsMonitor<WebsiteOptions>? SiteOptions { get; set; }
-
     private async Task<string> OnFileUpload(CherryMarkdownUploadFile arg)
     {
         var url = Path.Combine("images", "uploader",
             $"{Path.GetFileNameWithoutExtension(arg.FileName)}-{DateTimeOffset.Now:yyyyMMddHHmmss}{Path.GetExtension(arg.FileName)}");
-        var fileName = Path.Combine(SiteOptions.CurrentValue.WebRootPath, url);
+        var fileName = Path.Combine(WebsiteOption.CurrentValue.WebRootPath, url);
         var ret = await arg.SaveToFile(fileName);
         return ret ? url : "";
     }
@@ -67,7 +61,7 @@ private async Task<string> OnFileUpload(CherryMarkdownUploadFile arg)
     [NotNull]
     private IStringLocalizer<CherryMarkdowns>? Localizer { get; set; }
 
-    private AttributeItem[] GetAttributes() =>
+    private static AttributeItem[] GetAttributes() =>
     [
         new()
         {
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor b/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor
index 238d27b2168..3f18680b031 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor
@@ -1,8 +1,8 @@
 ﻿@page "/download"
 @inject IStringLocalizer<Downloads> Localizer
-@inject IOptionsMonitor<WebsiteOptions> SiteOptions
 @inject ToastService ToastService
 @inject DownloadService DownloadService
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["DownloadsTitle"]</h3>
 <h4>@Localizer["DownloadsSubTitle"]</h4>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor.cs
index 4c50da937b7..933f0234f8f 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Downloads.razor.cs
@@ -18,7 +18,7 @@ private async Task DownloadPhysicalFileAsync()
     {
         try
         {
-            var filePath = Path.Combine(SiteOptions.CurrentValue.WebRootPath, "favicon.png");
+            var filePath = Path.Combine(WebsiteOption.CurrentValue.WebRootPath, "favicon.png");
             await using var stream = File.OpenRead(filePath);
             await DownloadService.DownloadFromStreamAsync("favicon.png", stream);
         }
@@ -48,7 +48,7 @@ private async Task DownloadFolderAsync()
     {
         try
         {
-            await DownloadService.DownloadFolderAsync("test.zip", SiteOptions.CurrentValue.WebRootPath);
+            await DownloadService.DownloadFolderAsync("test.zip", WebsiteOption.CurrentValue.WebRootPath);
         }
         catch (FileNotFoundException msg)
         {
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIconList.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIconList.razor.cs
index 46ecc3ce429..b52c577bdb6 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIconList.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIconList.razor.cs
@@ -8,7 +8,7 @@ namespace BootstrapBlazor.Shared.Components.Samples.Icons;
 /// <summary>
 /// AntDesignIconList 组件
 /// </summary>
-[JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIconList.razor.js")]
+[JSModuleAutoLoader("Samples/Icons/AntDesignIconList.razor.js")]
 public partial class AntDesignIconList
 {
     private string? ClassString => CssBuilder.Default("icon-list")
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIcons.razor b/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIcons.razor
index 841dae760a2..d93aaa433f2 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIcons.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/AntDesignIcons.razor
@@ -2,6 +2,10 @@
 @layout MainLayout
 @inject IStringLocalizer<AntDesignIcons> Localizer
 
+<HeadContent>
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.AntDesignIcon/BootstrapBlazor.AntDesignIcon.bundle.scp.css"]" />
+</HeadContent>
+
 <h3>@Localizer["AntDesignIconTitle"]</h3>
 
 <h4>@Localizer["AntDesignIconDescription"]</h4>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/BootstrapIcons.razor b/src/BootstrapBlazor.Shared/Components/Samples/Icons/BootstrapIcons.razor
index c62f8611cdb..36ff16a33ed 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/BootstrapIcons.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/BootstrapIcons.razor
@@ -2,6 +2,10 @@
 @layout MainLayout
 @inject IStringLocalizer<BootstrapIcons> Localizer
 
+<HeadContent>
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.BootstrapIcon/css/bootstrap.min.css"]" />
+</HeadContent>
+
 <h3>@Localizer["Title"]</h3>
 
 <h4>@((MarkupString)Localizer["BaseUsageText"].Value)</h4>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIconList.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIconList.razor.cs
index 49324237440..0e003e54798 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIconList.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIconList.razor.cs
@@ -8,7 +8,7 @@ namespace BootstrapBlazor.Shared.Components.Samples.Icons;
 /// <summary>
 /// ElementIconList 组件
 /// </summary>
-[JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIconList.razor.js")]
+[JSModuleAutoLoader("Samples/Icons/ElementIconList.razor.js")]
 public partial class ElementIconList
 {
     private string? ClassString => CssBuilder.Default("icon-list")
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIcons.razor b/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIcons.razor
index bdd28bbb503..7a07f0558b8 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIcons.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/ElementIcons.razor
@@ -2,6 +2,10 @@
 @layout MainLayout
 @inject IStringLocalizer<ElementIcons> Localizer
 
+<HeadContent>
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.ElementIcon/BootstrapBlazor.ElementIcon.bundle.scp.css"]" />
+</HeadContent>
+
 <h3>@Localizer["ElementIconTitle"]</h3>
 
 <h4>@Localizer["ElementIconDescription"]</h4>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/FAIconList.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Icons/FAIconList.razor.cs
index a6dc1d92b22..ae88d6398f6 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/FAIconList.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/FAIconList.razor.cs
@@ -10,7 +10,7 @@ namespace BootstrapBlazor.Shared.Components.Samples.Icons;
 /// <summary>
 /// FAIconList 组件
 /// </summary>
-[JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Samples/Icons/FAIconList.razor.js", JSObjectReference = true)]
+[JSModuleAutoLoader("Samples/Icons/FAIconList.razor.js", JSObjectReference = true)]
 public partial class FAIconList
 {
     private string? ClassString => CssBuilder.Default("icon-list")
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParkList.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParkList.razor.cs
index 0b2784abc09..85a57bc96cc 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParkList.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParkList.razor.cs
@@ -8,7 +8,7 @@ namespace BootstrapBlazor.Shared.Components.Samples.Icons;
 /// <summary>
 /// ByteDanceIconList 组件
 /// </summary>
-[JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Samples/Icons/IconParkList.razor.js")]
+[JSModuleAutoLoader("Samples/Icons/IconParkList.razor.js")]
 public partial class IconParkList : IAsyncDisposable
 {
     private string? ClassString => CssBuilder.Default("icon-list")
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParks.razor b/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParks.razor
index 7cfbba1243e..53c6b84cd04 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParks.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Icons/IconParks.razor
@@ -2,6 +2,10 @@
 @layout MainLayout
 @inject IStringLocalizer<IconParks> Localizer
 
+<HeadContent>
+    <link rel="stylesheet" href="@Assets["_content/BootstrapBlazor.IconPark/BootstrapBlazor.IconPark.bundle.scp.css"]" />
+</HeadContent>
+
 <h3>@Localizer["IconParkTitle"]</h3>
 
 <h4>@Localizer["IconParkDescription"]</h4>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor b/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor
index b39ec5e355e..16d2763af2d 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor
@@ -1,12 +1,13 @@
 ﻿@page "/image-cropper"
 @inject IStringLocalizer<ImageCroppers> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["Title"]</h3>
 
 <PackageTips Name="BootstrapBlazor.ImageCropper" />
 
 <DemoBlock Title="@Localizer["ImageCropperNormalText"]" Introduction="@Localizer["ImageCropperNormalIntro"]" Name="Normal">
-    <ImageCropper @ref="_cropper" Url="@images[0]"></ImageCropper>
+    <ImageCropper @ref="_cropper" Url="@_images[0]"></ImageCropper>
     <section ignore>
         <BootstrapInputGroup>
             <Button Text="OK" OnClick="Crop" />
@@ -26,7 +27,7 @@
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["ImageCropperNormalText"]" Introduction="@Localizer["ImageCropperNormalIntro"]" Name="Normal">
-    <ImageCropper @ref="_roundCropper" Url="@images[0]" CropperShape="ImageCropperShape.Round" Options="_roundOptions" />
+    <ImageCropper @ref="_roundCropper" Url="@_images[0]" CropperShape="ImageCropperShape.Round" Options="_roundOptions" />
     <section ignore>
         <BootstrapInputGroup>
             <Button Text="OK" OnClick="RoundCrop" />
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor.cs
index 7872c2aa2bd..25a218a76b8 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/ImageCroppers.razor.cs
@@ -14,7 +14,7 @@ public partial class ImageCroppers
 
     private ImageCropper _roundCropper = default!;
 
-    private readonly string[] images = ["./_content/BootstrapBlazor.Shared/images/picture.jpg", "./_content/BootstrapBlazor.Shared/images/ImageList2.jpeg"];
+    private readonly List<string> _images = [];
 
     private int index = 0;
 
@@ -22,12 +22,26 @@ public partial class ImageCroppers
 
     private string? _base64String2;
 
-    private ImageCropperOption _roundOptions = new() { IsRound = true, Radius = "50%" };
+    private readonly ImageCropperOption _roundOptions = new() { IsRound = true, Radius = "50%" };
+
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+
+        _images.AddRange(
+        [
+            $"{WebsiteOption.CurrentValue.AssetRootPath}images/picture.jpg",
+            $"{WebsiteOption.CurrentValue.AssetRootPath}images/ImageList2.jpeg"
+        ]);
+    }
 
     private async Task OnClickReplace()
     {
         index = index == 0 ? 1 : 0;
-        await _cropper.Replace(images[index]);
+        await _cropper.Replace(_images[index]);
     }
 
     private async Task Crop()
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor b/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor
index bee32973f87..83c2dd16e31 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor
@@ -1,5 +1,6 @@
 ﻿@page "/image-viewer"
 @inject IStringLocalizer<ImageViewers> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["ImageViewerTitle"]</h3>
 
@@ -18,23 +19,23 @@
     <div class="images mt-3">
         <div class="images-item">
             <div>Fill</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/bird.jpeg" FitMode="ObjectFitMode.Fill" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/bird.jpeg")" FitMode="ObjectFitMode.Fill" />
         </div>
         <div class="images-item">
             <div>Contain</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/bird.jpeg" FitMode="ObjectFitMode.Contain" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/bird.jpeg")" FitMode="ObjectFitMode.Contain" />
         </div>
         <div class="images-item">
             <div>Cover</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/bird.jpeg" FitMode="ObjectFitMode.Cover" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/bird.jpeg")" FitMode="ObjectFitMode.Cover" />
         </div>
         <div class="images-item">
             <div>None</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/bird.jpeg" FitMode="ObjectFitMode.None" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/bird.jpeg")" FitMode="ObjectFitMode.None" />
         </div>
         <div class="images-item">
             <div>ScaleDown</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/bird.jpeg" FitMode="ObjectFitMode.ScaleDown" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/bird.jpeg")" FitMode="ObjectFitMode.ScaleDown" />
         </div>
     </div>
 </DemoBlock>
@@ -46,11 +47,11 @@
     <div class="images img-ph mt-3">
         <div class="images-item">
             <div>@Localizer["ImageViewerPlaceHolderDefault"]</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/image-ph.jpeg" ShowPlaceHolder="true" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/image-ph.jpeg")" ShowPlaceHolder="true" />
         </div>
         <div class="images-item">
             <div>@Localizer["ImageViewerPlaceHolderCustom"]</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/image-ph.jpeg" ShowPlaceHolder="true">
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/image-ph.jpeg")" ShowPlaceHolder="true">
                 <PlaceHolderTemplate>
                     <div class="bb-img-holder">
                         <div class="bb-img-loading">@Localizer["ImageViewerPlaceHolderLoading"]</div>
@@ -78,7 +79,7 @@
         </div>
         <div class="images-item">
             <div>@Localizer["ImageViewerPlaceHolderTemplateLoadingShow"]</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/image-ph.jpeg" ShowPlaceHolder="true">
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/image-ph.jpeg")" ShowPlaceHolder="true">
                 <PlaceHolderTemplate>
                     <div class="bb-img-holder">
                         <div class="bb-img-loading">@Localizer["ImageViewerPlaceHolderTemplatePlaceholder"]</div>
@@ -95,11 +96,11 @@
     <div class="images img-ph mt-3">
         <div class="images-item">
             <div>@Localizer["ImageViewerErrorTemplateUrlError"]</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/error-image.jpeg" HandleError="true" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/error-image.jpeg")" HandleError="true" />
         </div>
         <div class="images-item">
             <div>@Localizer["ImageViewerErrorTemplateCustom"]</div>
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/error-image.jpeg">
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/error-image.jpeg")">
                 <ErrorTemplate>
                     <div class="bb-img-holder">
                         <div class="bb-img-loading">@Localizer["ImageViewerErrorTemplateLoadFailed"]</div>
@@ -115,7 +116,7 @@
            Name="PreviewList">
     <div class="images img-ph mt-3">
         <div class="images-item">
-            <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/bird.jpeg" PreviewList="PreviewList" />
+            <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/bird.jpeg")" PreviewList="PreviewList" />
         </div>
     </div>
 </DemoBlock>
@@ -130,7 +131,7 @@
 <DemoBlock Title="@Localizer["IntersectionObserverTitle"]"
            Introduction="@Localizer["IntersectionObserverIntro"]"
            Name="IsIntersectionObserver">
-    <ImageViewer Url="./_content/BootstrapBlazor.Shared/images/tutorials/waterfall.png" IsIntersectionObserver="true" IsAsync="true" style="height: 400px;"></ImageViewer>
+    <ImageViewer Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/tutorials/waterfall.png")" IsIntersectionObserver="true" IsAsync="true" style="height: 400px;"></ImageViewer>
 </DemoBlock>
 
 <AttributeTable Items="@GetAttributes()" />
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor.cs
index aa589759f0a..d29b5c09144 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/ImageViewers.razor.cs
@@ -26,8 +26,8 @@ protected override void OnInitialized()
 
         PreviewList.AddRange(
         [
-            "./_content/BootstrapBlazor.Shared/images/ImageList1.jpeg",
-            "./_content/BootstrapBlazor.Shared/images/ImageList2.jpeg"
+            $"{WebsiteOption.CurrentValue.AssetRootPath}images/ImageList1.jpeg",
+            $"{WebsiteOption.CurrentValue.AssetRootPath}images/ImageList2.jpeg"
         ]);
     }
 
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/InputGroups.razor b/src/BootstrapBlazor.Shared/Components/Samples/InputGroups.razor
index 5f40532006e..13051e8819e 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/InputGroups.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/InputGroups.razor
@@ -1,6 +1,7 @@
 ﻿@page "/input-group"
 @inject IStringLocalizer<InputGroups> Localizer
 @inject IStringLocalizer<Foo> LocalizerFoo
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["InputGroupsTitle"]</h3>
 
@@ -91,7 +92,7 @@
                     <Template>
                         <div class="d-flex">
                             <div>
-                                <img src="@Foo.GetAvatarUrl(context.Id)" class="bb-avatar" />
+                                <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(context.Id)" class="bb-avatar" />
                             </div>
                             <div class="ps-2">
                                 <div>@context.Name</div>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor b/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor
index d850b755b71..2b8ebe5e0f7 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor
@@ -1,5 +1,6 @@
 ﻿@page "/intersection-observer"
 @inject IStringLocalizer<IntersectionObservers> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["IntersectionObserverTitle"]</h3>
 
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor.cs
index 9b37c5a0dc5..7a12fac44d2 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/IntersectionObservers.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
@@ -23,7 +25,7 @@ protected override void OnInitialized()
     {
         base.OnInitialized();
 
-        _images = Enumerable.Range(1, 100).Select(i => "./_content/BootstrapBlazor.Shared/images/default.jpeg").ToList();
+        _images = Enumerable.Range(1, 100).Select(i => $"{WebsiteOption.CurrentValue.AssetRootPath}images/default.jpeg").ToList();
         _items = Enumerable.Range(1, 20).Select(i => $"https://picsum.photos/160/160?random={i}").ToList();
     }
 
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/LinkButtons.razor b/src/BootstrapBlazor.Shared/Components/Samples/LinkButtons.razor
index df46769f543..938d4e6ffd1 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/LinkButtons.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/LinkButtons.razor
@@ -28,7 +28,7 @@
 <DemoBlock Title="@Localizer["LinkButtonImageTitle"]"
            Introduction="@Localizer["LinkButtonImageIntro"]"
            Name="Image">
-    <LinkButton ImageUrl="./_content/BootstrapBlazor.Shared/images/Argo-C.png" />
+    <LinkButton ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" />
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["LinkButtonIconTitle"]"
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/ListViews.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/ListViews.razor.cs
index d4b634a065c..07b9b638930 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/ListViews.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/ListViews.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
@@ -25,7 +27,7 @@ protected override void OnInitialized()
 
         Products = Enumerable.Range(1, 8).Select(i => new Product()
         {
-            ImageUrl = $"./_content/BootstrapBlazor.Shared/images/Pic{i}.jpg",
+            ImageUrl = $"{WebsiteOption.CurrentValue.AssetRootPath}images/Pic{i}.jpg",
             Description = $"Pic{i}.jpg",
             Category = $"Group{(i % 4) + 1}"
         });
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor b/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor
index 9364bd86540..1a9a43439b9 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor
@@ -1,5 +1,18 @@
 ﻿@page "/live2d-display"
 @inject IStringLocalizer<Live2DDisplays> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
+
+<HeadContent>
+    <style>
+        .label-width {
+            width: 150px;
+        }
+
+        .pick-radius :first-child {
+            border-radius: 0px;
+        }
+    </style>
+</HeadContent>
 
 <h3>@Localizer["Live2DDisplayTitle"]</h3>
 
@@ -21,7 +34,7 @@ app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider });</P
             <RadioList @bind-Value="@position" />
             <h4>Models</h4>
             <p>所有模型均来自 github 开源项目，仅供展示之用，本组件并不包含任何模型。</p>
-            <RadioList Items="@SrcItems" @bind-Value="@BindSrcItem" />
+            <RadioList Items="@_srcItems" @bind-Value="@BindSrcItem" />
         </div>
         <div class="col-12">
             <div class="row g-3 mb-3">
@@ -51,19 +64,19 @@ app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider });</P
                     <p>
                         <BootstrapInputGroup>
                             <BootstrapInputGroupLabel class="label-width" DisplayText="IsDraggable" />
-                            <Checkbox TValue="bool" @bind-Value="@IsDraggable" />
+                            <Checkbox @bind-Value="@IsDraggable" />
                         </BootstrapInputGroup>
                     </p>
                     <p>
                         <BootstrapInputGroup>
                             <BootstrapInputGroupLabel class="label-width" DisplayText="HitAreaFrames" />
-                            <Checkbox TValue="bool" @bind-Value="@AddHitAreaFrames" />
+                            <Checkbox @bind-Value="@AddHitAreaFrames" />
                         </BootstrapInputGroup>
                     </p>
                     <p>
                         <BootstrapInputGroup>
                             <BootstrapInputGroupLabel class="label-width" DisplayText="BackgroundAlpha" />
-                            <Checkbox TValue="bool" @bind-Value="@BackgroundAlpha" ShowLabel="true" DisplayText="BackgroundAlpha" />
+                            <Checkbox @bind-Value="@BackgroundAlpha" />
                         </BootstrapInputGroup>
                     </p>
                     <p>
@@ -86,15 +99,4 @@ app.UseStaticFiles(new StaticFileOptions { ContentTypeProvider = provider });</P
 
 </DemoBlock>
 
-
 <AttributeTable Items="@GetAttributes()" />
-
-<style>
-    .label-width {
-        width: 150px;
-    }
-
-    .pick-radius :first-child {
-        border-radius: 0px;
-    }
-</style>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor.cs
index 3efe2be6d74..189dc9fc3a0 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Live2DDisplays.razor.cs
@@ -32,19 +32,29 @@ public partial class Live2DDisplays
 
     private LivePosition position { get; set; } = LivePosition.BottomLeft;
 
-    private SelectedItem BindSrcItem { get; set; } = new SelectedItem();
+    private SelectedItem BindSrcItem { get; set; } = new();
 
-    private IEnumerable<SelectedItem> SrcItems { get; } = new SelectedItem[]
+    private readonly List<SelectedItem> _srcItems = [];
+
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    protected override void OnInitialized()
     {
-        new SelectedItem("./models/shizuku/shizuku.model.json", "shizuku"),
-        new SelectedItem("./models/haru/haru_greeter_t03.model3.json", "haru"),
-        new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/bilibili-22/index.json", "bilibili-22"),
-        new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/bilibili-33/index.json", "bilibili-33"),
-        new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/chiaki_kitty/chiaki_kitty.model.json", "chiaki_kitty"),
-        new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/date_16/date_16.model.json", "date_16"),
-        new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/hallo_16/hallo_16.model.json", "hallo_16"),
-        new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/haruto/haruto.model.json", "haruto"),
-    };
+        base.OnInitialized();
+
+        _srcItems.AddRange(
+        [
+            new SelectedItem($"{WebsiteOption.CurrentValue.AssetRootPath}models/shizuku/shizuku.model.json", "shizuku"),
+            new SelectedItem($"{WebsiteOption.CurrentValue.AssetRootPath}models/haru/haru_greeter_t03.model3.json", "haru"),
+            new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/bilibili-22/index.json", "bilibili-22"),
+            new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/bilibili-33/index.json", "bilibili-33"),
+            new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/chiaki_kitty/chiaki_kitty.model.json", "chiaki_kitty"),
+            new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/date_16/date_16.model.json", "date_16"),
+            new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/hallo_16/hallo_16.model.json", "hallo_16"),
+            new SelectedItem("https://raw.githubusercontent.com/iCharlesZ/vscode-live2d-models/master/model-library/haruto/haruto.model.json", "haruto"),
+        ]);
+    }
 
     /// <summary>
     /// 获得属性方法
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Logouts.razor b/src/BootstrapBlazor.Shared/Components/Samples/Logouts.razor
index bb78dd569d8..edadb371989 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Logouts.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Logouts.razor
@@ -1,5 +1,6 @@
 ﻿@page "/logout"
 @inject IStringLocalizer<Logouts> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["LogoutsTitle"]</h3>
 
@@ -9,7 +10,7 @@
            Introduction="@Localizer["LogoutsNormalIntro"]"
            Name="Normal">
     <div class="logout-custom">
-        <Logout ImageUrl="./_content/BootstrapBlazor.Shared/images/Argo.png" DisplayName="Administrators" UserName="Admin" />
+        <Logout ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" DisplayName="Administrators" UserName="Admin" />
         <div style="height: 80px;"></div>
     </div>
 </DemoBlock>
@@ -18,7 +19,7 @@
            Introduction="@Localizer["LogoutsShowUserNameIntro"]"
            Name="ShowUserName">
     <div class="logout-custom">
-        <Logout ImageUrl="./_content/BootstrapBlazor.Shared/images/Argo.png" DisplayName="Administrators" UserName="Admin" ShowUserName="false" />
+        <Logout ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" DisplayName="Administrators" UserName="Admin" ShowUserName="false" />
         <div style="height: 80px;"></div>
     </div>
 </DemoBlock>
@@ -26,7 +27,7 @@
 <DemoBlock Title="@Localizer["LogoutsChildContentTitle"]"
            Introduction="@Localizer["LogoutsChildContentIntro"]"
            Name="ChildContent">
-    <Logout ImageUrl="./_content/BootstrapBlazor.Shared/images/Argo.png" DisplayName="Administrators" UserName="Admin">
+    <Logout ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" DisplayName="Administrators" UserName="Admin">
         <i class="fa-fw fa-solid fa-user"></i>
         <span>@Localizer["LogoutsChildContentCustomDisplay"]</span>
     </Logout>
@@ -36,10 +37,10 @@
 <DemoBlock Title="@Localizer["LogoutsHeaderTemplateTitle"]"
            Introduction="@Localizer["LogoutsHeaderTemplateIntro"]"
            Name="HeaderTemplate">
-    <Logout ImageUrl="./_content/BootstrapBlazor.Shared/images/Argo.png" DisplayName="Administrators" UserName="Admin" class="bg-warning">
+    <Logout ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" DisplayName="Administrators" UserName="Admin" class="bg-warning">
         <HeaderTemplate>
             <div class="d-flex flex-fill align-items-center">
-                <img alt="avatar" src="./_content/BootstrapBlazor.Shared/images/Argo-C.png" style="border-radius: 50%;">
+                <img alt="avatar" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" style="border-radius: 50%;">
                 <div class="flex-fill">
                     <div class="logout-dn">@Localizer["LogoutsHeaderTemplateUser1"]</div>
                     <div class="logout-un">@Localizer["LogoutsHeaderTemplateUser2"]</div>
@@ -53,7 +54,7 @@
 <DemoBlock Title="@Localizer["LogoutsLinkTemplateTitle"]"
            Introduction="@Localizer["LogoutsLinkTemplateIntro"]"
            Name="LinkTemplate">
-    <Logout ImageUrl="./_content/BootstrapBlazor.Shared/images/Argo.png" DisplayName="Administrators" UserName="Admin" class="bg-primary">
+    <Logout ImageUrl="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo.png")" DisplayName="Administrators" UserName="Admin" class="bg-primary">
         <LinkTemplate>
             <a href="#">
                 <i class="fa-solid fa-user"></i><span>@Localizer["LogoutsLinkTemplatePersonalCenter"]</span>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Menus.razor b/src/BootstrapBlazor.Shared/Components/Samples/Menus.razor
index 95452c47957..dea2bd32fb3 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Menus.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Menus.razor
@@ -70,7 +70,7 @@
             </Header>
             <Side>
                 <div class="layout-banner">
-                    <img class="layout-logo" src="./_content/BootstrapBlazor.Shared/images/logo.png" />
+                    <img class="layout-logo" src="@WebsiteOption.CurrentValue.GetAssetUrl("images/logo.png")" />
                     <div class="layout-title">
                         <span>@Localizer["MenusClickShrinkMenuTitle"]</span>
                     </div>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Mermaids.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Mermaids.razor.cs
index 52031d69968..fa928289503 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Mermaids.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Mermaids.razor.cs
@@ -3,8 +3,6 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
-using System.ComponentModel;
-
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/MouseFollowers.razor b/src/BootstrapBlazor.Shared/Components/Samples/MouseFollowers.razor
index 897a4f05f23..b22357961d9 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/MouseFollowers.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/MouseFollowers.razor
@@ -1,6 +1,7 @@
 ﻿@page "/mouse-follower"
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
-<div>
+<HeadContent>
     <style>
         .bb-cursor {
             color: orangered;
@@ -14,59 +15,74 @@
             height: auto;
             margin: -50px -220px 0 0;
         }
+
+        .mouseFollower-demo:before {
+            height: 400px;
+            display: grid;
+            align-content: center;
+            text-align: center;
+            font-size: 6.6vw;
+            line-height: 1.1;
+            will-change: transform;
+            color: transparent;
+            text-shadow: none;
+            -webkit-text-stroke: 1px #7532F9;
+            white-space: pre;
+            content: "Welcome to \A BootstrapBlazor";
+        }
     </style>
+</HeadContent>
 
-    <h3>@Localizer["MouseFollowersTitle"]</h3>
+<h3>@Localizer["MouseFollowersTitle"]</h3>
 
-    <h4>@Localizer["MouseFollowersDescription"]</h4>
+<h4>@Localizer["MouseFollowersDescription"]</h4>
 
-    <PackageTips Name="@NugetPackageName"></PackageTips>
+<PackageTips Name="@NugetPackageName"></PackageTips>
 
-    <DemoBlock Title="@Localizer["MouseFollowerNormalTitle"]"
-               Introduction="@Localizer["MouseFollowerNormalIntro"]"
-               Name="MouseFollowerNormal">
-        <MouseFollower>
-            <div class="mouseFollower-demo" />
-        </MouseFollower>
-    </DemoBlock>
+<DemoBlock Title="@Localizer["MouseFollowerNormalTitle"]"
+           Introduction="@Localizer["MouseFollowerNormalIntro"]"
+           Name="MouseFollowerNormal">
+    <MouseFollower>
+        <div class="mouseFollower-demo" />
+    </MouseFollower>
+</DemoBlock>
 
-    <DemoBlock Title="@Localizer["MouseFollowerTextTitle"]"
-               Introduction="@Localizer["MouseFollowerTextIntro"]"
-               Name="MouseFollowerText">
-        <MouseFollower Content="Hi"
-                       Options="@FollowerOptions"
-                       FollowerMode="MouseFollowerMode.Text">
-            <div class="mouseFollower-demo" />
-        </MouseFollower>
-    </DemoBlock>
+<DemoBlock Title="@Localizer["MouseFollowerTextTitle"]"
+           Introduction="@Localizer["MouseFollowerTextIntro"]"
+           Name="MouseFollowerText">
+    <MouseFollower Content="Hi"
+                   Options="@FollowerOptions"
+                   FollowerMode="MouseFollowerMode.Text">
+        <div class="mouseFollower-demo" />
+    </MouseFollower>
+</DemoBlock>
 
-    <DemoBlock Title="@Localizer["MouseFollowerIconTitle"]"
-               Introduction="@Localizer["MouseFollowerIconIntro"]"
-               Name="MouseFollowerIcon">
-        <MouseFollower FollowerMode="MouseFollowerMode.Image"
-                       Content="./_content/BootstrapBlazor.Shared/images/performance.svg">
-            <div class="mouseFollower-demo" />
-        </MouseFollower>
-    </DemoBlock>
+<DemoBlock Title="@Localizer["MouseFollowerIconTitle"]"
+           Introduction="@Localizer["MouseFollowerIconIntro"]"
+           Name="MouseFollowerIcon">
+    <MouseFollower FollowerMode="MouseFollowerMode.Image"
+                   Content="@WebsiteOption.CurrentValue.GetAssetUrl("images/performance.svg")">
+        <div class="mouseFollower-demo" />
+    </MouseFollower>
+</DemoBlock>
 
-    <DemoBlock Title="@Localizer["MouseFollowerImageTitle"]"
-               Introduction="@Localizer["MouseFollowerImageIntro"]"
-               Name="MouseFollowerImage">
-        <MouseFollower Options="@FollowerImageOptions"
-                       FollowerMode="MouseFollowerMode.Image"
-                       Content="./_content/BootstrapBlazor.Shared/images/mousefollower/cat.gif">
-            <div class="mouseFollower-demo" />
-        </MouseFollower>
-    </DemoBlock>
+<DemoBlock Title="@Localizer["MouseFollowerImageTitle"]"
+           Introduction="@Localizer["MouseFollowerImageIntro"]"
+           Name="MouseFollowerImage">
+    <MouseFollower Options="@FollowerImageOptions"
+                   FollowerMode="MouseFollowerMode.Image"
+                   Content="@WebsiteOption.CurrentValue.GetAssetUrl("images/mousefollower/cat.gif")">
+        <div class="mouseFollower-demo" />
+    </MouseFollower>
+</DemoBlock>
 
-    <DemoBlock Title="@Localizer["MouseFollowerVideoTitle"]"
-               Introduction="@Localizer["MouseFollowerVideoIntro"]"
-               Name="MouseFollowerVideo">
-        <MouseFollower FollowerMode="MouseFollowerMode.Video"
-                       Content="//vjs.zencdn.net/v/oceans.mp4">
-            <div class="mouseFollower-demo" />
-        </MouseFollower>
-    </DemoBlock>
+<DemoBlock Title="@Localizer["MouseFollowerVideoTitle"]"
+           Introduction="@Localizer["MouseFollowerVideoIntro"]"
+           Name="MouseFollowerVideo">
+    <MouseFollower FollowerMode="MouseFollowerMode.Video"
+                   Content="//vjs.zencdn.net/v/oceans.mp4">
+        <div class="mouseFollower-demo" />
+    </MouseFollower>
+</DemoBlock>
 
-    <AttributeTable Items="@GetAttributes()" />
-</div>
+<AttributeTable Items="@GetAttributes()" />
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/MouseFollowers.razor.css b/src/BootstrapBlazor.Shared/Components/Samples/MouseFollowers.razor.css
deleted file mode 100644
index 23a05c03fc0..00000000000
--- a/src/BootstrapBlazor.Shared/Components/Samples/MouseFollowers.razor.css
+++ /dev/null
@@ -1,14 +0,0 @@
-﻿::deep .mouseFollower-demo:before {
-    height: 400px;
-    display: grid;
-    align-content: center;
-    text-align: center;
-    font-size: 6.6vw;
-    line-height: 1.1;
-    will-change: transform;
-    color: transparent;
-    text-shadow: none;
-    -webkit-text-stroke: 1px #7532F9;
-    white-space: pre;
-    content: "Welcome to \A BootstrapBlazor";
-}
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor b/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor
index 6a9d6f5d3bb..ad0c0057fe2 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor
@@ -1,5 +1,6 @@
 ﻿@page "/notification"
 @inject IStringLocalizer<Notifications> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["NotificationsTitle"]</h3>
 
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor.cs
index 0800f2fee60..b41c199b2d4 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Notifications.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
@@ -19,10 +21,8 @@ public partial class Notifications
 
     private bool Permission { get; set; }
 
-    private NotificationItem Model { get; set; } = new()
-    {
-        Icon = "./_content/BootstrapBlazor.Shared/images/Argo-C.png"
-    };
+    [NotNull]
+    private NotificationItem? Model { get; set; }
 
     /// <summary>
     /// <inheritdoc/>
@@ -30,9 +30,14 @@ public partial class Notifications
     protected override void OnInitialized()
     {
         base.OnInitialized();
-        Model.Title ??= Localizer["NotificationsNormalTitleSampleText"];
-        Model.Message ??= Localizer["NotificationsNormalMessageSampleText"];
-        Model.OnClick = OnClickNotificationCallback;
+
+        Model = new()
+        {
+            Icon = $"{WebsiteOption.CurrentValue.AssetRootPath}images/Argo-C.png",
+            Title = Localizer["NotificationsNormalTitleSampleText"],
+            Message = Localizer["NotificationsNormalMessageSampleText"],
+            OnClick = OnClickNotificationCallback
+        };
     }
 
     /// <summary>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor b/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor
index e2c2e9986cd..8b7e09c12ff 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor
@@ -1,5 +1,6 @@
 ﻿@page "/select-object"
 @inject IStringLocalizer<SelectObjects> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["Title"]</h3>
 
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor.cs
index abb7a74510f..ea5c7be8517 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/SelectObjects.razor.cs
@@ -3,6 +3,8 @@
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
+using Microsoft.Extensions.Options;
+
 namespace BootstrapBlazor.Shared.Components.Samples;
 
 /// <summary>
@@ -30,7 +32,7 @@ protected override void OnInitialized()
 
         Products = Enumerable.Range(1, 8).Select(i => new ListViews.Product()
         {
-            ImageUrl = $"./_content/BootstrapBlazor.Shared/images/Pic{i}.jpg",
+            ImageUrl = $"{WebsiteOption.CurrentValue.AssetRootPath}images/Pic{i}.jpg",
             Description = $"Pic{i}.jpg",
             Category = $"Group{(i % 4) + 1}"
         });
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/SelectTables.razor b/src/BootstrapBlazor.Shared/Components/Samples/SelectTables.razor
index a0bb58828c9..d4441c599ee 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/SelectTables.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/SelectTables.razor
@@ -1,4 +1,5 @@
 ﻿@page "/select-table"
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["Title"]</h3>
 
@@ -46,7 +47,7 @@
                 </div>
                 <Divider />
                 <div class="select-custom-body">
-                    <img src="@Foo.GetAvatarUrl(context.Id)" class="bb-avatar" />
+                    <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(context.Id)" class="bb-avatar" />
                     <div class="select-custom-detail">
                         <div class="d-flex">
                             <div class="flex-fill">
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Selects.razor b/src/BootstrapBlazor.Shared/Components/Samples/Selects.razor
index 54ccc1f1580..4fee4046f58 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Selects.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Selects.razor
@@ -1,6 +1,7 @@
 ﻿@page "/select"
 @inject DialogService Dialog
 @inject IStringLocalizer<Selects> Localizer
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["SelectsTitle"]</h3>
 
@@ -289,7 +290,7 @@
                         </div>
                         <Divider />
                         <div class="select-custom-body">
-                            <img src="@Foo.GetAvatarUrl(foo.Id)" class="bb-avatar" />
+                            <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(foo.Id)" class="bb-avatar" />
                             <div class="select-custom-detail">
                                 <div class="d-flex">
                                     <div class="flex-fill">
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesColumn.razor b/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesColumn.razor
index 75f623ab94b..b68860edc2c 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesColumn.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesColumn.razor
@@ -201,7 +201,7 @@
                 <Template Context="value">
                     <div class="d-flex">
                         <div>
-                            <img src="@Foo.GetAvatarUrl(value.Row.Id)" class="bb-avatar" />
+                            <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(value.Row.Id)" class="bb-avatar" />
                         </div>
                         <div class="ps-2">
                             <div>@value.Value</div>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesExcel.razor b/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesExcel.razor
index d3079aa849d..f82400ee8a9 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesExcel.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesExcel.razor
@@ -2,6 +2,7 @@
 @inject IStringLocalizer<NavMenu> NavMenuLocalizer
 @inject IStringLocalizer<TablesExcel> Localizer
 @inject IStringLocalizer<Foo> LocalizerFoo
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["TablesExcelTitle"] - @NavMenuLocalizer["TableExcel"]</h3>
 <h4>@Localizer["TablesExcelDescription"]</h4>
@@ -100,7 +101,7 @@
                 <EditTemplate Context="row">
                     <div class="d-flex disabled">
                         <div>
-                            <img src="@Foo.GetAvatarUrl(row!.Id)" class="bb-avatar" />
+                            <img src="@WebsiteOption.CurrentValue.GetAvatarUrl(row!.Id)" class="bb-avatar" />
                         </div>
                         <div class="ps-2">
                             <div>@row.Name</div>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesSelection.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesSelection.razor.cs
index 37fb4ee1996..8472503fd96 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesSelection.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Table/TablesSelection.razor.cs
@@ -8,7 +8,7 @@ namespace BootstrapBlazor.Shared.Components.Samples.Table;
 /// <summary>
 /// 选择行示例代码
 /// </summary>
-[JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Samples/Table/TablesSelection.razor.js", AutoInvokeInit = false, AutoInvokeDispose = false)]
+[JSModuleAutoLoader("Samples/Table/TablesSelection.razor.js", AutoInvokeInit = false, AutoInvokeDispose = false)]
 public partial class TablesSelection
 {
     /// <summary>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor b/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor
index 4bcbca6a0d3..1d4bba691b4 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor
@@ -3,7 +3,8 @@
 @inject IStringLocalizer<Topologies> Localizer
 @inject FanControllerDataService DataService
 @inject SwalService SwalService
-@attribute [JSModuleAutoLoader("../_content/BootstrapBlazor.Shared/Components/Samples/Topologies.razor.js", JSObjectReference = true, AutoInvokeDispose = false)]
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
+@attribute [JSModuleAutoLoader("Samples/Topologies.razor.js", JSObjectReference = true, AutoInvokeDispose = false)]
 
 <h3>@Localizer["TopologiesTitle"]</h3>
 <h4>@((MarkupString)Localizer["TopologiesDescription"].Value)</h4>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor.cs
index 39b68c2e13c..6900d479392 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Topologies.razor.cs
@@ -31,6 +31,7 @@ protected override void OnInitialized()
         {
             using var reader = new StreamReader(stream);
             Content = reader.ReadToEnd();
+            Content = Content.Replace("{AssetPath}", WebsiteOption.CurrentValue.AssetRootPath);
         }
     }
 
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/Admin.razor b/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/Admin.razor
index b8a528dad4b..688068e1c8b 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/Admin.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/Admin.razor
@@ -1,4 +1,5 @@
 ﻿@page "/tutorials/admin"
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <p>后台权限管理演示系统</p>
 
@@ -8,7 +9,7 @@
             <div class="card">
                 <div class="card-header">BootstrapBlazor 组件库实现</div>
                 <div class="card-body">
-                    <img src="./_content/BootstrapBlazor.Shared/images/tutorials/pro.jpg" class="w-100" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/tutorials/pro.jpg")" class="w-100" />
                 </div>
             </div>
         </a>
@@ -18,7 +19,7 @@
             <div class="card">
                 <div class="card-header">MVC & Blazor 混合实现</div>
                 <div class="card-body">
-                    <img src="./_content/BootstrapBlazor.Shared/images/tutorials/admin.jpg" class="w-100" />
+                    <img src="@WebsiteOption.CurrentValue.GetAssetUrl("images/tutorials/admin.jpg")" class="w-100" />
                 </div>
             </div>
         </a>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/DrawingApp.razor b/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/DrawingApp.razor
index 94874259839..0209a418626 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/DrawingApp.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/DrawingApp.razor
@@ -1,8 +1,8 @@
 ﻿@page "/tutorials/drawing"
 @inject MessageService MessageService
 @inject DownloadService DownloadService
-@inherits BootstrapModuleComponentBase
-@attribute [JSModuleAutoLoader("../../_content/BootstrapBlazor.Shared/Components/Samples/Tutorials/DrawingApp.razor.js")]
+@inherits WebSiteModuleComponentBase
+@attribute [JSModuleAutoLoader("Samples/Tutorials/DrawingApp.razor.js")]
 
 <div>
     <canvas id="@Id" class="drawing-canvas"></canvas>
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/LoginAndRegister/Template3.razor b/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/LoginAndRegister/Template3.razor
index 9a8985f5655..99d69538fb5 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/LoginAndRegister/Template3.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Tutorials/LoginAndRegister/Template3.razor
@@ -1,9 +1,10 @@
 ﻿@page "/tutorials/template3"
 @layout TutorialsLoginLayout
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <div class="login-item login-item-avatar">
     <div class="text-center">
-        <Avatar Url="./_content/BootstrapBlazor.Shared/images/Argo-C.png" IsCircle="true" Size="Size.ExtraExtraLarge" />
+        <Avatar Url="@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" IsCircle="true" Size="Size.ExtraExtraLarge" />
         <h4 class="text-dark">欢迎使用 BootstrapBlazor 组件库</h4>
     </div>
     <ValidateForm Model="@Model">
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor b/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor
index 9f8066cc77c..f52c7ed8629 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor
@@ -1,5 +1,5 @@
 ﻿@page "/upload"
-@inject IOptionsMonitor<WebsiteOptions> SiteOptions
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 @inject IStringLocalizer<Uploads> Localizer
 @inject ToastService ToastService
 @implements IDisposable
@@ -144,7 +144,7 @@
         <div>@((MarkupString)Localizer["UploadPreCardStyleServerSide"].Value)</div>
         <div>@((MarkupString)Localizer["UploadPreCardStyleWasm"].Value)</div>
         <div>@((MarkupString)Localizer["UploadPreCardStyleWasmSide"].Value)</div>
-        <div>@((MarkupString)Localizer["UploadPreCardStyleLink", SiteOptions.CurrentValue.VideoLibUrl].Value)</div>
+        <div>@((MarkupString)Localizer["UploadPreCardStyleLink", WebsiteOption.CurrentValue.VideoLibUrl].Value)</div>
         <div>@((MarkupString)Localizer["UploadPreCardStyleValidation"].Value)</div>
     </section>
     <div class="row g-3 mt-3">
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor.cs b/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor.cs
index 4cdeee1d93d..ffe08125a7f 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor.cs
+++ b/src/BootstrapBlazor.Shared/Components/Samples/Uploads.razor.cs
@@ -4,6 +4,7 @@
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
 
 using Microsoft.AspNetCore.Components.Forms;
+using Microsoft.Extensions.Options;
 
 namespace BootstrapBlazor.Shared.Components.Samples;
 
@@ -28,7 +29,7 @@ public sealed partial class Uploads
 
     private Person Foo2 { get; set; } = new Person();
 
-    private List<UploadFile> PreviewFileList { get; } = new(new[] { new UploadFile { PrevUrl = "./_content/BootstrapBlazor.Shared/images/Argo.png" } });
+    private List<UploadFile> PreviewFileList { get; } = [];
 
     private CancellationTokenSource? ReadAvatarToken { get; set; }
 
@@ -51,6 +52,19 @@ public sealed partial class Uploads
         new UploadFile { FileName = "Test", PrevUrl = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAkCAYAAAD/yagrAAAE60lEQVR4AWJwL/AB9GIWvI0jURz/L1NomZmZP8p9kWNmhnIbKPdomZmZGcJgO7QsWMbce55Yl11t47FbVdKTYpjOr/+H4y4Z/MpYeJVV8KVvokFRylq9osKfVtGQ/NHyPl2CbNVGwau2oOlmgUDJtDJGzxtvvIA3vRH+7IgeA0VtYhQBtKPlToFgC6RY58aggfwLNKhr0Zry2NnPrpIM2YGW2+UBG1IEmdGVJEVXE+hQXt8joKhLjdGVZHd7TSD9DHmT3J1dheroSF4fhnvUVQwbZx9UOnHSzQjkTN0tIG+8hFdbxet4PQOG4WqJwN1hFVb+xUBmCblxvxRkIE+Q+Yf0T31NSrp4/RV4FhHgoSTchQRZBK4D1+Fe2q2g8CYXU6buQyNDaiZKZhn0IYXHVwbkRQydHyawOAGGisa/o3DvI/jF3QKKiuAy+LKs5CvaXMLdeXb35wbkKTjmReDZHysCBosWJqN7r0jZ/VfgXtIlUNQnVpK7D4nNJSC5BHGi1d108Ppr8MxlF0cJqBSyFJaUfUnvHLyO4cttgaI+NhGB7HE0MaSUks/gU5vwe1gv5tfhmUmAhxME8jbIUtiEDus+fhmDJlgCRY0ylZRZhybKWtNinmYlH9NvL5puO3m9UHOkgzb3xuF5HCkDyhYiSwrYVfQPTpYChTc+E35tG9VJBjGFFNmtVlNMDnjzbx0EBpKq1eTeh2awbArBRuHadBWu6WVB4U/NITfuobYoCZl7QL//wDtr+nTmsgzQh2Kwgtz7QAZWFeGw/RI8s94Kigp1PvzZg2i9x11FDtKn/oZCoZdZxhaAXmG4/ohJKHudLE1Gyu66DOfs10BRR5CU3TKQIrtzj9BAkF991dsMslTZEClLsI+jFmANZYFAdAJl9QG03jWH9GrcFh9QTP4Of6GfJGSpsv1J2aoEKRuWCANNJNqOFAaPAW36rVRMCjVf6ZCtqYF2p6Asxg5mWK6tQamY9RCs8z1wF+FxTR5UqYT/3GC7oCkMHcjxKguq6cnl+Egf2whip3C9Yu56jk+GXXOtv1XIa8L1f3AFkHe9az83AmNanwV/bhfa5JKJ3n1slCUL8dk7CNfvVFMfySRThoxbK7fh18tTZXI2QeySLk88IRGsbHkqQj6wUJ72G5CloCXKZrdbLPgVMgVfQMq5m97bfQWOOeVbaK02nSA2ofn2y662UJE47horLZTe38oDjdxQUhmawocxa0OJ5hXjnZE4w1y0uc/iULKGfk+xNuZxI/BnjhFs+THPq4phmTsbeYPXRjFsJJ+NSMlnInHkxrwzGDjR3uBcG1/B/b/TwZkhubb6tP2oVfTAD2G4kw9vYiA2h+zy4GwYxd7S4qGOgd6oqVn6re1DTXiO4e4wPF+yQlF4ZCBfheSPIjJn+ciS/w93qjA6aZYqeQ5D3dTqvuE6GZNTkov5vqsYvLh7j8u1sWWkLIdBQR+q+XdtaKGhJCWBDpkwgSw9gRpKyoNKw6rjCLCDP4yVflSgWFwt3C0HSUo2BTFYX28fVAaWPpDx7wtwjOSSUszawnUT0KTudlfrFQwZ3WNf867CNZQhk/C8kIFUhJLt/O3Jzn62IYNwrUvA8zws4W61CGlDSfugXMz5pJgiSFYyXMYiRXdH4GmyqaR9UHLxzxG41KAwpZxRPN4kRf85Z5I4MvYfFUFGfemJG40AAAAASUVORK5CYII=" },
     ];
 
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+
+        PreviewFileList.AddRange(new[]
+        {
+            new UploadFile { PrevUrl = $"{WebsiteOption.CurrentValue.AssetRootPath}images/Argo.png" }
+        });
+    }
+
     private Task OnFileChange(UploadFile file)
     {
         // 未真正保存文件
@@ -95,12 +109,12 @@ private async Task OnClickToUploadNoUploadList(UploadFile file)
     private async Task<bool> SaveToFile(UploadFile file)
     {
         // Server Side 使用
-        // Web Assembly 模式下必须使用 webapi 方式去保存文件到服务器或者数据库中
+        // Web Assembly 模式下必须使用 WebApi 方式去保存文件到服务器或者数据库中
         // 生成写入文件名称
         var ret = false;
-        if (!string.IsNullOrEmpty(SiteOptions.CurrentValue.WebRootPath))
+        if (!string.IsNullOrEmpty(WebsiteOption.CurrentValue.WebRootPath))
         {
-            var uploaderFolder = Path.Combine(SiteOptions.CurrentValue.WebRootPath, $"images{Path.DirectorySeparatorChar}uploader");
+            var uploaderFolder = Path.Combine(WebsiteOption.CurrentValue.WebRootPath, $"images{Path.DirectorySeparatorChar}uploader");
             file.FileName = $"{Path.GetFileNameWithoutExtension(file.OriginFileName)}-{DateTimeOffset.Now:yyyyMMddHHmmss}{Path.GetExtension(file.OriginFileName)}";
             var fileName = Path.Combine(uploaderFolder, file.FileName);
 
@@ -110,7 +124,7 @@ private async Task<bool> SaveToFile(UploadFile file)
             if (ret)
             {
                 // 保存成功
-                file.PrevUrl = $"./_content/BootstrapBlazor.Shared/images/uploader/{file.FileName}";
+                file.PrevUrl = $"{WebsiteOption.CurrentValue.AssetRootPath}images/uploader/{file.FileName}";
             }
             else
             {
diff --git a/src/BootstrapBlazor.Shared/Components/Samples/WinBoxes.razor b/src/BootstrapBlazor.Shared/Components/Samples/WinBoxes.razor
index 06d273eb5a5..3bbf3de6f99 100644
--- a/src/BootstrapBlazor.Shared/Components/Samples/WinBoxes.razor
+++ b/src/BootstrapBlazor.Shared/Components/Samples/WinBoxes.razor
@@ -1,6 +1,7 @@
 ﻿@page "/win-box"
 @inject IStringLocalizer<WinBoxes> Localizer
 @inject IStringLocalizer<Foo> LocalizerFoo
+@inject IOptionsMonitor<WebsiteOptions> WebsiteOption
 
 <h3>@Localizer["WinBoxTitle"]</h3>
 <h4>@Localizer["WinBoxDescription"]</h4>
@@ -56,7 +57,7 @@ private WinBoxService? WinBoxService { get; set; }</Pre>
 
 <GroupBox Title="设置图标" class="mb-3">
     <p class="code-label">通过 <code>WinBoxOption</code> 参数 <code>Icon</code> 设置</p>
-    <Pre>new WinBoxOption() { Icon = "./_content/BootstrapBlazor.Shared/images/Argo-C.png" }</Pre>
+    <Pre>new WinBoxOption() { Icon = "@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")" }</Pre>
 
     <p class="code-label">通过服务方法 <code>WinBoxService</code> 实例方法</p>
     <Pre>[Inject]
@@ -66,7 +67,7 @@ private WinBoxService? WinBoxService { get; set; }
 private async Task SetIcon()
 {
     // 提前保持弹窗 WinBoxOption 实例
-    option.Icon = "./_content/BootstrapBlazor.Shared/images/Argo-C.png";
+    option.Icon = "@WebsiteOption.CurrentValue.GetAssetUrl("images/Argo-C.png")";
     await WinBoxService.setIcon(option.Id);
 }</Pre>
 </GroupBox>
diff --git a/src/BootstrapBlazor.Shared/Data/Foo.cs b/src/BootstrapBlazor.Shared/Data/Foo.cs
index 3b83fce9417..fdae0e7761c 100644
--- a/src/BootstrapBlazor.Shared/Data/Foo.cs
+++ b/src/BootstrapBlazor.Shared/Data/Foo.cs
@@ -132,14 +132,6 @@ public class Foo
     /// <returns></returns>
     public static IEnumerable<SelectedItem> GenerateHobbies(IStringLocalizer<Foo> localizer) => localizer["Hobbies"].Value.Split(",").Select(i => new SelectedItem(i, i)).ToList();
 
-
-    /// <summary>
-    /// 通过 Id 获取头像链接
-    /// </summary>
-    /// <param name="id"></param>
-    /// <returns></returns>
-    public static string GetAvatarUrl(int id) => $"./_content/BootstrapBlazor.Shared/images/avatars/150-{Math.Max(1, id % 25)}.jpg";
-
     /// <summary>
     /// 获取 Complete 转化为 SelectedItem 方法
     /// </summary>
diff --git a/src/BootstrapBlazor.Shared/Data/WebsiteOptions.cs b/src/BootstrapBlazor.Shared/Data/WebsiteOptions.cs
index 8e763c61783..acd69d0b3b9 100644
--- a/src/BootstrapBlazor.Shared/Data/WebsiteOptions.cs
+++ b/src/BootstrapBlazor.Shared/Data/WebsiteOptions.cs
@@ -87,6 +87,18 @@ public class WebsiteOptions
     [NotNull]
     public string? ContentRootPath { get; set; }
 
+    /// <summary>
+    /// 获得/设置 资源文件根目录 默认值为 "./_content/BootstrapBlazor.Shared/"
+    /// </summary>
+    [NotNull]
+    public string? AssetRootPath { get; set; } = "./_content/BootstrapBlazor.Shared/";
+
+    /// <summary>
+    /// 获得/设置 脚本根路径
+    /// </summary>
+    [NotNull]
+    public string JSModuleRootPath { get; set; } = "./_content/BootstrapBlazor.Shared/Components/";
+
     /// <summary>
     /// 获得/设置 视频地址
     /// </summary>
@@ -137,6 +149,12 @@ public WebsiteOptions()
         SourceCodes = config.GetSection("src").GetChildren().Select(c => new KeyValuePair<string, string?>(c.Key, c.Value)).ToDictionary(item => item.Key, item => item.Value);
         Videos = config.GetSection("video").GetChildren().Select(c => new KeyValuePair<string, string?>(c.Key, c.Value)).ToDictionary(item => item.Key, item => item.Value);
         Links = config.GetSection("link").GetChildren().Select(c => new KeyValuePair<string, string?>(c.Key, c.Value)).ToDictionary(item => item.Key, item => item.Value);
+
+#if DEBUG
+        IsDevelopment = true;
+#endif
+        ContentRootPath = IsDevelopment ? Path.Combine(AppContext.BaseDirectory, "../../../") : AppContext.BaseDirectory;
+        WebRootPath = Path.Combine(ContentRootPath, "wwwroot");
     }
 
     private IConfiguration GetConfiguration(string jsonFileName)
@@ -149,4 +167,18 @@ private IConfiguration GetConfiguration(string jsonFileName)
             .AddJsonStream(res)
             .Build();
     }
+
+    /// <summary>
+    /// 拼接静态资源文件路径
+    /// </summary>
+    /// <param name="url"></param>
+    /// <returns></returns>
+    public string? GetAssetUrl(string url) => $"{AssetRootPath}{url}";
+
+    /// <summary>
+    /// 获得头像地址字符串
+    /// </summary>
+    /// <param name="id"></param>
+    /// <returns></returns>
+    public string GetAvatarUrl(int id) => $"{AssetRootPath}images/avatars/150-{Math.Max(1, id % 25)}.jpg";
 }
diff --git a/src/BootstrapBlazor.Shared/Locales/en-US.json b/src/BootstrapBlazor.Shared/Locales/en-US.json
index 037b8b1eba8..af4eb0f1f0b 100644
--- a/src/BootstrapBlazor.Shared/Locales/en-US.json
+++ b/src/BootstrapBlazor.Shared/Locales/en-US.json
@@ -1066,7 +1066,6 @@
     "T2": "Microsoft Official Documentation",
     "T3": "because",
     "T4": "The mode cannot obtain the system language and culture information, the default culture information is",
-    "T5": "Please refer to the Change Default Language section at the end of the article",
     "N1": "How localization works in components",
     "N2": "Components additionally support the use of",
     "N3": "Type key-value information as a resource file, which is parsed as",
@@ -1130,7 +1129,7 @@
     "N61": "Configure whether to display missing localized resource information",
     "N62": "Add BootstrapBlazor service",
     "N63": "Ignore the loss of localized key-value culture information",
-    "LocalizationFileDesc": "The component built-in localization resource files are <code>en</code> <code>zh</code>. The other localization resource files <code>de</code> <code>es</code> <code>pt</code> <code>zh-TW</code> which are placed in the project folder <code>localization</code>. you can be downloaded by yourself and imported into the project through the injection service <a href=\"https://gitee.com/LongbowEnterprise/BootstrapBlazor/tree/main/localization\" target=\"_blank\"><img src=\"./_content/BootstrapBlazor.Shared/images/gitee.svg\" class=\"gitee-icon\"></a> <a href=\"https://github.com/dotnetcore/BootstrapBlazor/tree/main/localization\" target=\"_blank\"><i class=\"fa-brands fa-github github-icon\"></i></a>",
+    "LocalizationFileDesc": "The component built-in localization resource files are <code>en</code> <code>zh</code>. The other localization resource files <code>de</code> <code>es</code> <code>pt</code> <code>zh-TW</code> which are placed in the project folder <code>localization</code>. you can be downloaded by yourself and imported into the project through the injection service",
     "AdditionalJsonFile": "Additional <code>json</code> localization file",
     "ES": "Spanish (es)",
     "TW": "中國台灣 (zh-TW)"
diff --git a/src/BootstrapBlazor.Shared/Locales/zh-CN.json b/src/BootstrapBlazor.Shared/Locales/zh-CN.json
index f8cdc912c8e..8e0563bb0e0 100644
--- a/src/BootstrapBlazor.Shared/Locales/zh-CN.json
+++ b/src/BootstrapBlazor.Shared/Locales/zh-CN.json
@@ -1066,7 +1066,6 @@
     "T2": "微软官方文档",
     "T3": "由于",
     "T4": "模式无法获取系统语言文化信息，默认文化信息为",
-    "T5": "请查阅文章最后更改默认语言章节",
     "N1": "本地化在组件中的工作原理",
     "N2": "组件额外支持使用",
     "N3": "类型的键值信息作为资源文件，将其解析为",
@@ -1130,7 +1129,7 @@
     "N61": "配置是否显示缺失本地化资源信息",
     "N62": "增加 BootstrapBlazor 服务",
     "N63": "忽略本地化键值文化信息丢失",
-    "LocalizationFileDesc": "组件内置本地化资源文件为 <code>en</code> <code>zh</code> 由网友提供的其他本地化资源文件 <code>de</code> <code>es</code> <code>pt</code> <code>zh-TW</code> 放置在项目文件夹 <code>localization</code> 内，可自行下载通过注入服务引入到项目中 <a href=\"https://gitee.com/LongbowEnterprise/BootstrapBlazor/tree/main/localization\" target=\"_blank\"><img src=\"./_content/BootstrapBlazor.Shared/images/gitee.svg\" class=\"gitee-icon\"></a> <a href=\"https://github.com/dotnetcore/BootstrapBlazor/tree/main/localization\" target=\"_blank\"><i class=\"fa-brands fa-github github-icon\"></i></a>",
+    "LocalizationFileDesc": "组件内置本地化资源文件为 <code>en</code> <code>zh</code> 由网友提供的其他本地化资源文件 <code>de</code> <code>es</code> <code>pt</code> <code>zh-TW</code> 放置在项目文件夹 <code>localization</code> 内，可自行下载通过注入服务引入到项目中",
     "AdditionalJsonFile": "额外本地化语言 <code>json</code> 文件",
     "ES": "西班牙语（es）",
     "TW": "中國台灣（zh-TW）"
diff --git a/src/BootstrapBlazor.Shared/topology.json b/src/BootstrapBlazor.Shared/topology.json
index 0ad0c22387c..79c8b2ecc7e 100644
--- a/src/BootstrapBlazor.Shared/topology.json
+++ b/src/BootstrapBlazor.Shared/topology.json
@@ -7,7 +7,7 @@
       "name": "gif",
       "width": 1,
       "height": 0.9999999999999998,
-      "image": "./_content/BootstrapBlazor.Shared/images/fan.gif",
+      "image": "{AssetPath}images/fan.gif",
       "imageRatio": true,
       "id": "032b1de",
       "parentId": "77f220c7",
@@ -53,7 +53,7 @@
       "name": "image",
       "width": 1,
       "height": 0.9872751206669589,
-      "image": "./_content/BootstrapBlazor.Shared/images/fan.svg",
+      "image": "{AssetPath}images/fan.svg",
       "imageRatio": true,
       "id": "c45a053",
       "parentId": "77f220c7",
diff --git a/test/UnitTest/Components/DateTimePickerTest.cs b/test/UnitTest/Components/DateTimePickerTest.cs
index 89361d9c470..1612c17c0c9 100644
--- a/test/UnitTest/Components/DateTimePickerTest.cs
+++ b/test/UnitTest/Components/DateTimePickerTest.cs
@@ -930,7 +930,6 @@ public async Task AutoClose_OK()
         });
         button = cut.FindAll(".picker-panel-content .cell").First(i => i.TextContent == $"{DateTime.Today.Day}");
         await cut.InvokeAsync(() => button.Click());
-        Assert.NotEqual(val, DateTime.MinValue);
     }
 
     [Fact]
