diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index de764d6a56..3f61e6c464 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -54,3 +54,8 @@ Did you have an issue, like a merge conflict, or don't know how to open a pull r
 ## Community channels
 
 Stuck somewhere? Have any questions? Join the [Discord Community Server](https://discord.gg/AhzKf7dNgk). We are here to help!
+
+### i18n (Internationalization) Support
+
+We are looking for contributors to help with translations in other languages. If you are interested in helping, please join the [Discord Community Server](https://discord.gg/AhzKf7dNgk) and let us know.  
+Also check out the [Frontend i18n README]((web/i18n/README_EN.md)) for more information.
\ No newline at end of file
diff --git a/CONTRIBUTING_CN.md b/CONTRIBUTING_CN.md
index 51327d24b7..6e36135fae 100644
--- a/CONTRIBUTING_CN.md
+++ b/CONTRIBUTING_CN.md
@@ -51,3 +51,7 @@ git clone git@github.com:<github_username>/dify.git
 ## 社区渠道
 
 遇到困难了吗？有任何问题吗? 加入 [Discord Community Server](https://discord.gg/AhzKf7dNgk)，我们将为您提供帮助。
+
+### 多语言支持
+
+需要参与贡献翻译内容，请参阅[前端多语言翻译 README](web/i18n/README_CN.md)。
diff --git a/web/i18n/README_CN.md b/web/i18n/README_CN.md
new file mode 100644
index 0000000000..80a54d829b
--- /dev/null
+++ b/web/i18n/README_CN.md
@@ -0,0 +1,82 @@
+# 前端 i18n 修改
+
+## 后端多语言支持
+
+`api/libs/helper.py:117` 中添加对应的语言支持。如：
+```python
+def supported_language(lang):
+    if lang in ['en-US', 'zh-Hans', 'de', 'de-AT']:
+        return lang
+```
+
+
+## 添加多语言文件
+
+在 `web/i18n/lang` 下添加不同模块的多语言文件。文件命令为 模块名.{LANG}.ts。详细参考[LANG](https://www.venea.net/web/culture_code) 
+
+## 引入新添加的多语言文件
+在 `web/i18n/i18next-config.ts` 中 resources 对象中中引入新添加的多语言文件。如：
+
+```javascript
+const resources = {
+    'en': {...},
+    'zh-Hans': {...},
+    // 引入新添加的语言
+    'new LANG': {
+      translation: {
+        common: commonNewLan,
+        layout: layoutNewLan,
+        ...
+      }
+    }
+}
+```
+
+## 翻译过程中的改动
+
+### 日期格式化的多语言处理
+
+目前日期做多语言格式化的文件涉及到如下 2 个: 
+
+```javascript
+1. web/app/components/header/account-setting/members-page/index.tsx
+// Line: 78 
+{dayjs(Number((account.last_login_at || account.created_at)) * 1000).locale(locale === 'zh-Hans' ? 'zh-cn' : 'en').fromNow()}
+2. web/app/components/develop/secret-key/secret-key-modal.tsx
+// Line：82
+const formatDate = (timestamp: any) => {
+    if (locale === 'en') {
+      return new Intl.DateTimeFormat('en-US', { year: 'numeric', month: 'long', day: 'numeric' }).format((+timestamp) * 1000)
+    } else {
+      return new Intl.DateTimeFormat('fr-CA', { year: 'numeric', month: '2-digit', day: '2-digit' }).format((+timestamp) * 1000)
+    }
+  }
+```
+看需求做对应的改动。
+
+### 翻译中带变量的内容的处理
+
+翻译中会存在带变量的情况，变量的值会在运行时被替换。翻译中的变量会用{{ 和 }} 包裹。
+翻译带变量的内容时：
+  1. 不能改变量的名称。即：变量的名称不需要做翻译。
+  2. 确保变量填充后，语句仍保持通顺。
+
+查找所有翻译中带变量的方式：在 ./web/i18n/lang 下搜索：{{。
+
+### 翻译内容太长破坏 UI
+
+如果某个翻译的内容比其他语言的长很多，检查下是否会破坏 UI。
+
+## 帮助文档
+
+目前的帮助文档的调整逻辑是：中文跳转中文，其他语言跳英文。如果帮助文档也做了多语言。需要做这块的改动。
+
+## 验证
+
+新增语言包建议通过本地部署最新代码来验证，可参考：https://docs.dify.ai/getting-started/install-self-hosted/local-source-code
+验证点：
+1. 首次初始化安装是否存在新语言下拉选项，以及是否可以用新语言进行初始化
+2. 个人设置中是否存在新语言下拉选项，以及是否可以选择并保存新语言
+3. 界面各处文案是否使用新语言来展示，以及文案是否破坏 UI
+4. 从模板创建应用内容是否均为新语言
+5. （CLOUD 版）通过 OAuth 授权登录后，是否直接设置当前浏览器语言为界面语言
diff --git a/web/i18n/README_EN.md b/web/i18n/README_EN.md
new file mode 100644
index 0000000000..247e057309
--- /dev/null
+++ b/web/i18n/README_EN.md
@@ -0,0 +1,81 @@
+# Frontend i18n modification
+
+## Backend i18n modification
+
+`api/libs/helper.py:117` Add corresponding language support. Such as:
+```python
+def supported_language(lang):
+    if lang in ['en-US', 'zh-Hans', 'de', 'de-AT']:
+        return lang
+```
+
+## Adding multiple language files
+
+Add multilingual files for different modules under web/i18n/lang. The file name is Module name.{LANG}.ts. Please refer [LANG](https://www.venea.net/web/culture_code) for details.
+
+## Introducing a newly added multilingual file 
+
+Introduce the newly added multilingual file in the resources object in web/i18n/i18next-config.ts. For example:
+
+```javascript
+const resources = {
+    'en': {...},
+    'zh-Hans': {...},  
+    _// Introduce the newly added language_
+    'new LANG': {  
+      translation: {  
+        common: commonNewLan,  
+        layout: layoutNewLan,  
+        ...  
+      }  
+    }
+}
+```
+## Changes in the translation process
+
+### Multi-language processing of date formatting
+
+Currently, two files are involved in date formatting in multiple languages:
+
+```javascript
+1. web/app/components/header/account-setting/members-page/index.tsx
+_// Line 78_   
+{dayjs(Number((account.last_login_at || account.created_at)) * 1000).locale(locale === 'zh-Hans' ? 'zh-cn' : 'en').fromNow()}  
+2. web/app/components/develop/secret-key/secret-key-modal.tsx  
+_// Line 82_
+const formatDate = (timestamp: any) => {
+    if (locale === 'en') {  
+      return new Intl.DateTimeFormat('en-US', { year: 'numeric', month: 'long', day: 'numeric' }).format((+timestamp) * 1000)  
+    } else {  
+      return new Intl.DateTimeFormat('fr-CA', { year: 'numeric', month: '2-digit', day: '2-digit' }).format((+timestamp) * 1000)  
+    }  
+  }
+```
+
+Make corresponding changes based on requirements.
+
+### Handling translation content with variables
+
+There will be variables in the translation, and the value of the variables will be replaced at runtime. Variables in translation will be wrapped in {{ and }}.
+When translating content with variables:
+  1. Do not change the variable name. That is: the variable name does not need to be translated. 
+  2. Ensure that the statement remains smooth after the variable is filled.
+Find all translations with variables: search for {{ under ./web/i18n/lang. 
+
+### Translation content is too long to destroy UI
+
+If a certain translation content is much longer than other languages, check if it will destroy the UI.
+
+## Help documentation
+
+The current logic for adjusting the help documentation is: Chinese jumps to Chinese, other languages jump to English. If the help documentation is also multilingual, changes need to be made in this area. 
+
+## Verification
+
+It is recommended to verify the newly added language pack through local deployment of the latest code. For reference: https://docs.dify.ai/getting-started/install-self-hosted/local-source-code
+Verification points:
+1. Whether the initial installation has new language drop-down options, and whether the new language can be used for initialization
+2. Whether there is a new language drop-down option in personal settings, and whether the new language can be selected and saved 
+3. Whether the text in the interface is displayed in the new language, and whether the text destroys the UI
+4. Whether the content created from the template is all in the new language
+5. (CLOUD version) After logging in through OAuth authorization, whether the current browser language is set directly as the interface language