Changing font sizes on the fly

Worker Joined: Dec 08, 2005 Posts: 107

Hi All!

Many moons ago, users on my site said the text was too small, even if they set their browser to the highest font size. My solution was to create multiple themes with different font sizes that the user could choose. I just recently installed RN 2.10 and it looks like there have been some changes that mean I will have to redo all of the new (larger font) themes I created.

For a while I have been thinking about increasing the fonts by loading the style.css file in header.php, then parsing it to increase the font sizes and inserting the style sheet directly into the page. One issue here is the extra time needed to load the style.css, figure out where font sizes are defined and increase them accordingly.

Figuring the correct regular expressions and code is pretty straight forward, but the question is whether it is worth the work. This has an advantage of "automatically" working for each new theme (assuming the font sizes are defined more or less in the same way).

Another idea was to simply copy the style.css and make the necessary changes for each size and link it in as ${SIZE}style.css (i.e. xxlargestyle.css). This would be a very simply change to header.php, but would mean having to make a copy of style.css for each font size. It would also mean I would have discrete increments (i.e. +2 each time). Whereas in the first case, I could simply add 1 each time, but there is a problem should someone decided to keep increasing the font size (i.e. 736px).

I thought about having something at the top of the center column, maybe a block, maybe on the YourAccount page that said "Font Size: - / +" or whatever. This would then store an appropriate value in a cookie, which is read by each page and then appropriate style sheet can be loaded. I am not too fond about the idea of storing the font size in the database and it is not too much work to have the user

Any feedback would be appreciated.

regards,

jimmo

Posted: Wed Jul 25, 2007 10:09 am

It seems like you should just provide a reasonable font size and then let clients adjust what they are seeing with their browser. But it sounds like you tried that and that isn't good enough.

Simply copying a theme into a new folder with a different name, and then tweaking the new style.css file to increase font sizes would seem to be pretty simple. Then the user could pick that new theme.

You could also add a javascript block that would use DHTML to increase the font size. But the user would have to click a button on every page load to adjust the size.

Failing all that I would consider either a cookie or new column in the users table for font size and dynamically pick a style.css file as you outlined above. But a new theme seems simpler.

Posted: Wed Jul 25, 2007 12:34 pm

Hmmmmmmm.

I thought about DHTML, but didn't like the idea of adjusting on each page. However, storing the value in a cookie would allow me to set the appropriate font size. However, reloading the page to increase the font isn't all that bad.

A whole theme does seem simpler as there is no extra code. I would have to copy the style.css anyway, so what real difference does it make with copy just a single file or the whole directory?

In essence, that is what I am doing already. Maybe if I sym-linked the theme.php and copied the style.css things would be easier. That way, anything changed in one theme would automatically be done on the other. At the very least, I could sym-link them locally and copy the real file to the server.

Posted: Wed Jul 25, 2007 3:21 pm

What's wrong with having users do ctrl+ and/or ctrl-?

Posted: Wed Jul 25, 2007 4:39 pm

It doesn't work with every browser.

Posted: Wed Jul 25, 2007 7:13 pm

Well, if we were to actually make PHP-Nuke/RN fully CSS compliant (loose definition of the term in this context), one would use relative sizing in terms of "em"s with a starting definition of relative size such as "medium" and then it should resize with every browser's method for resizing the text.

This is what true "compliance" is all about. We're not there yet. Sad