且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

我可以将自定义字体上传到大卡特尔吗?

更新时间:2022-12-10 22:31:49

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

Yes you can upload a custom font using the @fontface feature in CSS, but you'll need to have access to a server to store and upload it from. I used the Luna theme and this worked like a charm:

将这段代码插入到你的CSS文件中,并用你的字体的正确位置替换这个URL:

Insert this code into your CSS file and replace the URL with the proper location of your font:

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

我选择将我的主题放置在元素/共享部分,从你的CSS文件开始的一点点。

I chose to put mine in the 'Elements/Shared' section of my theme, a little ways down from the beginning of your CSS file.

然后改变CSS的这一部分:

Then change this section of your 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 }}; }

至此:

To this:

/* 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; }

您应该全部设置,字体将在整个主题中更改。这只是在卢娜主题上进行了测试,但我想这应该在所有的主题上普遍工作。

And you should be all set, the font will be changed throughout your theme. This has only been tested on the Luna theme, but I imagine this should work universally across all of the themes.

bigcartel 字体 custom