When a text box contains a variable, the font in the text box is changed to a sans serif font. This only occurs in HTML5 output. However, I also notice that in both Flash output and Preview mode, the text box with the variable in it, while still the same font, is darker in color than the text box without the variable. Both text boxes in the attached example are set to the same (Courier New 12). Is there some way I can edit the final HTML5 output so I can set the font correctly in the text boxes that have variables until a fix is made? Thank you.
Yes, thank you Tim. I should have read other threads on this topic first; apparently it is a known problem in the HTML5 output, which appears to be the ugly stepchild in Storyline. Everything is moving to HTML5 and away from Flash (which I think is unfortunate, but nonetheless a reality), so I hope more efforts are put into HTML5 output since there are other problems with it besides this one. Until they can fix this problem, I sure hope they can give us some ideas on how to edit the published HTML5 output because having different fonts in the middle of your output looks unprofessional at least, and causes the output not to fit at worst.
Hi Ashley. Thanks. The problem is actually more than that because whenever a variable is referenced in a text box, all the text in that text box is formatted with the default font. Is there an expectation that this will be resolved in the future? And, until then, is there information on how to edit the final HTML5 output so we can format the output manually?
Yes, it'll be all text within that variable reference box. I cannot assist with modifications to the published output as it's not something we support - but if anyone in the community has done so, hopefully they'll be able to chime in here.
I found a way around this. I use Javascript to assign the text I want to a variable that is placed in the text box. I include a CSS Style tag (<p style='font-family:courier> my text goes here </p>) in the variable and that seems to work (I get the Courier font instead of the default). However, it seems to ignore any font-size statements but this is, at least, progress.
Thanks Greg for sharing that here - I'm not well versed in Javascript to offer additional thoughts on how to deal with the font sizing, but hopefully someone else will be able to weigh in here.
7 Replies
Yes this happens with non standard fonts, I run into this issue regularly. Variables written in custom fonts will default to something standard.
Yes, thank you Tim. I should have read other threads on this topic first; apparently it is a known problem in the HTML5 output, which appears to be the ugly stepchild in Storyline. Everything is moving to HTML5 and away from Flash (which I think is unfortunate, but nonetheless a reality), so I hope more efforts are put into HTML5 output since there are other problems with it besides this one. Until they can fix this problem, I sure hope they can give us some ideas on how to edit the published HTML5 output because having different fonts in the middle of your output looks unprofessional at least, and causes the output not to fit at worst.
Hi Greg,
You can find out more about the issue with custom fonts/variable references here and how that'll work in HTML5.
Hi Ashley. Thanks. The problem is actually more than that because whenever a variable is referenced in a text box, all the text in that text box is formatted with the default font. Is there an expectation that this will be resolved in the future? And, until then, is there information on how to edit the final HTML5 output so we can format the output manually?
Hi Gre,
Yes, it'll be all text within that variable reference box. I cannot assist with modifications to the published output as it's not something we support - but if anyone in the community has done so, hopefully they'll be able to chime in here.
Hi Ashley:
I found a way around this. I use Javascript to assign the text I want to a variable that is placed in the text box. I include a CSS Style tag (<p style='font-family:courier> my text goes here </p>) in the variable and that seems to work (I get the Courier font instead of the default). However, it seems to ignore any font-size statements but this is, at least, progress.
Thanks Greg for sharing that here - I'm not well versed in Javascript to offer additional thoughts on how to deal with the font sizing, but hopefully someone else will be able to weigh in here.
This discussion is closed. You can start a new discussion or contact Articulate Support.