Skip to main content

I’m running into a spot of bother with some custom CSS. All I want to do is replace the default Open Sans with a different web font. The CSS itself is fine (it’s managing to replace Open Sans with my fallback font, Arial). However, where the preferred web font is concerned, I’m running into issues with CORS:

"Access to font at 'https://example.com/font.woff2' from origin 'https://example.docebosaas.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource."

I’ve seen posts here illustrating that you can host images in Docebo (tried uploading the woff2 file as an image; it was unsurprisingly rejected as invalid). I also tried uploading it as a file (as part of a course’s training materials); that seemed to be working, but then it said: 

File does not exist

So, I’m wondering if anyone knows of a way to host web fonts in Docebo. If not, I guess I need to find another place to host it, where I can control the CORS policy, or simply ask the folks in charge of the marketing website (where the font is currently hosted*) to add some new Access-Control-Allow-Origin headers…

Thanks in advance!

* The fact that our company already hosts the font on its own servers is why I’m not really looking to discuss licencing questions in this thread, in case anyone was going to bring them up.

A-ha, I have since been reminded that you can embed the entire font file in the CSS itself if you Base64-encode it first. I used this tool, and it got the job done for me.


Reply