diff --git a/docs/en/images/pen-test-alert-list-9.1.png b/docs/en/images/pen-test-alert-list-9.1.png
index 5d35ae0ad8..caad96f862 100644
Binary files a/docs/en/images/pen-test-alert-list-9.1.png and b/docs/en/images/pen-test-alert-list-9.1.png differ
diff --git a/docs/en/ui-themes/lepton-x/blazor.md b/docs/en/ui-themes/lepton-x/blazor.md
index 6ae4bc7da1..5945b62e68 100644
--- a/docs/en/ui-themes/lepton-x/blazor.md
+++ b/docs/en/ui-themes/lepton-x/blazor.md
@@ -316,8 +316,43 @@ namespace LeptonX.DemoApp.Blazor.MyComponents
 
 > Don't forget to remove repeated attributes from the razor page!
 
----
+#### Customizing the Footer Section
+
+You can add a new `LeptonXFooter.razor` file and override the `Footer` component as follows:
+
+```cs
+@using Volo.Abp.DependencyInjection
+@using Volo.Abp.AspNetCore.Components.Web.LeptonXTheme.Components.ApplicationLayout.SideMenu
+
+@inherits Footer
+@attribute [ExposeServices(typeof(Footer))]
+@attribute [Dependency(ReplaceServices = true)]
+
+<div class="lpx-footbar-container">
+    <div class="lpx-footbar">
+        <div class="lpx-footbar-copyright">
+            <span>@DateTime.UtcNow.Year©</span>
+            <a href="https://leptontheme.com/" target="_blank">Lepton ThemeXXX</a>
+            <span>by</span>
+            <a href="https://volosoft.com/" target="_blank">Volosoft</a>
+        </div>
+        <div class="lpx-footbar-solo-links">
+            <a href="#">About</a>
+            <a href="#">Privacy</a>
+            <a href="#">Contact</a>
+        </div>
+    </div>
+</div>
+```
+
+If you are using **Top Menu Layout**, then you can change the namespace as follows:
+
+```diff
+- @using Volo.Abp.AspNetCore.Components.Web.LeptonXTheme.Components.ApplicationLayout.SideMenu
++ @using Volo.Abp.AspNetCore.Components.Web.LeptonXTheme.Components.ApplicationLayout.TopMenu
+```
 
+> You can use the same approach customize the other components always.
 
 
 ## Common Components
diff --git a/docs/en/ui-themes/lepton-x/images/leptonx-mvc-customizing-footer.png b/docs/en/ui-themes/lepton-x/images/leptonx-mvc-customizing-footer.png
new file mode 100644
index 0000000000..06721044b8
Binary files /dev/null and b/docs/en/ui-themes/lepton-x/images/leptonx-mvc-customizing-footer.png differ
diff --git a/docs/en/ui-themes/lepton-x/mvc.md b/docs/en/ui-themes/lepton-x/mvc.md
index a317e8b9ed..ad690a81ec 100644
--- a/docs/en/ui-themes/lepton-x/mvc.md
+++ b/docs/en/ui-themes/lepton-x/mvc.md
@@ -138,6 +138,22 @@ Layout options of the MVC Razor Pages UI can be manageable by using **LeptonXThe
 > - **_Sidebar.cshtml**
 > - **_Toolbar.cshtml**
 
+#### Customizing the Footer Section
+
+Add the **_Footer.cshtml** file under the **Themes/LeptonX/Layouts/Application** folder to customize the footer:
+
+```html
+<div class="text-center py-2 lpx-footer">
+    <span class="copyright-text">
+       @DateTime.Now.Year © AbpSolution1<br />
+    </span>
+</div>
+````
+
+![Customizing Footer](images/leptonx-mvc-customizing-footer.png)
+
+> You can customize the **_Sidebar.cshtml** and **_Toolbar.cshtml** files as well.
+
 ### Account Layout
 
 ![Account layout](images/leptonx-account-layout-new.png)