How to add Google Fonts to the Photics "Book" Template?

Using JavaScript with Hype
7

It's not the buttons that are broken. It's the JavaScript triggered by pressing the buttons. Here are the related lines in the "text" JavaScript file...

var s = document.styleSheets[1];
s.deleteRule(0)
s.insertRule(".texty { font-size: " + zoom + "px !important; line-height: 150% !important; }", 0);

Basically, "texty" is a style class in the Head HTML. Every time a button is pressed, the "texty" class is deleted. (That's the s.deleteRule part. Zero is the first one in the array.) Then, an updated "texty" class is added (insertRule) to the style sheets.

When a Google Font is added, Hype adds more information to the Head HTML, which shifts the order of the styles. So, changing...

var s = document.styleSheets[1];

...to...

var s = document.styleSheets[2];

...should solve the problem.

1 Like