diff --git a/src/BootstrapBlazor.Server/Components/Components/Pre.razor.cs b/src/BootstrapBlazor.Server/Components/Components/Pre.razor.cs
index 205f45ea458..a4ec887ae91 100644
--- a/src/BootstrapBlazor.Server/Components/Components/Pre.razor.cs
+++ b/src/BootstrapBlazor.Server/Components/Components/Pre.razor.cs
@@ -180,12 +180,12 @@ private string FindCodeSnippetByName(string code)
         return content.TrimEnd('\n');
     }
 
-    [GeneratedRegex("<section ignore[ \\s\\S]*?>[\\s\\S]*?</section>")]
+    [GeneratedRegex(@"<section ignore[ \s\S]*?>[\s\S]*?</section>")]
     private static partial Regex IgnoreRegex();
 
-    [GeneratedRegex("<ConsoleLogger [\\s\\S]* />")]
+    [GeneratedRegex(@"<ConsoleLogger [\s\S]* />")]
     private static partial Regex ConsoleLoggerRegex();
 
-    [GeneratedRegex("<Tips[\\s\\S]*>[\\s\\S]*?</Tips>")]
+    [GeneratedRegex(@"<Tips[\s\S]*>[\s\S]*?</Tips>")]
     private static partial Regex TipsRegex();
 }
diff --git a/src/BootstrapBlazor.Server/Components/Samples/Icons/BootstrapIcons.razor b/src/BootstrapBlazor.Server/Components/Samples/Icons/BootstrapIcons.razor
index b13ce6b7686..c62f8611cdb 100644
--- a/src/BootstrapBlazor.Server/Components/Samples/Icons/BootstrapIcons.razor
+++ b/src/BootstrapBlazor.Server/Components/Samples/Icons/BootstrapIcons.razor
@@ -8,4 +8,10 @@
 
 <PackageTips Name="BootstrapBlazor.BootstrapIcon" />
 
+<Tips class="mt-3">
+    <div>@Localizer["P1"] <a href="https://www.nuget.org/packages/BootstrapBlazor.BootstrapIcon/" target="_blank">BootstrapBlazor.BootstrapIcon</a> @Localizer["P2"]</div>
+</Tips>
+
+<Pre>&lt;link href="_content/BootstrapBlazor.BootstrapIcon/css/bootstrap.min.css" rel="stylesheet"&gt;</Pre>
+
 <div>@((MarkupString)Localizer["Icons"].Value)</div>
diff --git a/src/BootstrapBlazor.Server/Components/Samples/Icons/MaterialDesignIcons.razor b/src/BootstrapBlazor.Server/Components/Samples/Icons/MaterialDesignIcons.razor
index bcf1f292407..c6f7db4507f 100644
--- a/src/BootstrapBlazor.Server/Components/Samples/Icons/MaterialDesignIcons.razor
+++ b/src/BootstrapBlazor.Server/Components/Samples/Icons/MaterialDesignIcons.razor
@@ -8,4 +8,10 @@
 
 <PackageTips Name="BootstrapBlazor.MaterialDesign" />
 
+<Tips class="mt-3">
+    <div>@Localizer["P1"] <a href="https://www.nuget.org/packages/BootstrapBlazor.MaterialDesign/" target="_blank">BootstrapBlazor.BootstrapIcon</a> @Localizer["P2"]</div>
+</Tips>
+
+<Pre>&lt;link href="_content/BootstrapBlazor.MaterialDesign/css/md.min.css" rel="stylesheet"&gt;</Pre>
+
 <div>@((MarkupString)Localizer["Icons"].Value)</div>
diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json
index 3584a5c9621..5efed3fc73a 100644
--- a/src/BootstrapBlazor.Server/Locales/en-US.json
+++ b/src/BootstrapBlazor.Server/Locales/en-US.json
@@ -6647,7 +6647,9 @@
   "BootstrapBlazor.Server.Components.Samples.Icons.BootstrapIcons": {
     "Title": "Bootstrap Icons",
     "BaseUsageText": "Free, high quality, open source icon library",
-    "Icons": "For icon information, please visit <a href=\"https://icons.getbootstrap.com/\" target=\"_blank\">[portal]</a>"
+    "Icons": "For icon information, please visit <a href=\"https://icons.getbootstrap.com/\" target=\"_blank\">[portal]</a>",
+    "P1": "Extending the Component Package by Reference",
+    "P2": "After adding the stylesheet file link open icon"
   },
   "BootstrapBlazor.Server.Components.Samples.Icons.ElementIcons": {
     "ElementIconTitle": "Element-plus Icons",
@@ -6666,7 +6668,9 @@
   "BootstrapBlazor.Server.Components.Samples.Icons.MaterialDesignIcons": {
     "Title": "MaterialDesign Icons",
     "BaseUsageText": "Material Design system icons are simple, modern and user-friendly",
-    "Icons": "For icon information, please visit <a href=\"https://pictogrammers.com/library/mdi/\" target=\"_blank\">[portal]</a>"
+    "Icons": "For icon information, please visit <a href=\"https://pictogrammers.com/library/mdi/\" target=\"_blank\">[portal]</a>",
+    "P1": "Extending the Component Package by Reference",
+    "P2": "After adding the stylesheet file link open icon"
   },
   "BootstrapBlazor.Server.Components.Samples.Icons.IconParks": {
     "IconParkTitle": "ByteDance Svg Icon Lib",
diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json
index b4ffa8137b1..fa57839b0d5 100644
--- a/src/BootstrapBlazor.Server/Locales/zh-CN.json
+++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json
@@ -6647,7 +6647,9 @@
   "BootstrapBlazor.Server.Components.Samples.Icons.BootstrapIcons": {
     "Title": "Bootstrap Icons",
     "BaseUsageText": "Bootstrap 免费开源图标库",
-    "Icons": "图标信息请通过 <a href=\"https://icons.getbootstrap.com/\" target=\"_blank\">[传送门]</a> 查看"
+    "Icons": "图标信息请通过 <a href=\"https://icons.getbootstrap.com/\" target=\"_blank\">[传送门]</a> 查看",
+    "P1": "通过引用扩展组件包",
+    "P2": "后添加样式表文件链接开启图标"
   },
   "BootstrapBlazor.Server.Components.Samples.Icons.ElementIcons": {
     "ElementIconTitle": "饿了么图标库",
@@ -6666,7 +6668,9 @@
   "BootstrapBlazor.Server.Components.Samples.Icons.MaterialDesignIcons": {
     "Title": "MaterialDesign Icons",
     "BaseUsageText": "Material Design 图标简单、现代、友好",
-    "Icons": "图标信息请通过 <a href=\"https://pictogrammers.com/library/mdi/\" target=\"_blank\">[传送门]</a> 查看"
+    "Icons": "图标信息请通过 <a href=\"https://pictogrammers.com/library/mdi/\" target=\"_blank\">[传送门]</a> 查看",
+    "P1": "通过引用扩展组件包",
+    "P2": "后添加样式表文件链接开启图标"
   },
   "BootstrapBlazor.Server.Components.Samples.Icons.IconParks": {
     "IconParkTitle": "字节跳动图标库",
diff --git a/src/BootstrapBlazor.Server/Services/PackageVersionService.cs b/src/BootstrapBlazor.Server/Services/PackageVersionService.cs
index 8a16926f164..ac07926f79f 100644
--- a/src/BootstrapBlazor.Server/Services/PackageVersionService.cs
+++ b/src/BootstrapBlazor.Server/Services/PackageVersionService.cs
@@ -6,7 +6,7 @@ namespace BootstrapBlazor.Server.Services;
 
 class PackageVersionService
 {
-    private IHttpClientFactory Factory { get; set; }
+    private IHttpClientFactory Factory { get; }
 
     public string? Version { get; }
 
@@ -16,14 +16,9 @@ class PackageVersionService
     public PackageVersionService(IHttpClientFactory factory)
     {
         Factory = factory;
-        if (OperatingSystem.IsBrowser())
-        {
-            Version = typeof(BootstrapComponentBase).Assembly.GetName().Version?.ToString();
-        }
-        else
-        {
-            Version = System.Diagnostics.FileVersionInfo.GetVersionInfo(typeof(BootstrapComponentBase).Assembly.Location).ProductVersion;
-        }
+        Version = OperatingSystem.IsBrowser()
+            ? typeof(BootstrapComponentBase).Assembly.GetName().Version?.ToString()
+            : System.Diagnostics.FileVersionInfo.GetVersionInfo(typeof(BootstrapComponentBase).Assembly.Location).ProductVersion;
 
         if (!string.IsNullOrEmpty(Version))
         {
@@ -43,7 +38,7 @@ public PackageVersionService(IHttpClientFactory factory)
 
     private async Task<string> FetchVersionAsync(string packageName = "bootstrapblazor")
     {
-        var version = "lastest";
+        var version = "latest";
         try
         {
             var url = $"https://azuresearch-usnc.nuget.org/query?q={packageName}&prerelease=true&semVerLevel=2.0.0";
@@ -55,7 +50,11 @@ private async Task<string> FetchVersionAsync(string packageName = "bootstrapblaz
                 version = package.GetVersion();
             }
         }
-        catch { }
+        catch
+        {
+            // ignored
+        }
+
         return version;
     }
 
@@ -67,7 +66,7 @@ private class NugetPackage
         public IEnumerable<NugetPackageData> Data { get; set; } = Array.Empty<NugetPackageData>();
 
         /// <summary>
-        /// 
+        ///
         /// </summary>
         /// <returns></returns>
         public string GetVersion() => Data.FirstOrDefault()?.Version ?? "";