字体
自定义字体仅在 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}
请注意,在原始链接中,URL 中没有 /blob/
目录。
支持多种语言
要支持多种字符集,例如拉丁语和西里尔语,您需要合并字体文件。
自定义单个嵌入项的字体
除了包含的字体之外,如果您为 Metabase 设置了自定义字体,该字体将可以在静态嵌入中从“使用实例字体”中选择。
延伸阅读
阅读其他版本的 Metabase 的文档。