diff --git a/src/components/sp-page/header.js b/src/components/sp-page/header.js
index e6d197770..b06587d34 100644
--- a/src/components/sp-page/header.js
+++ b/src/components/sp-page/header.js
@@ -25,7 +25,8 @@ const CustomNavigationHeader = memo((props) => {
     mantle,
     onNearbyClick,
     onSearchConfirm,
-    nearbyText
+    nearbyText,
+    navigationRSpace
   } = props
 
   const value = pageConfig
@@ -63,7 +64,6 @@ const CustomNavigationHeader = memo((props) => {
 
   const containerStyle = useCallback(() => {
     return {
-      textAlign: value?.titlePosition,
       color: value?.titleColor
     }
   }, [value])
@@ -86,8 +86,8 @@ const CustomNavigationHeader = memo((props) => {
       url: isGoodsShelves()
         ? '/subpages/guide/index'
         : VERSION_IN_PURCHASE
-        ? '/pages/purchase/index'
-        : '/pages/index'
+          ? '/pages/purchase/index'
+          : '/pages/index'
     })
   }, [])
 
@@ -204,33 +204,37 @@ const CustomNavigationHeader = memo((props) => {
           className={classNames('header-container', { 'has-nearby': hasNearby })}
           style={showHeaderContent ? styleNames(containerStyle()) : {}}
         >
-          {/* 左侧：返回、首页、功能区三者只显示一个 */}
-          {showHeaderContent && showFunctionArea ? (
-            <>
-              {/* 有功能区时只显示功能区（热区图或附近门店） */}
-              {functionAreaType === 'hotzone' && hotzoneImgUrl && renderHotZone()}
-              {functionAreaType === 'nearby' && renderNearby()}
-            </>
-          ) : (
-            <>
-              {btnReturn && (
-                <View className='nav-left-capsule' onClick={() => Taro.navigateBack()}>
-                  <SpImage src='fv_back.png' width={36} height={36} />
-                </View>
-              )}
-              {btnHome && !btnReturn && (
-                <View className='nav-left-capsule' onClick={handleHomeClick}>
-                  <SpImage src='fv_home.png' width={36} height={36} />
-                </View>
-              )}
-            </>
-          )}
-          {/* 标题区：搜索 */}
-          {showHeaderContent && titleStyle === '3' && renderSearch()}
-          {/* 标题区：页面名称 */}
-          {showHeaderContent && titleStyle === '1' && renderTitleText()}
-          {/* 标题区：图片 */}
-          {showHeaderContent && titleStyle === '2' && renderTitleImage()}
+          <View className='header-container-left'>
+            {/* 左侧：返回、首页、功能区三者只显示一个 */}
+            {showHeaderContent && showFunctionArea ? (
+              <>
+                {/* 有功能区时只显示功能区（热区图或附近门店） */}
+                {functionAreaType === 'hotzone' && hotzoneImgUrl && renderHotZone()}
+                {functionAreaType === 'nearby' && renderNearby()}
+              </>
+            ) : (
+              <>
+                {btnReturn && (
+                  <View className='nav-left-capsule' onClick={() => Taro.navigateBack()}>
+                    <SpImage src='fv_back.png' width={36} height={36} />
+                  </View>
+                )}
+                {btnHome && !btnReturn && (
+                  <View className='nav-left-capsule' onClick={handleHomeClick}>
+                    <SpImage src='fv_home.png' width={36} height={36} />
+                  </View>
+                )}
+              </>
+            )}
+          </View>
+          <View className='title-container' style={{ width: `calc(100% - ${navigationRSpace}px)` }}>
+            {/* 标题区：搜索 */}
+            {showHeaderContent && titleStyle === '3' && renderSearch()}
+            {/* 标题区：页面名称 */}
+            {showHeaderContent && titleStyle === '1' && renderTitleText()}
+            {/* 标题区：图片 */}
+            {showHeaderContent && titleStyle === '2' && renderTitleImage()}
+          </View>
         </View>
       </View>
     </View>
diff --git a/src/components/sp-page/index.js b/src/components/sp-page/index.js
index a2f548c12..137f61b58 100644
--- a/src/components/sp-page/index.js
+++ b/src/components/sp-page/index.js
@@ -320,6 +320,7 @@ const SpPage = memo(
             mantle={state.mantle}
             nearbyText={props.nearbyText}
             onSearchConfirm={props.onSearchConfirm}
+            navigationRSpace={state.navigationRSpace}
           />
         )}
         {props.isDefault &&
diff --git a/src/components/sp-page/index.scss b/src/components/sp-page/index.scss
index 4771fb286..43927cc90 100644
--- a/src/components/sp-page/index.scss
+++ b/src/components/sp-page/index.scss
@@ -5,6 +5,20 @@
 .sp-page {
   box-sizing: border-box;
   width: 100vw;
+  .header-container-left {
+    display: flex;
+    align-items: center;
+  }
+  .title-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    -o-text-overflow: ellipsis;
+    -webkit-text-overflow: ellipsis;
+  }
   .sp-page-header {
     display: flex;
     align-items: center;