Odoo 富文本编辑器

Odoo 富文本编辑器允许在 HTML 字段（如 内部备注、描述）以及 知识文章 <knowledge/articles_editing/edit-article>、Studio 报告编辑器 <studio/pdf-reports/report-editor> 等位置创建和编辑富文本内容。开始输入或使用 工具栏 <essentials/html_editor/toolbar> 或 Powerbox <essentials/html_editor/commands> 进行文本格式化与结构化。

:::: tip ::: title 提示 :::

将鼠标悬停在文本中的任意元素（标题、表格、剪贴板等）上，即可显示 fa-sort (拖动) 图标。点击并按住该图标即可将元素拖拽到文本中的其他位置。 ::::

选中或双击单词、句子或段落，即可显示文本编辑器工具栏，并可使用以下标准格式化选项：

  • 字体样式：使用多种选项定义字体样式，如 标题 1~6、普通、段落、代码、引用。
  • 字体大小：选择首选的字体大小。
  • fa-bold (切换粗体)：将文字设为粗体。
  • fa-italic (切换斜体)：将文字设为斜体。
  • fa-underline (切换下划线)：为文字添加下划线。
  • fa-font (应用字体颜色)：自定义字体颜色：
    • 实色：从预定义调色板中选择颜色。
    • 自定义：使用色轮或手动输入 hex 代码及 RGBA 值自定义颜色。
    • 渐变：选择预定义渐变或在 线性、径向 中选择并调节色轮。
    • fa-trash (重置)：恢复原始字体/背景颜色。
  • fa-link (添加链接)：为选中文本插入或编辑 URL 链接，亦可通过文件 URL 上传图片。
  • Odoo AI：输入提示词获取 AI 生成内容，或直接点击 AI 建议。

点击 fa-ellipsis-v (展开工具栏) 图标可显示更多格式化选项：

  • 字体族：使用 默认系统字体 或选择首选的字体族。
  • fa-strikethrough (切换删除线)：为文字添加删除线。
  • fa-paint-brush (应用背景颜色)：自定义背景颜色。
  • fa-eraser (移除格式)：清除选中文本的所有格式。
  • fa-list-ul (切换列表)：选择以下列表类型：
    • fa-list-ul (项目符号列表)：转换为项目符号列表。
    • fa-list-ol (编号列表)：转换为编号列表。
    • fa-check-square-o (检查列表)：转换为检查列表。
  • fa-align-left (对齐文本)：选择以下对齐方式：
    • fa-align-left (左对齐)：左对齐。
    • fa-align-center (居中对齐)：居中对齐。
    • fa-align-right (右对齐)：右对齐。
    • fa-align-justify (两端对齐)：两端对齐。
  • Translate with AI：使用 AI 将内容翻译为已安装的语言 </applications/general/users/language>。

:::: tip ::: title 提示 :::

  • 使用以下键盘快捷键应用格式：

    • 强调：按 [CTRL]/CMD + [B]、[I]、[U] 分别实现粗体、斜体、下划线。
    • 编号列表：输入 [1.]、[1)]、[A.]、[A)] 开始编号列表。
    • 项目符号列表：输入 [*] 或 [-] 开始项目符号列表。

  • 点击超链接文本并执行以下操作之一： fa-clipboard (复制链接)、fa-pencil-square-o (编辑链接)、fa-chain-broken (移除链接)。 ::::

命令用于在文本编辑器中编辑和管理各种功能，如表格、横幅、标题等。

使用方法：键入 / 打开 Powerbox，输入命令名称或从多功能列表中选择插入表格、图片、横幅等。

:::: tip ::: title 提示 :::

新段落出现时会显示带有命令快捷图标的工具提示。点击图标添加命令，或点击 fa-ellipsis-v (省略号) 图标打开全部命令的 Powerbox。 ::::

:::: note ::: title 注意 :::

特定应用的命令未在此处列出。 ::::

:::::::::: tabs .. tab:: 结构

命令 用途

fa-minus 插入水平分割线 Separator

fa-columns 转换为 2 列 2 columns

fa-columns 转换为 3 列 3 columns

fa-columns 转换为 4 列 4 columns

fa-table 插入表格 Table

fa-list-ul 创建项目符号列表 Bulleted list

fa-list-ol 创建编号列表 Numbered list

fa-check-square-o{.interpreted-text 创建检查列表 role=“icon”} Checklist

fa-caret-square-o-right{.interpreted-text 隐藏一组文本为可折叠切换 role=“icon”} Toggle list

:::: note ::: title 注意 :::

要组织表格，悬停在列或行上会显示表格菜单。点击 fa-ellipsis-h (省略号) 图标可移动、插入或删除列/行。 ::::

::: tab 横幅 :::

命令 用途

fa-info-circle{.interpreted-text 插入信息横幅 role=“icon”} Banner Info

fa-check-circle{.interpreted-text 插入成功横幅 role=“icon”}
Banner Success

fa-exclamation-triangle{.interpreted-text 插入警告横幅 role=“icon”}
Banner Warning

::: tab 格式 :::

命令 用途

fa-header{.interpreted-text 大章节标题 role=“icon”}
Heading 1

fa-header{.interpreted-text 中章节标题 role=“icon”}
Heading 2

fa-header{.interpreted-text 小章节标题 role=“icon”}
Heading 3

fa-paragraph{.interpreted-text 段落块：插入段落 role=“icon”} Text

fa-exchange{.interpreted-text 切换文本方向 role=“icon”}
Switch direction

fa-quote-right{.interpreted-text 添加块引用 role=“icon”} Quote

fa-code{.interpreted-text 添加代码块 role=“icon”} Code

::: tab 媒体 :::

命令 用途

fa-file-image-o{.interpreted-text 插入图片 或 role=“icon”} 在 Unsplash 数据库中搜索 Media{.interpreted-text </applications/general/integrations/unsplash>`，或上传图片、文档、图标。

fa-upload{.interpreted-text 添加下载框：共享图片、录音或文档，供内部用户下载 role=“icon”}
Upload a file

::: tab 导航 :::

命令 用途

fa-link{.interpreted-text 添加链接：输入标签并填写 URL，或上传文件后点击 Apply role=“icon”} Link{.interpreted-text
role=“guilabel”}

fa-link{.interpreted-text 添加按钮：输入标签、URL 或上传文件，选择按钮样式、类型、尺寸后点击 Apply role=“icon”} Button{.interpreted-text role=“guilabel”}

fa-bookmark{.interpreted-text 高亮结构（标题）：基于标题创建目录 role=“icon”}
Table Of Contents

::: tab 小部件 :::

命令 用途

fa-smile-o{.interpreted-text 添加表情：搜索所需表情 role=“icon”}
Emoji

fa-star-o{.interpreted-text 插入最高 3 星的评分 role=“icon”}
3 Stars

fa-star{.interpreted-text 插入最高 5 星的评分 role=“icon”}
5 Stars

::::::::::

要插入媒体，键入 [/Media] 或点击工具提示中的 fa-file-image-o (媒体) 图标，然后在以下标签中选择：

  • 图片

    • 在 Unsplash </applications/general/integrations/unsplash> 数据库中搜索合适的图片。
    • Add URL：粘贴 图片地址。
    • Upload an image：将图片上传至库中。

  • 文档

    • 在数据库中搜索文档。
    • Add URL：粘贴有效的 URL。
    • Upload a document：从本地驱动器上传文档。

  • 图标：搜索并选择可用图标。

  • 视频：粘贴来自 YouTube、Vimeo、Dailymotion、优酷等来源的视频 URL，或输入代码嵌入视频。

:::: note ::: title 注意 :::

添加视频时，可使用切换按钮启用自动播放或循环，隐藏播放器控件或全屏按钮，或设置起始时间。 ::::

在 插入图片 <insert-media> 后，点击图片即可显示媒体编辑工具栏，并可使用以下格式化选项：

  • fa-search-plus (预览图片)：预览、放大/缩小、旋转、打印或下载图片。点击右上角 fa-times (关闭) 图标退出预览。
  • Description：编辑图片描述和提示信息，完成后点击 Apply。
  • Caption：在图片下方填写不超过 100 字的说明文字。
  • fa-square (圆角)：为图片四角添加圆角。
  • fa-circle-o (圆形)：将图片裁成圆形。
  • fa-sun-o (阴影)：为图片添加阴影效果。
  • fa-picture-o (缩略图)：为图片添加边框。
  • fa-plus-square-o (内边距)：添加图片内边距，可选 Small、Medium、Large、XL 四种尺寸。
  • Resize：恢复图片默认尺寸，或设置为 25%、50%、100%。
  • fa-object-ungroup (对象)：缩放并旋转图片。再次点击 fa-object-ungroup (object) 可重置变换。
  • fa-crop (裁剪图片)：手动裁剪或使用以下选项：
    • 选择 [Flexible]、[16:9]、[4:3]、[1:1]、[2:3] 等比例。
    • 放大/缩小。
    • 左右旋转。
    • 水平或垂直翻转。
    • 重置图片。
  • fa-link (添加链接)：为图片添加链接，输入 URL 后点击 Apply。若需移除链接，点击 fa-unlink (移除链接)。
  • fa-exchange (替换)：通过 Unsplash 数据库搜索、更换 URL 或上传新图片来替换当前图片。
  • fa-trash (删除)：删除图片。

在 插入图标 <insert-media> 后，点击图标即可显示图标编辑工具栏，并可使用以下格式化选项：

  • fa-font (选择字体颜色)：自定义字体颜色。
  • fa-paint-brush (选择背景颜色)：自定义背景颜色。
  • Resize icon：从 1x 到 5x 调整大小。
  • fa-play (切换图标旋转)：开启旋转动画。
  • Replace：选择其他图标。