如何动态加载 Typekit 字体?
有没有一种方法可以动态加载 typekit 字体,就像 Google Font API 一样?
也就是说,如何在每个页面上动态声明 css 链接中的字体名称,并仅加载该页面所需的字体,而不是将字体添加到套件中并加载整个套件。
Is there a way to load typekit fonts dynamically, much like the Google Font API?
That is, how can I declare dynamically on each page the font name in a css link and load just the font(s) that are required for that page, instead of adding fonts into a kit and the loading the whole kit.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我找到了一个解决方案,将其发布在这里,以防对其他人有用:
我将使用 Typekit API 为我的应用程序所需的每个不同组合动态创建一个新的“套件”(即 javascript 文件),而不是包括所有组合将它们装在一个大“套件”中。
请参阅:https://typekit.com/docs/api/kits
无论如何,感谢您的回答!
I have found a solution, posting it here in case it is useful for someone else:
I will use the Typekit API to dynamically create a new 'kit' (i.e. javascript file) for every different combination that my app requires, instead of including all of them in one big 'kit'.
See: https://typekit.com/docs/api/kits
Thanks anyway for your answers!
您可以编写一个服务器端脚本,根据页面的不同,该脚本将使用您希望的 font-family 规则生成不同的 css 文件。
然后你可以使用 @import 将此规则引入你的主 css 文件中。
You could write a server side script that, depending on the page, will generate a different css file with the font-family rule(s) you wish.
Then you could use @import to bring this rule into your main css file.
TypeKit 最近引入了一种方法,用户可能会发现这种方法有助于执行与您正在寻找的功能类似的功能,但无需使用 API,就能以非常简单的方式完成此操作。他们称之为动态子集。
在我撰写本文时,它仅适用于东亚字体,但是,有一种解决方法可以将其与其他 TypeKit 字体一起使用。解决方法来自此网站。
添加东亚字体,例如 Source Han Sans Japanese。这会自动将套件转换为动态套件。
选择每种字体,然后在
字符集
选项下为每种字体选择动态子集
。删除东亚字体。
发布工具包。
即使删除东亚字体,该套件仍将是动态套件。
TypeKit has recently introduced a way that users may find useful to perform functionality similar to what you are looking for but doing it in a very easy way without having to use the API. They call it Dynamic Subsetting.
As I write this it is only available for East Asian Fonts, however, there is a workaround to use it with other TypeKit fonts. The workaround comes from this site.
Add a East Asian Font such as Source Han Sans Japanese. This will automatically convert the kit to a dynamic kit.
Select each font and under the
Character Set
options chooseDynamic Subsetting
for each font.Remove the East Asian Font.
Publish Kit.
Even if you remove the East Asian Font, the kit will remain a Dynamic Kit.