diff --git a/docs/en/reference/default-theme-footer.md b/docs/en/reference/default-theme-footer.md
index a58e8ac6b198..c5a6429674e1 100644
--- a/docs/en/reference/default-theme-footer.md
+++ b/docs/en/reference/default-theme-footer.md
@@ -20,6 +20,9 @@ export interface Footer {
 
   // The actual copyright text.
   copyright?: string
+
+  // Whether to show the footer when the sidebar is visible.
+  showWithSidebar?: boolean
 }
 ```
 
@@ -40,7 +43,7 @@ export default {
 Only inline elements can be used in `message` and `copyright` as they are rendered inside a `<p>` element. If you want to add block elements, consider using [`layout-bottom`](../guide/extending-default-theme#layout-slots) slot instead.
 :::
 
-Note that footer will not be displayed when the [SideBar](./default-theme-sidebar) is visible.
+By default, the footer will not be displayed when the [SideBar](./default-theme-sidebar) is visible. But you can change this behavior by setting `showWithSidebar` to `true` in the configuration.
 
 ## Frontmatter Config
 
diff --git a/docs/zh/reference/default-theme-footer.md b/docs/zh/reference/default-theme-footer.md
index 7499089f0cda..c44bface28e3 100644
--- a/docs/zh/reference/default-theme-footer.md
+++ b/docs/zh/reference/default-theme-footer.md
@@ -20,6 +20,9 @@ export interface Footer {
 
   // 实际的版权文本
   copyright?: string
+
+  // 是否在侧边栏可见时显示页脚
+  showWithSidebar?: boolean
 }
 ```
 
@@ -40,7 +43,7 @@ export default {
 只有内联元素可以在 `message` 和 `copyright` 中使用，因为它们渲染在 `<p>` 元素中。如果想添加块元素，请考虑使用 [`layout-bottom`](../guide/extending-default-theme#layout-slots) 插槽。
 :::
 
-请注意，当[侧边栏](./default-theme-sidebar)可见时，不会显示页脚。
+默认情况下，当[侧边栏](./default-theme-sidebar)可见时，不会显示页脚。但可以通过在配置中设置 `showWithSidebar` 来更改此行为。
 
 ## frontmatter 配置 {#frontmatter-config}
 
diff --git a/src/client/theme-default/components/VPFooter.vue b/src/client/theme-default/components/VPFooter.vue
index 636380448810..4872b823a6f4 100644
--- a/src/client/theme-default/components/VPFooter.vue
+++ b/src/client/theme-default/components/VPFooter.vue
@@ -7,7 +7,11 @@ const { hasSidebar } = useLayout()
 </script>
 
 <template>
-  <footer v-if="theme.footer && frontmatter.footer !== false" class="VPFooter" :class="{ 'has-sidebar': hasSidebar }">
+  <footer
+    v-if="theme.footer && frontmatter.footer !== false && (!hasSidebar || theme.footer.showWithSidebar || frontmatter.footer)"
+    class="VPFooter"
+    :class="{ 'has-sidebar': hasSidebar }"
+  >
     <div class="container">
       <p v-if="theme.footer.message" class="message" v-html="theme.footer.message"></p>
       <p v-if="theme.footer.copyright" class="copyright" v-html="theme.footer.copyright"></p>
@@ -24,10 +28,6 @@ const { hasSidebar } = useLayout()
   background-color: var(--vp-c-bg);
 }
 
-.VPFooter.has-sidebar {
-  display: none;
-}
-
 .VPFooter :deep(a) {
   text-decoration-line: underline;
   text-underline-offset: 2px;
@@ -50,6 +50,12 @@ const { hasSidebar } = useLayout()
   text-align: center;
 }
 
+@media (min-width: 960px) {
+  .has-sidebar .container {
+    padding-left: var(--vp-sidebar-width);
+  }
+}
+
 .message,
 .copyright {
   line-height: 24px;
diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts
index 338c9432c7c7..20c7a535a9c4 100644
--- a/types/default-theme.d.ts
+++ b/types/default-theme.d.ts
@@ -324,6 +324,7 @@ export namespace DefaultTheme {
   export interface Footer {
     message?: string
     copyright?: string
+    showWithSidebar?: boolean
   }
 
   // team ----------------------------------------------------------------------