2

I am currently trying to roll my own CSS style switcher for my basic intranet.

It's not hugely important, but I know a couple of employees have slightly poor eyesight and thought a high contrast style may be of some use.

Here is my ideal set up, and the way I have tried to implement so far.

Basically I already have a mysql database that house user log on details, and other minor preferences regarding the site. I would like to have an extra column for the style preference, and have a simple page in the user area where the user can preview, select and apply the style.

It would obviously be good if when the user selects the style initially, it applies it to the page so that it can be seen in action, and then can be confirmed if it is what the user chooses.

What I have attempted so far:

Basically, when the user logged on, it created a session variable which contains the value of the "style" column for that user. I went with numbers for the test, with a choice of 3 styles, 1, 2 and 3. Then in the head section of the page, for the href of the stylesheet, I added some PHP that evaluated the session variable and echoed a stylesheet based on what was set.

That worked fine, the stylesheet was different depending on what was in the mysql table for the style column. On the user preferences page is where I fell apart a bit. I created a small form with 3 radio select buttons, one for each style. The only way I could see to go from here, was for the form to post to a PHP file that updates the table based on selection.

The main problem I have doing it in this manner is that the user has to log out and back in for the changes to take effect. I would like a setup where the change happens on the spot or on a refresh.

I could go with cookies, but would rather avoid if possible. Don;t know if anyone has any suggestions to help me along or if there are any pre written scripts that could accomplish this?

Many thanks

Eds

5
  • Do users change workstations quite a bit? If not, you could do it with a cookie and a very small javascript that would reduce your php/mysql overhead. Is there a reason you "would rather avoid" cookies? Commented Nov 14, 2011 at 14:53
  • 1
    Don't forget you can also include all 3 styles at once, using the alternate style sheet syntax: <link rel="alternate stylesheet" title="Large Print" src="bigtext.css" />. On FF< that makes "Large Print" be an option in the View->Page Style menu. Commented Nov 14, 2011 at 14:56
  • @farray Im just not good with cookies as I have only ever used them once since building this intranet, and stuggled a surprising amount with them. Commented Nov 14, 2011 at 15:07
  • @Marc B Is it possible to have two alternates, or have some way using html or php to flick between the default and alternate? many thanks Commented Nov 14, 2011 at 15:08
  • @eds: you can have as many alternates as you want, as long as they have different titles. And here's one way of switching between them on the fly: alistapart.com/articles/alternate Commented Nov 14, 2011 at 15:09

4 Answers 4

2

Sounds like you have to set the Session Variable to the new value too. So update your database and your session variable at the same place.

Sign up to request clarification or add additional context in comments.

1 Comment

perfect, this should do the trick I think! thanks very much!!
1

to write a script that do this i would use JQuery and do a post or get to the script updating the user-pref. and then apply the css returned by the post or get accordingly.

someting like:

$.get('coolCss.php','cssid=3',function(data){
    $('#myCssTag').empty();
    $('#myCssTag').append(data);
});

hope this can solve it.

but i would consider using diffrent css-files and change the the selected file.

Comments

0

Unless you are careful, serving up the CSS from a database breaks the ability for browsers to cache the CSS file. This will slow down every page load.

What you should do is serve up the default stylesheet as a file, then, if needed, serve up the custom one from from the database, based on the user's session variable. The custom one should simply overwrite existing styles.

1 Comment

thanks, at present all three styles are files, and I will not be loading them from the database itself, just using it to define the location of the css.
0

I don't understand why the user has to log out and back in in order for the changes to take effect, or what they have to log in and out of. This sounds like an issue with your application.

Maybe you mean this?

Both IE and Firefox will cache the CSS that is loaded from a file. As long as the CSS filename is the same, the user won't see the updated style until they manually refresh the page. To work around this, if you are loading the CSS from a file, then each style should have its own, unique filename.

1 Comment

I was being a bit dense, because I use session variables for user login, I was using a logout and login to reset the variables and forgot that I could just set it using php when selecting a style.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.