Custom font for the side menu?

Jul 27, 2018

I am using custom web fonts in a course but they dont seem to apply to the side menu?

Instead they are set to be Lato, according to this CSS:


.brand--ui, .brand--ui * {
font-family: Lato !important;
}

Is this correct and if it is, is there any way I can change it (other than editing the CSS of course)?

thanks.

 

28 Replies
Martika Cox

Hi Lucie,

I’m sorry that you’re having a problem here. If you’re trying to use characters that are not in the default font the browser will choose the next available font. That looks to be what is happening here.

We have a feature request logged to allow for special characters in other languages within the default font, but it’s not something available right now.

I’ve included your question in the feedback to our product team. If I can help with anything else, please let me know.

Marta Burda

Hi, I have a similar issue with special characters in the sidebar menu in Polish.

What is weird - in the preview everything is ok, when published - characters are replaced.

When can we expect the issue to be fixed?

Can you please replace sidebar menu font with something more universal?

Kind regards,

Marta

Talentator e-learning

Hello again,

We have found a temporary solution, until we wait for an official fix. 

In any RISE export, inside "(\scormcontent)\lib\main.bundle.js" you have to replace all "!important" entries in the JS code with a blank entry. In this way, all the "!important" tags in the generated CSS code will no longer be there and there shouldn't be any hierarchy left, other than what is written by default in index.html and perhaps in .css files, but with this you can now freely adjust the hierarchy and make changes at will in all of these files, which you couldn't before as the hierarchy set by the JavaScript would always be higher.

Here's an example with Notepad++ in making these changes:

RISE_css_hierarchy_fix

Any more advanced text/code editor can do this, example with Visual Studio Code:

So far we haven't found any problems with this, but everyone who also had an issue here, we invite all to test this with their RISE courses and give further feedback here.

Nikos Markatopoulos
Talentator e-learning

Hello again,

We have found a temporary solution, until we wait for an official fix. 

In any RISE export, inside "(\scormcontent)\lib\main.bundle.js" you have to replace all "!important" entries in the JS code with a blank entry. In this way, all the "!important" tags in the generated CSS code will no longer be there and there shouldn't be any hierarchy left, other than what is written by default in index.html and perhaps in .css files, but with this you can now freely adjust the hierarchy and make changes at will in all of these files, which you couldn't before as the hierarchy set by the JavaScript would always be higher.

Here's an example with Notepad++ in making these changes:

RISE_css_hierarchy_fix

Any more advanced text/code editor can do this, example with Visual Studio Code:

So far we haven't found any problems with this, but everyone who also had an issue here, we invite all to test this with their RISE courses and give further feedback here.

Thank you! Really helpful workaround! It works fine for me!