常规主题

Odoo 提供多种选项来塑造网站主题,包括 颜色、 字体 和 布局。

首次设置网站时,系统会提示您选择主题。将鼠标悬停在各个主题上,可以查看每个主题的扩展预览。点击主题即可将其选中。

Note

  • 如果您未选择主题就离开,系统将使用默认主题创建您的网站。

  • 如有需要,您可以稍后 切换主题。

在网站构建器中,主题 选项卡提供了多种选项,可用于自定义网站的常规主题。要访问该选项卡,请点击 编辑 ,然后转到 主题 选项卡。

完成所需的更改后,点击 保存 确认并将其应用到您的网站。

主题

在 网站 部分,点击 切换主题 以打开主题选择器。将鼠标悬停在主题上,可查看每个主题的扩展预览。点击某个主题即可将其应用到您的网站。

颜色

Odoo 的网站编辑器提供两种主要类型的颜色: 主题颜色 和 状态颜色 。

主题颜色

主题颜色是指显示在网站所有页面上的颜色集合。它由五种颜色组成:三种主要颜色,以及两种一浅一深的颜色。

要编辑网站的颜色,请转到网站编辑器中的 颜色 部分,然后:

  • 点击要更改的颜色圆点,然后选择一种 纯色 ,或点击 自定义 手动选取特定的色调(或输入其 #HEX 或 RGBA 代码)。

  • 点击调色板图标并选择一个配色方案。此操作会重置所有颜色自定义设置;点击某个颜色圆点即可更改特定颜色。

Odoo 会为您选择的配色方案自动创建 色彩预设 。这些预设是应用于网站不同元素的预定义颜色组合,可带来结构化且美观的设计。当您选择一种配色方案时,其预设会定义这些颜色如何在构建模块的不同元素之间分布,例如按钮、背景和文本。如果您想修改它们,请点击 色彩预设 ,然后点击某个预设以进一步自定义。每个色彩预设都包含构建模块的背景、文本、标题、链接、主要按钮和次要按钮的颜色。

色彩预设

要将色彩预设应用到网站上的构建模块,请选择该构建模块,转到 定制 选项卡,点击 背景 旁边的颜色圆点,然后选择一个 主题 。

Note

更改色彩预设会自动更新默认预设的颜色,以及使用该预设的构建模块的颜色。

状态颜色

状态颜色用于指示某些操作的状态(例如 成功 、 警告 等)。它们用于向用户和网站访客提供反馈的弹出消息中。要自定义网站的 状态颜色 ,请向下滚动到 高级 部分,并点击颜色圆点以更改其颜色。

Example

状态颜色选择 成功弹出框

页面布局

网站 部分中的 页面布局 选项可让您更改构建模块和网站元素在页面上的整体显示与间距。点击下拉菜单并选择所需的布局。在 页面布局 下,可通过选择 图片 、在 图案 中使用所选图片,或将背景留空来自定义 背景 。

字体

Odoo 允许您为网站上的特定元素自定义字体系列和大小,包括段落、标题、按钮和输入字段。

  • 字体系列 :在 段落 、 标题 和 按钮 部分中,从下拉菜单中选择一种字体。

  • 字体大小 :在 段落 、 标题 、 按钮 和 输入字段 部分中,使用 字体大小 字段设置默认大小。点击 (箭头)图标展开该部分,并定义自定义大小(例如,根据标题级别、按钮大小等)。

此外,每个特定元素的部分还提供额外的样式选项,例如 行高 和 外边距 ,以便进一步自定义。

自定义字体

您可以在网站上使用 Odoo 默认未提供的字体。要添加自定义字体,请点击 字体系列 字段相关的下拉菜单,并选择下拉菜单底部的 添加自定义字体 。在弹出的窗口中:

  • 要添加 Google 字体,请点击 选择 Google 字体 ,然后在列表中点击所需的字体。如果您的网站运营所在地的法规要求遵守诸如欧盟《通用数据保护条例》(GDPR)等(但不限于此)的法律,请关闭 从谷歌服务器提供字体 。这将确保 Google 字体存储在您网站的服务器上,而不是 Google 的服务器上。

  • 要从计算机上传自定义字体,请点击 选择文件 。

完成后,点击 保存并重新加载 。

按钮样式

要自定义网站主要按钮和次要按钮的样式,请转到网站编辑器中的 按钮 部分,并编辑相关选项:

  • 点击 主要样式 或 次要样式 字段旁的箭头,为每种按钮类型选择一种可用样式: 填充 、 轮廓 或 扁平 。选择 轮廓 时, 边框宽度 选项

  • 修改字体 。

  • 调整 内边距 ,可更改按钮标签周围间距的大小(以像素为单位)。

  • 使用 圆角 选项自定义按钮的边框半径。

  • 通过 点击效果 下拉菜单,为按钮点击时添加动画。

主要按钮和次要按钮

Tip

您可以为按钮的 内边距 、 字体大小 和 圆角 定义自定义的 小 和 大 尺寸:点击 (箭头)图标并使用相关字段。

按钮内边距、字体大小和圆角设置