Fonts wrong in different Browser / Mobile

[JaySchulz]

Hey there,

our fonts are not displayed correctly.
We have almost finished our site and now we are double checking on different devices and browser.
Now we spotted that the fonts we are using are not displayed propperly.
We have uploaded the “Neris” font through the fontuploader for the menu and normal text but it is changed to a different font on iPhone, iPad, Firefox,…

It works on my MacBook Pro with Chrome and Safari, It doesn’t work on my Girlfriends MacBook Pro with Safari.

Any Ideas?

thanks in advance

[JaySchulz]

and how can I change the Fontsize of the Tab description for the Product Inforamtion.
Currently it is running across the given space.
See attached screenshot.

thanks in advance

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Hi,

Q1

I notice in some of your paragraph text, you are overriding the custom font with a span tag that contains another font family. (See included screenshot.) – You will need to first remove those overrides.

Q2

Could you provide the URL to that page?

Thanks.

[JaySchulz]

This reply has been marked as private.

[David Martin – Support]

Hey,

Sorry I forgot that!

q1) See Screenshot.

q2) Use this CSS

div.product .woocommerce-tabs ul.tabs li a {
  font-size: 16px!important;
}

Thanks,
David.

Attachments:

You must be logged in to view attached files.

[JaySchulz]

Yes,

Q2 the fontsize is working now thanks.

Q1 I have changed the span. that was a copy / paste mistake.
But we also have the problem on the menu font or on the woocommerce generated pages (like the cart page) and also on the normal body font.

As said, it works fine on my machine but we have some troubles on different devices. for instance on an iPhone or on my girlfriends macBook pro.

thanks in advance

[David Martin – Support]

Hey,

Q2)

If it working just on your machine and not on others, it’s likely using your installed font, not the one you uploaded.

I see you only have uploaded Neris font in OTF, cab you upload the other formats?

Formats:

TTF – Works in most browsers except IE and iPhone.
EOT – IE only.
WOFF – Compressed, emerging standard.
SVG – iPhone/iPad.

Thanks.

[JaySchulz]

Hey David, makes sense.
thanks now it is almost working.

I have uploaded the fonts in

/wp-content/uploads/redux/custom-fonts/custom/

and now it almost works fine.

Now the menu and body font should be neris but he is always using an slightly italic if have the normal font selected. If I choose the Italic style it is even more italic. But I want a non italic style on the menu and the body font.

[David Martin – Support]

Hi,

That is really odd, everywhere is set to font-style: normal; which is correct.

Are the normal font styles and weights uploaded, or just the italic versions?

Thanks,
David.

[JaySchulz]

yes, I have also double checked if the fontstyle is set to normal.
That’s why I am wondering why it is displayed in a wrong way.

I have also uploaded both bold & light as normal and italic.

[David Martin – Support]

I am investigating this further.

If you remove the font-family: neris; reference the italic issue is removed. This has to be with the uploaded fonts I think but cannot confirm. Please hold.

Thanks.

[JaySchulz]

Thanks, will wait for an update.

two more questions:

Q1: I have uploaded also neris thin font files but i can not select them in the theme-font options. Is there any way to add these?

Q2: Can I change the font for the “h3” but just for the divider with heading?

thanks in advance

cheers
J

[David Martin – Support]

Hey,

Can you upload the fonts you are using into a zip file for us to test?

q1) I will need to get a second opinion on this from the team as I am not 100% sure currently.

q2) Sure, the class for that is h3.divider-heading

so

h3.divider-heading { font-family: your-family, sans-serif; }

[JaySchulz]

Hey there,

sorry for my late response.

Q2 works fine, thanks!

Q1:

here is a link NERIS WEBFONT you just need to go to webfont kit and there you can download the original kit.

But i have also attached a .zip of the files which are in my the redux custom folder.

cheers

and thanks

Attachments:

You must be logged in to view attached files.

[JaySchulz]

This reply has been marked as private.