2

我在名片上使用了某种字体，为了保持一致性，我想在我的网站上使用它们。我找不到上传字体的方法，也无法在自定义菜单中找到它。帮助将不胜感激！

4

2 回答 2

2

是的，您可以使用 CSS 中的 @fontface 功能上传自定义字体，但您需要访问服务器来存储和上传它。我使用了 Luna 主题，这就像一个魅力：

将此代码插入到您的 CSS 文件中，并将 URL 替换为字体的正确位置：

@font-face {
    font-family: CustomFontName;
    src: url(http://yourserver.com/fonts/customfontname.ttf); 
}

我选择把我的放在我的主题的“元素/共享”部分，从你的 CSS 文件的开头稍微往下一点。

然后更改 CSS 的这一部分：

/* Body Font */
body,
.product_header h3,
.product_header h5,
#product_inventory li h5,
#cart_items li .item_option,
#cart_summary li h3,
#social_links li h4,
.standalone .canvas p
{ font-family: {{ theme.body_font | font_family }}; }


/* Header Font */
h1, h2, h3, h4, h5, h6,
.button,
#error li,
#site_footer ul,
#site_footer #search input,
#main_nav li,
#cart_items li dt,
#cart_items li dd,
#cart_options #cart_discount p,
#cart_summary li span,
.standalone .canvas h1, input,
#cart_items li .quantity_input input
{ font-family: {{ theme.header_font | font_family }}; }

对此：

/* Body Font */
body,
.product_header h3,
.product_header h5,
#product_inventory li h5,
#cart_items li .item_option,
#cart_summary li h3,
#social_links li h4,
.standalone .canvas p
{ font-family: CustomFontName; }


/* Header Font */
h1, h2, h3, h4, h5, h6,
.button,
#error li,
#site_footer ul,
#site_footer #search input,
#main_nav li,
#cart_items li dt,
#cart_items li dd,
#cart_options #cart_discount p,
#cart_summary li span,
.standalone .canvas h1, input,
#cart_items li .quantity_input input
{ font-family:CustomFontName; }

你应该已经准备好了，字体将在你的主题中改变。这仅在 Luna 主题上进行了测试，但我想这应该适用于所有主题。

于 2014-07-09T01:46:19.037 回答
-1

要使这项工作跨浏览器，您需要访问托管字体的服务器上的 .htaccess 文件并添加以下行：

Header set Access-Control-Allow-Origin "*"

此处的文档：https ://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors/CORSMissingAllowOrigin

于 2019-07-08T13:31:15.187 回答