html - 如何在shopify站点添加自定义字体

Question

我添加了字体代码

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

同时在 Assets 文件夹中上传了字体文件。

Question: How to use font for all headings, My theme using sass variables,

Answer 1

Upload font files in assets folder

If your font has multiple files, you will have to repeat this process for each one.

Link The Fonts In Your CSS

Open your theme’s CSS file. In most themes, this is called theme.scss.liquid

@font-face {
    font-family: 'your-font';
    src: url('./your-font.eot');
    src: url('./your-font.eot?#iefix') format('embedded-opentype'),
         url('./your-font.woff2') format('woff2'),
         url('./your-font.woff') format('woff'),
         url('./your-font.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

Replace font-family in your theme.scss.liquid