主题 API
通过精细的主题属性自定义表单的视觉外观。
主题 API 允许您读取和更新表单的完整视觉主题。主题属性控制表单本身及各个 UI 元素(如按钮、指示器和选项)的颜色、字体、品牌标识和布局。
所有请求和响应体均使用 snake_case 字段命名。
获取表单主题
/api/v1/forms/:id/theme检索表单的所有主题属性。
路径参数
idstring表单 ID
响应
{
"theme_color": "#6366f1",
"background_color": "#0a0a0a",
"text_color": "#ffffff",
"answer_text_color": "#e5e7eb",
"placeholder_color": "#6b7280",
"button_color": "#6366f1",
"button_text_color": "#ffffff",
"title_color": "#f9fafb",
"description_color": "#d1d5db",
"option_text_color": "#e5e7eb",
"indicator_bg_color": "#1f2937",
"indicator_text_color": "#9ca3af",
"font_family": "Inter",
"font_family_answer": "Inter",
"font_family_button": "Inter",
"font_family_description": "Inter",
"font_family_option": "Inter",
"font_family_indicator": "Inter",
"question_font_size": "24px",
"custom_css": null,
"show_progress_bar": true,
"branding_logo_url": null,
"branding_footer_text": null,
"hide_branding": false,
"top_logo_url": null,
"top_logo_size": null,
"top_logo_alignment": "center",
"top_logo_css": null,
"watermark_css": null,
"welcome_title": "Welcome",
"welcome_description": null,
"welcome_button_text": "Start",
"thank_you_title": "Thank you!",
"thank_you_description": null
}
代码示例
curl -X GET "https://api.nueform.io/api/v1/forms/665a1b2c3d4e5f6a7b8c9d0e/theme" \
-H "Authorization: Bearer YOUR_API_KEY"
更新表单主题
/api/v1/forms/:id/theme更新表单的主题属性。仅包含您想要更改的字段。未指定的字段保留当前值。
路径参数
idstring表单 ID
请求体
包含下方主题属性参考中的任意主题属性组合。
请求示例
{
"theme_color": "#2563eb",
"background_color": "#ffffff",
"text_color": "#111827",
"button_color": "#2563eb",
"button_text_color": "#ffffff",
"font_family": "Poppins",
"question_font_size": "28px",
"show_progress_bar": true,
"hide_branding": true,
"top_logo_url": "https://cdn.example.com/logo.svg",
"top_logo_size": "140px",
"top_logo_alignment": "left"
}
响应
返回完整的更新后主题对象(与获取表单主题结构相同)。
代码示例
curl -X PUT "https://api.nueform.io/api/v1/forms/665a1b2c3d4e5f6a7b8c9d0e/theme" \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"theme_color": "#2563eb",
"background_color": "#ffffff",
"text_color": "#111827",
"font_family": "Poppins"
}'
主题属性参考
以下是可用于自定义的完整主题属性列表。
颜色属性
theme_colorstring表单中使用的主强调色(焦点环、高亮)。默认:"#6366f1"
background_colorstring表单背景颜色。默认:"#0a0a0a"
text_colorstring主要问题文字颜色。默认:null
answer_text_colorstring答案输入框中输入文字的颜色。默认:null
placeholder_colorstring空输入框中的占位符文字颜色。默认:null
button_colorstring提交/下一步按钮的背景颜色。默认:null
button_text_colorstring提交/下一步按钮的文字颜色。默认:null
title_colorstring问题标题文字颜色(覆盖标题的 text_color)。默认:null
description_colorstring问题描述文字颜色。默认:null
option_text_colorstring多选和下拉选项的文字颜色。默认:null
indicator_bg_colorstring步骤/问题编号指示器的背景颜色。默认:null
indicator_text_colorstring步骤/问题编号指示器的文字颜色。默认:null
字体属性
font_familystring问题标题的字体。支持任何 Google 字体或系统字体。默认:null
font_family_answerstring答案输入文字的字体。默认:null
font_family_buttonstring按钮标签的字体。默认:null
font_family_descriptionstring问题描述的字体。默认:null
font_family_optionstring多选选项标签的字体。默认:null
font_family_indicatorstring步骤/问题编号指示器的字体。默认:null
question_font_sizestring问题标题的字号(例如 "24px"、"1.5rem")。默认:null
布局与进度
show_progress_barboolean是否在表单顶部显示进度条。默认:true
品牌标识
branding_logo_urlstring显示在页脚区域的品牌 Logo URL。默认:null
branding_footer_textstring表单页脚中显示的自定义文字。默认:null
hide_brandingboolean隐藏默认的 NueForm 品牌页脚。默认:false
top_logo_urlstring显示在表单顶部的 Logo URL。默认:null
top_logo_sizestring顶部 Logo 的尺寸(例如 "120px"、"80px")。默认:null
top_logo_alignmentstring顶部 Logo 的水平对齐方式:"left"、"center"、"right"。默认:null
top_logo_cssstring应用于顶部 Logo 容器的自定义 CSS。默认:null
watermark_cssstring应用于品牌水印的自定义 CSS。默认:null
欢迎页与感谢页
welcome_titlestring欢迎页上显示的标题文字。默认:null
welcome_descriptionstring欢迎页上的描述文字。默认:null
welcome_button_textstring欢迎页的按钮标签。默认:"Start"
thank_you_titlestring完成页的标题文字。默认:"Thank you!"
thank_you_descriptionstring完成页的描述文字。默认:null
高级
custom_cssstring注入到表单渲染器的自定义 CSS。用于主题属性无法覆盖的高级自定义。默认:null
错误响应
这些端点返回的标准错误响应。
错误码
401Unauthorized缺少或无效的 API 密钥
403Forbidden团队表单权限不足
404Not Found表单未找到
500Server Error服务器内部错误
错误示例
{
"error": "Form not found"
}