Font not displaying correctly on some sections (products and cart)

Solved
Tourist
21 0 1

Hi,

 

I'm using the Debut theme. 

 

I've added my custom font like this:

 


@font-face {
font-family: 'khmer_mnregular';
src: url('{{'khmermn-webfont.woff2' | asset_url}}') format('woff2'),
url('{{'khmermn-webfont.woff' | assett_url}}') format('woff');
font-weight: normal;
font-style: normal;

}

 

I've put those assets in the assets folder.  

 

The font displays correctly on some pages (e.g. home), but not on others (e.g. product pages or the cart).  How do I get this font to show in all sections?

 

Any help much appreciated.

 

Thanks,

Sarah

0 Likes

Hello 

Want to modify or custom changes on store hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Content Writer | Digital Marketing | SEO Expert | Site Optimization | Web Design | Web Development
0 Likes
Tourist
21 0 1

Thanks for your reply.  The url is www.ellennyswim.com (it's still in password protected mode though as we haven't launched the site yet...)

0 Likes
Highlighted

Hello 

Want to modify or custom changes on store hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Content Writer | Digital Marketing | SEO Expert | Site Optimization | Web Design | Web Development
0 Likes
Tourist
21 0 1

???

 

No problems if you don't know the solution Pallavi - I'm sure someone else has come across something similar before.

0 Likes

Success.

Shopify Partner
239 59 70

Hi @Sirrah,

 

I understand that you're using the Debut theme and you want to add a custom font. I may be able to to help you with this.

 

Make sure you've included your font CSS code at the top of the right file: assets/theme.scss.liquid

@font-face {
  font-family: 'khmer_mnregular';
  font-style: normal;
  font-weight: normal;
  src: url('{{'khmermn-webfont.woff2' | asset_url}}') format('woff2'),
url('{{'khmermn-webfont.woff' | assett_url}}') format('woff');
  unicode-range: U+1780-17FF, U+200C, U+25CC;
}

 

Also, are you changing the header font or the body font?


To target the header, find this line of code (for me it's around line #475):

$font-stack-header: {{ header_font.family }}, {{ header_font.fallback_families }};

Replace that code, with this code:

$font-stack-header: "khmer_mnregular", {{ header_font.fallback_families }};

Click Save.


To target the body, find this line of code (for me it's around line #480):

$font-stack-body: {{ base_font.family }}, {{ base_font.fallback_families }};

Replace that code, with this code:

$font-stack-header: "khmer_mnregular", {{ header_font.fallback_families }};

Click Save.


Let me know if this solves your problem or if you need any further assistance.

 

Cheers!

Brian | Shopify Partner | Ecommerce Consultant
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution  
 - Need further assistance? Visit www.BrianAtWork.com

0 Likes
Tourist
21 0 1

Hi @BrianAtWork 

 

Thank you so much for your input.  I think that has done the trick!

 

I really appreciate your help.

 

Sarah

1 Like