字体
自定义字体仅在 Pro 和 Enterprise 计划(包括自托管和 Metabase 云)中可用。
在 Pro 和 Enterprise 计划中,您可以自定义 Metabase 使用的字体(默认为 Lato)。您可以从一组精选的 Google 字体中选择,这些字体支持 Metabase 各种 UI 元素所需的常规、粗体和特粗字体。
包含的字体
要更改 Metabase 字体,请点击屏幕右上角的齿轮图标,然后选择管理设置 > 设置 > 外观。在字体下,从包含的字体列表中选择。
- 自定义字体
- Lato
- Lora
- Merriweather
- Montserrat
- Noto Sans
- Open Sans
- Oswald
- Playfair Display
- Poppins
- PT Sans
- PT Serif
- Raleway
- Roboto
- Roboto Condensed
- Roboto Mono
- Roboto Slab
- Slabo 27px
- Source Sans Pro
- Ubuntu
目前不包含 Comic Sans。
自定义字体
要设置自定义字体,请点击屏幕右上角的齿轮图标,然后选择管理设置 > 设置 > 外观。
对于字体,选择自定义...并输入您的字体文件 URL。
字体样式选项
您可以设置三种不同的字体样式,每种样式对应一个 URL,Metabase 将使用这些样式(大小和粗细)正确显示其用户界面。字体粗细包括:
- 常规 400
- 粗体 700
- 特粗 900(有时称为 Black 900)
您只需设置第一种样式(常规 400);浏览器将填充其他样式。
为获得最佳效果,请至少设置 400 和 700 样式。如果您的单个字体文件包含同一系列内的多种字体样式,请在多个字段中输入 URL,以告知 Metabase 优先使用该字体文件中的粗细。Metabase 将使用这些样式覆盖浏览器设置的字体样式。
支持的字体文件格式
对于自定义字体,Metabase 支持 woff、woff2、ttf 文件。如果您提供的 URL 缺少特定的文件扩展名,Metabase 将假定它是 woff2 文件。
Google 字体 URL
要获取 Google 字体的 URL,请访问 Google 字体页面并选择您要使用的样式。然后发出 HTTP 请求以获取 tff 文件的 URL。例如,假设我们要使用 Roboto Mono:以下是获取 400 和 700 样式字体文件 URL 的方法:
我们将 URL https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;700&display=swap 粘贴到浏览器的地址栏中。此 URL 将返回如下响应:
* cyrillic-ext */
@font-face {
font-family: 'Roboto Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/robotomono/v21/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSV0me8iUI0lkQ.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Roboto Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/robotomono/v21/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSx0me8iUI0lkQ.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
...
对于拉丁文字,我们将复制每个样式相关的 src URL,在本例中为:
- 400 样式:https://fonts.gstatic.com/s/robotomono/v21/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSh0me8iUI0.woff2
- 700 样式:https://fonts.gstatic.com/s/robotomono/v21/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSh0me8iUI0.woff2
并将这些 URL 粘贴到管理设置 > 设置 > 外观 > 字体部分中“告诉我们每个字体粗细文件的位置。您无需全部包含,但包含它们会更好看”的相应输入字段中。
在 GitHub 上托管字体
如果您在 GitHub 上托管字体,字体应位于公共存储库中,并且您需要链接到从 raw.githubusercontent.com 域提供的原始字体文件。
例如,假设您要使用 Inter 字体。字体托管在:
https://github.com/rsms/inter/blob/master/docs/font-files/Inter-Regular.woff2
那么您需要的链接是:
https://raw.githubusercontent.com/rsms/inter/master/docs/font-files/Inter-Regular.woff2
它遵循以下模式:
raw.githubusercontent.com/${user}/${repo}/${branch}/${path}
请注意,原始链接中没有 /blob/
目录。
支持多种语言
要支持多种字符集,例如拉丁语和西里尔语,您需要合并字体文件。
为单个嵌入式项目自定义字体
除了包含的字体之外,如果您为 Metabase 设置了自定义字体,该字体将在静态嵌入中从“使用实例字体”中选择。
延伸阅读
阅读其他Metabase 版本的文档。