diff --git a/frontend/WARP.md b/frontend/WARP.md
new file mode 120000
index 00000000..681311eb
--- /dev/null
+++ b/frontend/WARP.md
@@ -0,0 +1 @@
+CLAUDE.md
\ No newline at end of file
diff --git a/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateEditor.tsx b/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateEditor.tsx
index c37c931a..126be901 100644
--- a/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateEditor.tsx
+++ b/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateEditor.tsx
@@ -299,9 +299,8 @@ export const TemplateEditor: React.FC<TemplateEditorProps> = ({
                   setFormData(data);
                 }}
                 showSubmit={false}
-                showCancel={false}
-                readonly={false}
-              />
+                  showCancel={false}
+                />
               </div>
             </ScrollArea>
           ) : (
diff --git a/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateRender.tsx b/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateRender.tsx
index 6d3c0b16..4280e7f5 100644
--- a/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateRender.tsx
+++ b/frontend/src/pages/Deploy/NotificationTemplate/List/components/TemplateRender.tsx
@@ -5,6 +5,7 @@ import React, { useState, useEffect } from 'react';
 import { Alert, AlertDescription } from '@/components/ui/alert';
 import { Loader2, AlertCircle } from 'lucide-react';
 import { NotificationChannelType } from '../../../NotificationChannel/List/types';
+import { renderTemplate } from '../service';
 
 interface TemplateRenderProps {
   template: string;
@@ -37,10 +38,19 @@ export const TemplateRender: React.FC<TemplateRenderProps> = ({
     setError(null);
     
     try {
-      // 不调用render接口，直接使用模板内容
-      setPreviewContent(template);
+      // 调用后端 render API 进行 FreeMarker 模板渲染
+      // 后端返回格式: { success: true, data: "渲染后的内容", message: "操作成功", code: 200 }
+      // request 工具会自动解析并返回 data 字段
+      const renderedContent = await renderTemplate(
+        template,  // templateContext
+        formData || {}  // params
+      );
+      
+      setPreviewContent(renderedContent);
+      setError(null);
     } catch (error: any) {
-      setError('渲染失败');
+      console.error('Template render error:', error);
+      setError(error.response?.data?.message || error.message || '渲染失败');
       setPreviewContent('');
     } finally {
       setLoading(false);
diff --git a/frontend/src/pages/Deploy/NotificationTemplate/List/service.ts b/frontend/src/pages/Deploy/NotificationTemplate/List/service.ts
index c01c1685..d3fe7821 100644
--- a/frontend/src/pages/Deploy/NotificationTemplate/List/service.ts
+++ b/frontend/src/pages/Deploy/NotificationTemplate/List/service.ts
@@ -122,7 +122,7 @@ export const checkTemplateCodeUnique = async (
 export const renderTemplate = async (
   templateContext: string,
   params: Record<string, any>
-): Promise<{ content: string; success: boolean; error?: string }> => {
+): Promise<string> => {
   return request.post(`${API_PREFIX}/render`, {
     templateContext,
     params