Fonts and weights discrepancy

Support
#1

Hi X! Just putting the finishing touches at https://cliniquemedigo.ca/ but I’m having issues, especially with the headers not displaying the correct font and weight on mobile and tablet -

I’ve loaded up this code at the the top of my CSS

@import url(‘https://fonts.googleapis.com/css?family=Montserrat|Open+Sans’);

But to no effect. Can you please help?

#2

Hi,

You need to add the font weights that you need.

Try adding this in Appearance > Customize > Additional CSS

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

Hope that helps.

#3

Hi Paul, unfortunately that didnt seem to work - can you provide additonal suggestions? Also I’m trying to include Open Sans as well. Thank you!

#4

Hi There,

Thanks for writing in!

I can see the font family and wait is loading fine in mobile as it in a desktop.

I am not sure what exactly you want to be looking for mobile device please share a mockup or screenshot so that we can have a look.

Thanks

#5

Hi Basanta - check out the attached!

#6

Hi again,

I checked on different devices and the fonts are loading fine on my end too

Can you please clear your device cache and see if this resolves the issue.

Let us know how this goes!

#7

Hi Nabeel - tried clearing caches and the issue really is with mobile devices - the headlines really are not showing bolded on mobile but they are on desktop (which is how I’d like them to be)… Thanks for your help!

#8

Hi There,

Please add the @import code that Paul’s provided on Appearance > Customize > Additional CSS, not on X > Theme Options > CSS.

Then clear your phone’s browser’s cache.

Cheers!

#9

Hi Friech - tried that - no effect :frowning:

#10

Hi There,

In that case, please provide us login credentials in a secure note so we can take a closer look. And let us know what specific device you’re using to preview the page so we can try to replicate it.

Cheers!

#11

Ok I’ve attached the note. Thanks for your help!

#12

Hi,

I have tested on multiple browsers in Desktop and the font is not bold on my end.

If you would like it to be bold, you can add the code below in your Headline Element Style Field

font-weight:bold;

Hope that helps.

#13

Hi Paul - thanks for this. Turns out it was a weird conflict between the old and new font managers :slight_smile:

#14

Glad to hear that the problem is resolved now. :slight_smile:

#15

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.