html - 在 Zendesk hbs 中注入 Webfont 图标

Question

我正在尝试在 Zendesk Knowledge 主页的菜单项上添加图标。图标来自谷歌字体。

Zendesk 允许您通过 .hbs 文件进行自定义。主页上的菜单项位于home_page.hbs：

<li class="blocks-item">
    <a href='{{url}}' class="blocks-item-link">
        <h4 class="blocks-item-title">{{name}}</h4>
        <p class="blocks-item-description">{{excerpt description}}</p>
    </a>
</li>

到目前为止，我已经document_header.hbs使用这个 HTML 标签在网站上导入了 Google 字体：

<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">

我想在每个a.block-item-link这样的地方放一个不同的图标：

<span class="material-icons">account_balance</span>

由于每个块项目显示不同的项目（例如常见问题的类别），您将在哪里写下您放置在每个链接旁边的每个图标的名称？

（例如account_balance“账户余额问题”链接旁边的图标）