Quizport changing the Font

Quizport changing the Font

by Deborah Delin -
Number of replies: 7

Hi Gordon,

Quizport is changing the font in some of my quizzes.

Please see:

The quizzes are set to Century Gothic output, and in the site files you can see that that is how they appear. But Quizport changes the font, I think to Calibri. This is particularly undesirable because the quizzes are teaching the letters and the font Quizport changes them to makes a curly "a" whereas a simple "a" has been taught.

This is strange because it hasn't happened in my other Quizports.

Thanks in advance for your help.

Deborah

Average of ratings: -
In reply to Deborah Delin

Re: Quizport changing the Font

by Gordon Bateson -
Picture of Core developers Picture of Peer reviewers Picture of Plugin developers
Hi Deborah,
the font that affects that element in the page is defined in line 12 of the styles.php in your theme:
  • body, table, td, th, li {
    color:#333333;
    font-family:"Lucida Grande",Helvetica,Arial,sans-serif;
    font-size:0.95em;
    line-height:1.4;
    }
Actually the color and font-size are overridden elsewhere, but the font-family and line-height from this CSS are active.

So to force the font to be something else, you could change these values in your theme files, or override the font setting with some CSS in your quiz file. If you need help with that, I'd be happy to assist further.

regards
Gordon
Average of ratings: -
In reply to Gordon Bateson

Re: Quizport changing the Font

by Deborah Delin -
Hi Gordon,

Thanks for explaining.

What I find very puzzling is that this only happens in certain quizzes. In Jquiz and Jmemori quizzes I am getting the font I don't want, but in Jintro, Jmix and ordinary JMatch quizzes the font is fine, i.e. the Century Gothic I set in the Hotpot interface.

I tried altering the code in the HP6_cs file, to

body{
font-family: "Century Gothic"; [strFontFace];

and it had no effect. So if I am going to have to go that route then I would indeed appreciate your help. I don't have access to the theme files. But to have to re-output all of those quizzes with a new template is going to be very time consuming, especially as I have made all sorts of alterations to the htm. files using multiple replace. In fact, as I think about it, it would be a total nightmare as there are a few hundred quizzes.

The Hotpot module outputs the quiz fonts exactly as I want them. Is there no way to persuade Quizport to do so?

Thanks.

Deborah

Average of ratings: -
In reply to Gordon Bateson

Re: Quizport changing the Font

by Deborah Delin -
Me again.....I can use a multiple search and replace programme to output all the "a"s in Century Gothic. That works, but it seems awfully cumbersome and also means I have a mixture of fonts in the exercise.

By the way, when I look at the source for the problematic files, they say:

body{
 font-family: "Century Gothic",Geneva,Arial,sans-serif;

at the top. Shouldn't that override the theme CSS?

Thanks.

Deborah


Average of ratings: -
In reply to Deborah Delin

Re: Quizport changing the Font

by Gordon Bateson -
Picture of Core developers Picture of Peer reviewers Picture of Plugin developers

> Shouldn't that override the theme CSS?

It will override the "body" CSS selector from the Moodle theme, but it will not override the selector I mentioned in my earlier post to this thread, because that selector specifies a font for "li" elements.

Remember that although elements in an html document usually inherit their CSS styles from their parent elements, those styles are always overridden by more specific CSS selectors. Thus, an "li" selector will override a "body" selector.

If you were using the JMatch file, the ".jmt" file, as the "Source file" for the quiz, then we could add a "Configuration file" like the one attached to this message, which specifies extra CSS to be added to the header of the quiz when it is sent to the browser. In this case you would not need to modify all your source files.

However, since you are using html files as source files, you will need to add the extra CSS yourself. Something like the following should do what you want:

  • td, th, li {
    font-family: "Century Gothic", Geneva, Arial, sans-serif;
    }

Gordon

Average of ratings: -
In reply to Gordon Bateson

Re: Quizport changing the Font

by Deborah Delin -

Hi Gordon,

Thank you.  That works beautifully!  I just have one more small problem that I would be so grateful if you could help me with.

The

td, th, li {font-family: "Century Gothic", Geneva, Arial, sans-serif;}

turns the English text into Century Gothic, but it does the same for the Hebrew text, which is not what I want.  Is there something I could add to make the Hebrew font Arial?

I tried putting li after .RTLText but it didn't work.....

Thanks so much.

Deborah

Average of ratings: -
In reply to Deborah Delin

Re: Quizport changing the Font

by Deborah Delin -

Hi Gordon,

Please ignore my previous post.  That code actually works fine for the Hebrew and English.

Thanks for helping me to sort out the problem.


Deborah

Average of ratings: -
In reply to Deborah Delin

Re: Quizport changing the Font

by Gordon Bateson -
Picture of Core developers Picture of Peer reviewers Picture of Plugin developers

Great news. Thanks very much for the confirmation Deborah - approve

regards
Gordon

Average of ratings: -