Custom font doesn't work on mobile version

Site URL: https://www.mindbodybowl.com.au

Hi,

I'm having the same problem. My custom 'luster' font works great on desktop version but doesn't show up on my mobile (iphone, safari).  I've tried various codes I've found on here but nothing seems to work. Here's my current code:

@font-face {
    font-family: 'Luster';
       src: url('FONT URLhttps://static1.squarespace.com/static/6029f3929f10401f2e5e1d4b/t/604991971c6fbd0b19df23aa/1615434138584/luster-brush.otf')format('opentype');
  }

.mobile-bar-wrapper *, h1 {
  font-family: 'Luster' !important;
    font-size: 86px
}

password is hranson88

thanks in advance for any help!

Hi, I have a similar problem. In my case I uploaded the font on a code block (HTML) because I just want that font to appear on the Home page. However, it does not load on the mobile version. 

Any idea on how to fix it?

Site URL: https://www.beaibeas.com/

Thank you very much!

On 3/16/2021 at 5:58 AM, Hranson88 said:

Site URL: https://www.mindbodybowl.com.au

Hi,

I'm having the same problem. My custom 'luster' font works great on desktop version but doesn't show up on my mobile (iphone, safari).  I've tried various codes I've found on here but nothing seems to work. Here's my current code:

@font-face {
    font-family: 'Luster';
       src: url('FONT URLhttps://static1.squarespace.com/static/6029f3929f10401f2e5e1d4b/t/604991971c6fbd0b19df23aa/1615434138584/luster-brush.otf')format('opentype');
  }

.mobile-bar-wrapper *, h1 {
  font-family: 'Luster' !important;
    font-size: 86px
}

password is hranson88

thanks in advance for any help!

This code is incorrect

@font-face {
    font-family: 'Luster';
    src: url('FONT URLhttps://static1.squarespace.com/static/6029f3929f10401f2e5e1d4b/t/604991971c6fbd0b19df23aa/1615434138584/luster-brush.otf') format('opentype')
}

Change it to

@font-face {
    font-family: 'Luster';
    src: url('https://static1.squarespace.com/static/6029f3929f10401f2e5e1d4b/t/604991971c6fbd0b19df23aa/1615434138584/luster-brush.otf');
}

On 3/22/2021 at 12:06 AM, beaibeas said:

Hi, I have a similar problem. In my case I uploaded the font on a code block (HTML) because I just want that font to appear on the Home page. However, it does not load on the mobile version. 

Any idea on how to fix it?

Site URL: https://www.beaibeas.com/

Thank you very much!

Which element do you use custom font?

thanks so much, that worked!