本帖最后由 qiaofei828 于 2024-3-11 17:17 编辑
一、制作字体分包 在网络下载你喜欢的字体TTF文件 分包完成后点击页面右下角下载ZIP压缩包 二、上传至HA
下载的压缩包解压后得到以下文件文件数量根据字体的大小会有所不同 将所有文件上传至HA，每个字体的文件需要单独的文件夹，建议放在WWW文件夹内 三、配置仪表盘资源 点击配置→仪表盘→右上角三个点→资源→右下角添加资源 /local/ziti/ShangShouJianYuanTi-2/result.css 填入以上内容 路径/local即WWW文件夹 /ziti/ShangShouJianYuanTi-2需要改为你自己的字体文件夹路径 /result.css不用更改
四、编辑主题yaml文件 HA的主题文件存放在根目录的themes文件夹内 编辑你正在使用主题的yaml文件并添加以下代码
primary-font-family: '"TsangerFeiBai W03",sans-serif'
paper-font-common-base_-_font-family: "var(--primary-font-family)"
paper-font-common-code_-_font-family: "var(--primary-font-family)"
paper-font-body1_-_font-family: "var(--primary-font-family)"
paper-font-subhead_-_font-family: "var(--primary-font-family)"
paper-font-headline_-_font-family: "var(--primary-font-family)"
paper-font-caption_-_font-family: "var(--primary-font-family)"
paper-font-title_-_font-family: "var(--primary-font-family)"
ha-card-header-font-family: "var(--primary-font-family)"
TsangerFeiBai W03是中文字体名称，此名称可在字体分包压缩包中的result.css中找到
如果需要单独的字母和数字字体可重复1~3步后在中文字体名称前添加单独的字母和数字字体名称
如下图
五、使字体生效
在做完以上步骤后应用你更改后的主题
然后选择快速重载yaml配置并刷新页面即可生效
六、单个卡片的使用
添加完字体资源后也可在卡片中单独使用字体。
只需用card_mod添加以下代码
card_mod:
style: |
ha-card {
font-family: "HFDigits","TsangerFeiBai W03", sans-serif;
}
| 
发表于 2023-11-13 14:39:46
楼主