Custom Font not displayed in Cornerstone or Frontend

Hi

I wanted to add a custom font on a site I am building. I have done it before on another site and it worked like you described in the docs. This time, I can’t get the font to be shown in Cornerstone and neither on the frontend. I tried it with .woff and .woff2 format and also .ttf, but there is no difference. Cornerstone does not seem to be able to show my font. What mistakes am I making?

Thank you for your support!
Regards, Laura

Hey Laura,

Thanks for writing in! It could be that you have a Mixed Content Issue. The font may have been uploaded using http. To better investigate the issue further, please provide us a URL of the page or at least the WP Access so that we can check your settings. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

image

Best Regards.

Hi, thank you very much for your answer! I added the information via Secure Note. Best regards, Laura

Hello @quasikristall,

It seems that the URLs are not fully replaced while moving the site from staging to production and that causes the Mixed Content issue [ HTTP and HTTPS ] blocking to the load Font files. I would suggest you replace the URL properly and check this again, there are many URL replacement Plugins available in WordPress that help you to replace the URL.
This article will be helpful in this:https://www.wpbeginner.com/plugins/how-to-update-urls-when-moving-your-wordpress-site/

Also, remember that the exact URL should be mentioned in Setting > General, WordPress Address, and Site URL, including the protocol i.e. HTTP/HTTPS.

Hope this helps.
Thanks

Hi, thank you so much for the suggestion! Sadly this wasn’t the fix of my problem. I did change all of the URLs to HTTPS and uploaded the font file again, but it doesn’t work. I don’t see the error messages in the console either. I tried .woff and .woff2. Could you take another look?
Thank you!

Hey Laura,

I’m not sure what your previous custom font setup is that made the Font Family to custom:undefined.

image

I just changed the Font Family to what seems a correct custom font setup, “Euclid”, and it works.

image

image

Hi, thank you so much! Strangely I never got the custom:undefined, it only showed the word “Euclid” in a serif font.

I’m happy that it works now.

Glad to hear that, Laura.

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