Showcase Theme- Custom Font

Solved
ac5a
Shopify Partner
14 0 5

Hi, 

 

I am trying to use a custom font on the showcase theme. 

 

However, the code that I tried to use does not work. 

 

 

I have added both the font files in the assets section and the files folder under content. 

 

Does anyone have any ideas on what code I should try? 

Screenshot 2023-10-30 at 8.58.28 PM.png

Accepted Solution (1)
PageFly-Noah
Globetrotter
561 130 130

This is an accepted solution.

 

Hi @ac5a 

 

This is Noah from PageFly - Shopify Page Builder App

 

You will need to place the correct source of the font assets to your code font like this screenshot:

PageFlyNoah_0-1698798797403.png

Please notice how i place the source of the font here.

 

Hope this can help you solve the issue 

 

Best regards,

Noah | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 3 (3)
Made4uo-Ribe
Shopify Partner
4121 945 1151

Hi @ac5a 

 

Try to follow the video below, we also posted other options in our blog. 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


PageFly-Noah
Globetrotter
561 130 130

This is an accepted solution.

 

Hi @ac5a 

 

This is Noah from PageFly - Shopify Page Builder App

 

You will need to place the correct source of the font assets to your code font like this screenshot:

PageFlyNoah_0-1698798797403.png

Please notice how i place the source of the font here.

 

Hope this can help you solve the issue 

 

Best regards,

Noah | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

ac5a
Shopify Partner
14 0 5

Thanks, worked!

 

Posting my code here in case it helps others in the future

 

@font-face {
font-family:"My Font";
src: url("{{ 'MyFont.woff' | asset_url }}") format("woff"),
url("{{ 'MyFont.woff2' | asset_url }}") format("woff2");
font-display:auto;
}

@font-face {
font-family: "My Font";
font-display: fallback;
src: url("https://cdn.shopify.com/s/files/1/0744/4204/7765/files/MyFont-Regular.woff2?v=1695992266") format("woff2"),
url("https://cdn.shopify.com/s/files/1/0744/4204/7765/files/MyFont-Regular.otf?v=1695992266") format("opentype");
}