diff --git a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx
index 558f730f47..b54eb4f181 100644
--- a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx
+++ b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout-main.tsx
@@ -31,7 +31,7 @@ import { useAppContext } from '@/context/app-context'
 import Tooltip from '@/app/components/base/tooltip'
 import LinkedAppsPanel from '@/app/components/base/linked-apps-panel'
 import useDocumentTitle from '@/hooks/use-document-title'
-import { getDocLink } from '@/context/i18n'
+import { useDocLink } from '@/i18n/language'
 
 export type IAppDetailLayoutProps = {
   children: React.ReactNode
@@ -48,6 +48,7 @@ const ExtraInfo = ({ isMobile, relatedApps, expand }: IExtraInfoProps) => {
   const locale = getLocaleOnClient()
   const [isShowTips, { toggle: toggleTips, set: setShowTips }] = useBoolean(!isMobile)
   const { t } = useTranslation()
+  const docLink = useDocLink()
 
   const hasRelatedApps = relatedApps?.data && relatedApps?.data?.length > 0
   const relatedAppsTotal = relatedApps?.data?.length || 0
@@ -97,7 +98,7 @@ const ExtraInfo = ({ isMobile, relatedApps, expand }: IExtraInfoProps) => {
             <div className='my-2 text-xs text-text-tertiary'>{t('common.datasetMenus.emptyTip')}</div>
             <a
               className='mt-2 inline-flex cursor-pointer items-center text-xs text-text-accent'
-              href={getDocLink('/guides/knowledge-base/integrate-knowledge-within-application')}
+              href={docLink('/guides/knowledge-base/integrate-knowledge-within-application')}
               target='_blank' rel='noopener noreferrer'
             >
               <RiBookOpenLine className='mr-1 text-text-accent' />
diff --git a/web/app/components/app/create-app-modal/index.tsx b/web/app/components/app/create-app-modal/index.tsx
index e98bb1f434..fee6851d14 100644
--- a/web/app/components/app/create-app-modal/index.tsx
+++ b/web/app/components/app/create-app-modal/index.tsx
@@ -29,7 +29,7 @@ import { NEED_REFRESH_APP_LIST_KEY } from '@/config'
 import { getRedirection } from '@/utils/app-redirection'
 import FullScreenModal from '@/app/components/base/fullscreen-modal'
 import useTheme from '@/hooks/use-theme'
-import { getDocLink } from '@/context/i18n'
+import { useDocLink } from '@/i18n/language'
 
 type CreateAppProps = {
   onSuccess: () => void
@@ -304,32 +304,37 @@ function AppTypeCard({ icon, title, description, active, onClick }: AppTypeCardP
 
 function AppPreview({ mode }: { mode: AppMode }) {
   const { t } = useTranslation()
+  const docLink = useDocLink()
   const modeToPreviewInfoMap = {
     'chat': {
       title: t('app.types.chatbot'),
       description: t('app.newApp.chatbotUserDescription'),
-      link: getDocLink('/guides/application-orchestrate/chatbot-application'),
+      link: docLink('/guides/application-orchestrate/chatbot-application', {
+        'zh-hans': '/zh-hans/guides/workflow/readme',
+      }),
     },
     'advanced-chat': {
       title: t('app.types.advanced'),
       description: t('app.newApp.advancedUserDescription'),
-      link: getDocLink('/guides/workflow/README'),
+      link: docLink('/guides/workflow/readme'),
     },
     'agent-chat': {
       title: t('app.types.agent'),
       description: t('app.newApp.agentUserDescription'),
-      link: getDocLink('/guides/application-orchestrate/agent'),
+      link: docLink('/guides/application-orchestrate/agent'),
     },
     'completion': {
       title: t('app.newApp.completeApp'),
       description: t('app.newApp.completionUserDescription'),
-      link: getDocLink('/guides/application-orchestrate/text-generator',
+      link: docLink('/guides/application-orchestrate/text-generator',
         { 'zh-hans': '/guides/application-orchestrate/readme' }),
     },
     'workflow': {
       title: t('app.types.workflow'),
       description: t('app.newApp.workflowUserDescription'),
-      link: getDocLink('/guides/workflow/README'),
+      link: docLink('/guides/application-orchestrate/chatbot-application', {
+        'zh-hans': '/zh-hans/guides/workflow/readme',
+      }),
     },
   }
   const previewInfo = modeToPreviewInfoMap[mode]
diff --git a/web/i18n/language.ts b/web/i18n/language.ts
index a31f9e9c4b..ab1871185d 100644
--- a/web/i18n/language.ts
+++ b/web/i18n/language.ts
@@ -1,4 +1,6 @@
 import data from './languages.json'
+import { useMemo } from 'react'
+import { getLocaleOnClient } from '@/i18n/index'
 export type Item = {
   value: number | string
   name: string
@@ -49,6 +51,19 @@ export const getDocLanguage = (locale: string) => {
   return DOC_LANGUAGE[locale] || 'en'
 }
 
+export const useDocLink = (baseUrl?: string): ((path: string, pathMap?: { [index: string]: string }) => string) => {
+    const baseDocUrl = baseUrl || 'https://docs.dify.ai'
+    return useMemo(() => {
+        // 返回拼接函数
+        return (path: string, pathMap?: { [index: string]: string }): string => {
+            const locale = getLocaleOnClient()
+            const docLanguage = (['zh-Hans', 'ja-JP'].includes(locale) ? locale : 'en').toLowerCase()
+            const targetPath = (pathMap !== undefined) ? pathMap[docLanguage] || path : path
+            return (targetPath.startsWith('/')) ? `${baseDocUrl}/${docLanguage}${targetPath}` : `${baseDocUrl}/${docLanguage}/${targetPath}`
+        }
+    }, [baseDocUrl])
+}
+
 const PRICING_PAGE_LANGUAGE: Record<string, string> = {
   'ja-JP': 'jp',
 }