如何为 WooCommerce 商店新增谷歌字型
您的商店使用了正确的字型吗？
随著移动端互联网使用者的日益增多，商店字型已逐渐成为网页设计师，出版商和零售商的重点关注物件。为此，BBC 和英国《卫报》近日推出了专为手机阅读设计的新型字型，并调低了企业购买商业字型许可的相关费用。
当然，即使您并无庞大的预算，您同样可以更新站点字型以获得更棒的阅读体验，为浏览器和装置设计相一致的外观，并进一步降低页面载入时间以助您提升 SEM 店群排名。
何种字型最适合您的站点？
无论您是设计爱好者或热衷于尝试所有新奇事物，您都将在商店字型上开启新世界的大门。日前，网络上已有成千上万种开源字型可供下载和使用，使用者可以购买其中几千种字型。
由于您希望商店字型易于载入和使用，那么您最好只在谷歌字型库中进行挑选。谷歌字型库是一种开放原始码的字型储存库，其中提供的字型加速缓存迅速，页面载入时间短，非常方便使用者在小萤幕上阅读。截至目前，谷歌字型库共提供近 848 种字型系列，其中 823 种系列适用于英文文字。
如何为 WooCommerce 商店新增谷歌字型
因此，为缩小可选范围，您需要遵循供职于 Canva 的 Janie Kliever 提出的字型选择基本原则：
2-3 种字型是多数站点的理想数量。如果您坚持只选用一种字型，您的商店可能看上去千篇一律，访客也很难区分标题和主要内容。然而，一旦您选用的字型超出 2-3 种，整个商店不仅看上去杂乱无章，也会给使用者留下不专业的印象。
选择有对比度的字型，建立视觉层级。比如，您可以使用粗体或衬线（serif）字型打造醒目标题，并采用简单的 sans serif 字型作为主要正文，要知道，这些字型完美支援智慧手机扫描。
此外，Google Design 提供了排印和字型的详细概述，当然，您也可以在挑选商店字型：新手指南中为您的商店找到最适合的字型。其中，您应该注意以下几点：
该商店是准备长期运营还是短期运营？长期运营的商店需要安装不同风格的字型系列。
该商店的文字块篇幅多长？如果文章通常包含五个或更多段落，相信衬线字型是个不错的选择。
该商店常用的字号？越简单的字型在小号字型下更容易阅读，但是作为标题可能不够醒目。
该商店访客会选择其他语言版本吗？如果答案是肯定的，您需要选择支援多指令码字元的字型系列，以正确显示各语言版本。
最后，该指南还针对特定场景为读者推荐了几款热门字型，希望对您有所启发。当然，您也可以点选这里浏览全部谷歌字型。
挑选适合自己商店的谷歌字型
当您遍览谷歌字型库时，面对著这繁杂的目录，您可能一时无法找到适合自己的商店字型。比如，以帮助宠物照料商店寻找字型为例，我们想为该网点的标题找到醒目、专业且充满诙谐元素的衬线字型。
首先，定位谷歌字型库中的搜索过滤侧边栏。在这里，您可以选择衬线字型类别，并根据年龄，热门程度或按名称的字母顺序来过滤目标字型。
接著在语言栏中，您可以选择 “拉丁” 选项挑出支援英文的全部字型（您可能有点疑惑，但我们的确使用拉丁字母表）。
然后，您可以选中对应的核取方块以开启滑动选单，并根据不同风格（如轻字型，加粗或斜体等字型变体），厚度，倾斜度和宽度对选项进行微调。
在选定 “serif” 和 “Latin” 后，您便为这家宠物照料商店挑选出了 174 种标题字型，不过感觉 Bree Serif 的效果最好。为预览商店文案，您需插入游标，清除虚拟文字，并输入 “我们的宠物照料服务选单” 以替换预设文案。（当然，您也可以点选 “应用所有字型” 按钮以避免重复输入。）
您不仅可以使用滑块选单在 8-112 画素之间调节字型大小，而且还能够使用左侧的下拉选单预览文案的句、段呈现效果，或者字母和数字在对应字型下的外观。
此外，别忘记点选 “+” 按钮将 Bree Serif 加入底部的字型常用栏，在这里，您可以收集一些您偏爱的常用字型。当您准备最后的安装时，请点选黑色的选项栏，HTML 和 CSS 代码将为您的商店安装字型。总之，您可以尽情下载喜欢的字型，但是由于下载会占用一定的时间和商店空间，谷歌通常建议您不要过多下载。
如何在您的商店上使用谷歌字型？
如果您愿意向商店新增代码，则可以根据 Google Fonts API 入门指南，参照样式表选择商店所需的字型系列和样式。此外，您还将了解如何优化字型以显著减少标题和 logo 的字型档案大小。
相反，对于那些不愿意程式设计商店代码的使用者来说，他们可以安装相应的 WordPress 插件外挂，让其帮助自己安装并管理谷歌字型。而其中最为著名的要属 Easy Google Fonts，迄今已逾 30 万次下载。安装这款插件外挂之后，您不仅可以免去程式设计站点主题代码的烦恼，同时还可以获得一份谷歌字型大全，再也无需手动选择和下载任何字型。
Easy Google Fonts 在 WordPress 仪表盘的自定义版块新增了字型选单，在这里，您可以为您站点主题的不同标题和文案搭配对应的字型，风格，颜色和其他文字元素。
您可以检视网页变更的实时预览，访客登入后只能看到您储存和应用之后的效果。为变更非主题预设控制元件的文字元素，Easy Google Fonts 支援使用者建立自己的字型控制元件，而该控制元件将显示在 Typography（字型排印）选单中。当您选定想用的谷歌字型，并确定预览显示正常，这时您可以储存和应用此次变更，以实时更新您的商店。
更新字型，升级商店
要知道，更新站点字型不仅意味著赋予商店全新的外观，其实还为访客提供了更为优秀的使用者体验。尤其在这个智慧手机撑起半边天的时代，要想为商店赢得大量的回头客，设计载入迅速的字型以提升受众阅读体验堪称实现这一目标的不二法宝。
相关阅读：WooCommerce 主机比较常见的问题
