diff --git a/.changeset/rude-cups-greet.md b/.changeset/rude-cups-greet.md
new file mode 100644
index 00000000..e5726627
--- /dev/null
+++ b/.changeset/rude-cups-greet.md
@@ -0,0 +1,5 @@
+---
+'@alita/plugins': patch
+---
+
+feat: customHeader
diff --git a/docs/docs/guides/alita-layout.md b/docs/docs/guides/alita-layout.md
index ae3df5de..443bee47 100644
--- a/docs/docs/guides/alita-layout.md
+++ b/docs/docs/guides/alita-layout.md
@@ -30,6 +30,7 @@ export const mobileLayout = {
   navBar,
   documentTitle: '默认标题',
   titleList,
+  customHeader
 };
 ```
 
@@ -39,6 +40,7 @@ export const mobileLayout = {
 | navBar        | NavBarProps     | 否   |  定义页面头部导航栏                        |
 | documentTitle | string          | 否   |  定义所有页面的默认标题                     |
 | titleList     | TitleListItem[] | 否   |  定义页面的标题                    |
+| customHeader     | 组件 | 否   |  自定义页面的头部                |
 
 
 ### 定义页面底部导航标签栏
diff --git a/examples/boilerplate/src/app.tsx b/examples/boilerplate/src/app.tsx
index f7de5e1e..d4fcc16b 100644
--- a/examples/boilerplate/src/app.tsx
+++ b/examples/boilerplate/src/app.tsx
@@ -101,6 +101,7 @@ export const mobileLayout = {
   navBar,
   tabBar,
   titleList,
+  // customHeader:<div>asdasdassaasd</div>
 };
 
 export async function getKeepAlive(keepaliva: any[]) {
diff --git a/examples/boilerplate/src/layouts/layout.tsx b/examples/boilerplate/src/layouts/layout.tsx
index 3a56d623..508f796c 100644
--- a/examples/boilerplate/src/layouts/layout.tsx
+++ b/examples/boilerplate/src/layouts/layout.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 
 const Layout = ({ children }) => {
-  return <>{children}</>;
+  return <div>1232312213{children}</div>;
 };
 
 export default Layout;
diff --git a/packages/plugins/templates/mobile-layout/layout.tpl b/packages/plugins/templates/mobile-layout/layout.tpl
index 97cb0431..b3b755f1 100644
--- a/packages/plugins/templates/mobile-layout/layout.tpl
+++ b/packages/plugins/templates/mobile-layout/layout.tpl
@@ -437,7 +437,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
   const location = useLocation();
   // mobile layout runtime config
   const runtime = getPluginManager().applyPlugins({ key: 'mobileLayout',type: 'modify', initialValue: {} });
-  const { titleList, documentTitle, navBar, tabBar, onPageChange } = runtime;
+  const { titleList, documentTitle, navBar, tabBar, onPageChange, customHeader=null  } = runtime;
   useEffect(() => {
     setPageNavBar(getPageNavBar());
     setTabBarList(getTabBarList());
@@ -465,6 +465,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
   };
   return (
     <AlitaLayout {...layout}>
+      {customHeader}
       {element}
     </AlitaLayout>
   );
diff --git a/packages/plugins/templates/mobile-layout/layout5.tpl b/packages/plugins/templates/mobile-layout/layout5.tpl
index 40f3d8fd..8acee2dd 100644
--- a/packages/plugins/templates/mobile-layout/layout5.tpl
+++ b/packages/plugins/templates/mobile-layout/layout5.tpl
@@ -423,7 +423,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
   const location = useLocation();
   // mobile layout runtime config
   const runtime = getPluginManager().applyPlugins({ key: 'mobileLayout',type: 'modify', initialValue: {} });
-  const { titleList, documentTitle, navBar, tabBar, onPageChange } = runtime;
+  const { titleList, documentTitle, navBar, tabBar, onPageChange, customHeader=null } = runtime;
   useEffect(() => {
     setPageNavBar(getPageNavBar());
     setTabBarList(getTabBarList());
@@ -451,6 +451,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
   };
   return (
     <AlitaLayout {...layout}>
+      {customHeader}
       {element}
     </AlitaLayout>
   );