Joomla! Discussion Forums

Where did you get the little feature available on the right top corner of this forum which allows a user to change the size of the text on the page?  That's a great feature.  I need it for the site I am developing.

It's a pretty standard thing.  If you look on http://alistapart.com for "style switcher" you'll find a few methods.

I personally can't usualy be bothered with it, considering that users have control over their own font sizes through their browsers (unless you, as the designer set all the font sizes in concrete).

as vavroom mentioned,.. click here directly: http://alistapart.com/topics/design/typography/

to see what suites your needs. happy learning and tinkering.

- g

Thank you both, Vavroom and Guilliam.  I really appreciate the link to that site.  The information is most helpful.

I know users have the ability to fairly easily adjust text sizes within their own browsers.  But I also think its awfully nice to provide a quick change with just a simple and oh-so-convenient click.  It's like an extra thoughtful service. 

Have you ever seen the three-click option available in the upper right corner of the California Department of Education's website (http://www.cde.ca.gov/ )?  I used to work there and know they undertook a major overhaul of their system to bring it into compliance over the last few years.  But I don't have access to their code and have been trying to find a way to emulate what they do.

hmmnn.. so you want a ready made script so you can just put it or call it within your template? am i correct?

Hi all,
We have been working on a stylesheet switcher module for joomla. The module needs to have template support to work, though and is not finished yet (but will be very soon). The project @ developer.joomla.org is called 'Stylesheet switcher'.
It'd be great to hear all of your ideas.

Cheers,
Matthijs

There's quite a number of solutions to use change stylesheets. 

Perhaps the most important thing to keep in mind, though, is that while very powerful, such a feature would need to have the layout done properly to start with.  For example, if you do your layout using tables, you've just seriously limited the ability of the CSS to change much.

I agree.

We use this solution only to select the text size of the site (globally). Some sites require this for accessibility reasons (although using javascript to select a stylesheet is not always accessible). If you want to change the whole look and feel of the site maybe the template selector module is more appropriate...

Matthijs.

PS. That's what you meant, right?

PPS. We wanted to make a module out of this so that a single 'supported' solution exists and not everyone has to do this themselves (common-of-the-shelf springs to mind). Everyone is free to do it their own way of course

you're right, using javascript is not particularly accessible, but you can use a noscript alternative with hard coded links to get your style selector.

The template selector module may not necessarily be more appropriate.

The idea, for me, would be to have one html/php page.  Using a style switcher, we can deliver different CSS, which then drive the presentation and layout of the content on the html/php page.  If you look at http://csszengarden.com , he uses the same html, but by switching the stylesheet gets hundreds of different layouts.

To use the template switcher module, you have to create/upload/install several different templates, potentially repeating many files without need. 

So, one index.php, many css files, give you many layouts/templates.

I really ought to use some of my spare time to put this in action on a toy site somewhere

mhhh..i dont know if i am wrong with my opinion that the need of having a scaleable layout needs to hav a css-file done with "em"...if you have done this, there is no real need to have a styleswitcher, because people can zoom in and zoom out with the normal browser zoom function! for example on our site http://www.joomla-barrierefrei.de users have the possibility to scale the site nearly free by using for example firefox browser and [STRG] and [-] or [STRG] and [+

Agreed, which is why I said:

vavroom, you're surprising me, this is what you said in another thread:



Wouldn't this point of view support a solution where the user can change the font size directly on the site with a styleswitcher or whatever rather than letting him customize it through his browser/software.

Not really sure whether this would be working in reallity since I lack the php knowledge, but my solution would be a php form script that writes a cookie which holds then the desired font-size (two submit buttons, one that increases another that decreases the size, a php function that checks and reads the cookie before adding/subtracting from it, eg we start off with 1em, and we always add/subtract .2em ) and a php script that reads this cookie and depending on what is stored there adjusts the stylesheet.

I'm sure a php expert can expand this idea.

@c2uk, I like surprising people   Seriously, I didn't realise I was being read so closely and attentively!  LOL

You are correct, I still don't think that a lot of users that could benefit from bigger font sizes are aware of how "easy" it is through their browsers.  This doesn't mean I can't prefer letting users do their own thing through the browsers rather than add style switcher.

Note, I'm not against styleswitchers, if properly implemented.  For example, I make no secret of the fact I think the way it's implemented on the forum is not as good as it could be (uses javascript with no noscript alternative, and if you have vision issues, it's dang hard to read).

Perhaps the best way to implement them is to use javascript, give hard links in a noscript, and make sure they are visible.

I kinda agree with vavroom. Switching stylesheet and font size through the browser is a much better solution. If only the browsers advertised these features more so that users would know about them.
Furthermore, sometimes paying clients just _demand_ such a feature. You can't say no on ideological terms then.

Ooops!  Sorry to not get back to you sooner, Guilliam.  I have been neglecting to check continued progress on this thread.



Yes, that is what I would like to be able to offer my readers.

Bump.

I agree its better to switch within the browser, but most people in my industry have very little knowledge of their browser funcitons. Most of them are old and want bigger text. 

Any more thoughts on possible solutions?  How does this site do it?
~E

There are several methods to do it.  This is not so much a joomla "issue", just need to implement an existing solution into joomla.  Look at alistapart.com they have a few style switchers/font switchers.  You'll probably have to use a bit of javascript, so make sure to provide a noscript alternative. 

The csszengarden is a very nice exemple that has been online for a while to show all the power of CSS design. I encourage all users who believe that tables are the best way to go to have a look at this site. Some designs are really artworks.
But having tested this type of desing myself, I must admit that it's sometimes really frustrating and time-consuming. One of the main issues is due to the fact that all browser don't interpret HTML code in a web standards compliant way. That's why the same code doesn't produce the same results in say IE or FF. You have to use brower specific hacks to do the job. And this will introduce backward compatibility issues as soon as the browser will modify the way they display HTML code to be WSC (even IE7 will address some major WS issues).
I just wonder how it would be possible for CMS software to handle these problems...
If Joomla could output nice DIVs instead of uggly tables whenever it's easy to do, I believe that we will all be a bit closer to web-design-heaven (i.e. mean list-driven menus, column-positioning).
This was my frist 100% CSS driven web site: http://fr.lakewood.de.

Kinne

css-driven and valid webdesign with joomla can be done!

for example please have a look at: www,joomla-barrierefrei.de

Well, actually, the only major offender in terms of not respecting web standards is IE.  Yeah, Netscape and a few others are causing problems, but they are relatively unimportant.

IE cracks me up.  They were talking about people stopping to use hacks, because they will cause problems with IE7...  But the only reason those hacks are used in the first place is because of the way IE was coded in the first place!  Edjits!



Yes, we're heading that way.  But as I point out on a regular basis, you can already strip many of the tables.  For instance, menus can be displayed using the "Flat list" option through the module admin area.  I think I'm going to make a post about some tricks to achieve this.

Oh that would be great. I already ordered the Pakt Publishing Mambo book (http://www.packtpub.com/mambo/book, lets hope it's worth the expenses) to get started, I'm still reading a lot, but I'm still at the bottom of the Mambo/Joomla learning curve. Every input is welcome. But I must say that there's a lot of information already available. It's only a matter of gathering the right info at the right time...

Kinne

Thanks! I'll post my contributions in this new topic.

Kinne