0

我有一个 myshopify 网站,我试图在使用中显示字体@font-face.. 但由于某种原因,字体没有生效.. 这是我所拥有的:

资产文件夹中的字体文件

在 css 中使用 myshopify 资产 url:

  @font-face {
    font-family: 'LeagueGothicRegular';
    src: url('{{ 'League_Gothic-webfont.eot' | asset_url }}');
    src: url('{{ 'League_Gothic-webfont.eot?iefix' | asset_url }}') format('embedded-opentype'),
    url({{ 'League_Gothic-webfont.woff' | asset_url }}) format('woff'),
    url('{{ 'League_Gothic-webfont.ttf' | asset_url }}') format('truetype'),
    url('{{ 'League_Gothic-webfont.svg#LeagueGothicRegular' | asset_url }}') format('svg');
    font-weight: normal;
    font-style: normal;
}


..

#top-menu a{
    font-family: 'LeagueGothicRegular', sans-serif;
    background-color: #fff;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #000000;
    display: inline-block;
    font-size: 1.97em;
    line-height: 1;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
  padding: 6px 18px;
  padding-top: 8px;
  text-decoration: none
}

有什么弹出来?谢谢你!

4

2 回答 2

0

我发现了一个类似的 SO question about using font-faces with Shopify 这似乎表明您需要从在 css url 中使用过滤器的任何地方删除外引号asset_url(这与我在原始答案中建议的相反) :

@font-face {
    font-family: 'LeagueGothicRegular';
    src: url({{ 'League_Gothic-webfont.eot' | asset_url }});
    src: url({{ 'League_Gothic-webfont.eot?iefix' | asset_url }}) format('embedded-opentype'),
         url({{ 'League_Gothic-webfont.woff' | asset_url }}) format('woff'),
         url({{ 'League_Gothic-webfont.ttf' | asset_url }}) format('truetype'),
         url({{ 'League_Gothic-webfont.svg#LeagueGothicRegular' | asset_url }}) format('svg');
    font-weight: normal;
    font-style: normal;
}

asset_url 文档页面(靠近底部)似乎证实了这一点。

根据另一个问题,您可能还需要修改包含字体的文件夹的 htaccess。

于 2013-04-01T21:58:09.043 回答
0

我遇到了同样的问题。

经过进一步检查,我的字体文件与我的其他主题文件具有不同的权限。我使用 chmod 使它们像其他人一样成为 644,然后重新上传。像魅力一样工作。

chmod 644 LeagueGoth*

并重新上传。

于 2014-04-26T19:57:03.610 回答