How can I add a custom font to the Debut theme?

Store Design
1

Hi guys i need HELP! im trying to add my logo font and other brand fonts to my store so everything is the same throughout the site. Ive tried several tips i found here on how to edit the code but its still not reflecting on my site. Any suggestions???

1 Like
2 
.site-nav--centered .site-nav__link {
    font-family: "your font" !important;
    color: #9371ad !important;
}
@media screen and (min-width: 500px){
.site-nav { background-color: #f9d2e9; }
}

try like this...
you have to upload " your font" font file(.woff) in asset folder to use this font..
3

@Jasminehuff

can you please flow this step

Yes, you can do easy to upload your custom font

  1. Go to Online Store->Theme->Edit code
    2.Asset->/theme.scss.liquid or theme.css->upload your custom font all font tyep = TTF, OTF, WOFF, WOFF2, SVG
  2. Asset->/theme.scss.liquid or theme.css->paste below code at the bottom of the file.
@font-face {
font-family: 'Montserrat-Regular';
src: url('{{ 'Montserrat-Regular.eot?' | asset_url }}');
src: url('{{ 'Montserrat-Regular.eot??#iefix' | asset_url }}') format('embedded-opentype'),
url('{{ 'Montserrat-Regular.woff' | asset_url }}') format('woff'),
url('{{ 'Montserrat-Regular.ttf' | asset_url }}') format('truetype'),
url('{{ 'Montserrat-Regular.svg#Montserrat-Regular' | asset_url }}') format('svg');
font-weight: normal;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: antialiased;
}

can you please just change font name, for example, Montserrat-Regular to your custom font name

4

hi thanks for your response i’ve tried this several times as i saw this solution already It still doesn’t work

1 Like
5

@Jasminehuff

sorry for that can you please share store url

6

Your content helped me a lot to take my doubts, Thanks for sharing this information this is useful.

RapidFS

7

sure its www.jluxeny.com

1 Like
8

@Jasminehuff

thanks for URL

sorry but i can’t see custom font and code where do you have add?

9

Under theme.css

10

@KetanKumar

1 Like
11

@Jasminehuff

sorry but i can’t see

12

You can’t see the code??

13

@KetanKumar

14

I also tried this and it didn’t work. my url is becahwearbbs.com and the font I added was Audhistine. do you see it on there?