『瀚思彼岸』» 智能家居技术论坛

 找回密码
 立即注册
查看: 1727|回复: 3

[基础教程] 【教程更新】随意更改HA全局字体(任意字体)

[复制链接]

22

主题

143

帖子

1678

积分

金牌会员

Rank: 6Rank: 6

积分
1678
金钱
1535
HASS币
0
发表于 2023-11-13 14:39:46 | 显示全部楼层 |阅读模式
本帖最后由 qiaofei828 于 2024-3-11 17:17 编辑

一、制作字体分包
在网络下载你喜欢的字体TTF文件
打开在线字体分包网站并上传TTF文件
分包完成后点击页面右下角下载ZIP压缩包
微信截图_20240311161317.png
二、上传至HA
下载的压缩包解压后得到以下文件
文件数量根据字体的大小会有所不同
微信截图_20240311161619.png
将所有文件上传至HA,每个字体的文件需要单独的文件夹,建议放在WWW文件夹内
微信截图_20240311162059.png
三、配置仪表盘资源
点击配置→仪表盘→右上角三个点→资源→右下角添加资源
/local/ziti/ShangShouJianYuanTi-2/result.css
填入以上内容
路径/localWWW文件夹
/ziti/ShangShouJianYuanTi-2需要改为你自己的字体文件夹路径
/result.css不用更改
微信截图_20240311164359.png

四、编辑主题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)"

微信截图_20240311163746.png
TsangerFeiBai W03是中文字体名称,此名称可在字体分包压缩包中的result.css中找到
微信截图_20240311163901.png
如果需要单独的字母和数字字体可重复1~3步后在中文字体名称前添加单独的字母和数字字体名称
如下图
微信截图_20240311162910.png
五、使字体生效
在做完以上步骤后应用你更改后的主题
然后选择快速重载yaml配置并刷新页面即可生效
六、单个卡片的使用
添加完字体资源后也可在卡片中单独使用字体。
只需用card_mod添加以下代码


card_mod:
  style: |
    ha-card {
      font-family: "HFDigits","TsangerFeiBai W03", sans-serif;
    }  

微信截图_20240311170826.png

评分

参与人数 1金钱 +10 收起 理由
隔壁的王叔叔 + 10 666啊

查看全部评分

回复

使用道具 举报

8

主题

870

帖子

5218

积分

论坛元老

Rank: 8Rank: 8

积分
5218
金钱
4348
HASS币
0
发表于 2023-11-13 22:02:50 | 显示全部楼层
666,这个真的太好了
回复

使用道具 举报

22

主题

612

帖子

2755

积分

金牌会员

Rank: 6Rank: 6

积分
2755
金钱
2143
HASS币
0
发表于 2023-11-14 11:52:03 | 显示全部楼层
这个好,非常有用
回复

使用道具 举报

22

主题

143

帖子

1678

积分

金牌会员

Rank: 6Rank: 6

积分
1678
金钱
1535
HASS币
0
 楼主| 发表于 2024-3-11 17:21:41 | 显示全部楼层
【教程更新】随意更改HA全局字体(任意字体)
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|Hassbian

GMT+8, 2024-11-25 16:28 , Processed in 0.254851 second(s), 30 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表