Page 1 of 1
Dynamic CSS Tip
Posted: Sun Oct 12, 2003 10:48 am
by Gen-ik
If you don't already know this you might find it useful at some point.
You can use .php files in place of .css files in your webpage.
Code: Select all
<head>
<link href="myStyle.php" type="text/css" rel="stylesheet">
</head>
If you are brave enough you can then allow members of your site to customise the style. I normally use a SESSION array for this.
Code: Select all
$_SESSIONї"style"]ї"linkColor"] = "ff0000";
$_SESSIONї"style"]ї"linkSize"] = "12px";
... and so on.
By doing that you can get your stylesheet to render depending on the _SESSION variables. Here's an example myStyle.php file.....
Code: Select all
body { background-color:#ffffff; }
a:link { color:#<? echo $_SESSIONї"style"]ї"linkColor"] ?> ; font-size:<? echo $_SESSIONї"style"]ї"linkSize"] ?> ; }
Might come in useful for the more
creative PHP'ers out there
You can also do the same with with .js files....
Code: Select all
<head>
<script language="JavaScript" src="myScript.php"></script>
</head>
Posted: Sun Oct 12, 2003 12:59 pm
by nigma
If you use PHP do you have to refresh the page? I am thinking yes, but not 100% sure of my guesstimate.
Posted: Sun Oct 12, 2003 1:17 pm
by m3rajk
yes. it has to be called with it, you cannot set it dynamically (unless there's a javascript for it that i don't know)
part of my site includes a blog system. css is adjustable by the user in the entry page. kept as part of the entry data in the db. this ai a page begining function i have for calling a blog entry
Code: Select all
function bgnblogpg($title, $css){ # called on blog display pages
$ims=cookies('update'); # update cookies and get ims
head(); # headers to stop caching
echo <<<END
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>FindYourDesire.com -- $title</title>
<meta name="Author" content="Pages coded by Josh Perlmutter for Desired Creations LLC">
<meta name="Author" content="Graphics created by ? for Desired Creations LLC">
<meta name="Author" content="Smileys created by ? for Desired Creations LLC">
<style type="text/css">
@import url(textStyle.css);
$css
</style>
</head>
<body>
END;
if(count($ims)){ # if there's any ims
dispims($ims); # display them
}
}
first i import the stylesheet i use using a different style of importing (it works in mozilla. it's a standard that netscape 4.x came out before it became standard, and was never added to 4.x but has been in netscape since 6.0 mozilla for a while and ie since 5.0. i beleive opera has had it since 7 and galeon also uses it, although i haven't tested in galeon or opera) then i use the css they entered.
note: the style of importing i use must have a fully validated html starting at http:// otherwise it looks in the folder that the script calling it is in, i'm not sure it will allow sub folders. one of the things i read when loking at it was that it "works only in the same folder and the page calling it or with full urls") genick's way will definitely handle something like "css/css.for.some.page.css" and possibly "
www.somedomain.com/some/path/to/the/desired.css"
Posted: Sun Oct 12, 2003 2:49 pm
by Gen-ik
nigma wrote:If you use PHP do you have to refresh the page? I am thinking yes, but not 100% sure of my guesstimate.
It works like a normal stylesheet except for the fact that some parts of it can be built from $vars. I don't really understand your question.
If you mean can you still change <element> styles using JavaScript then yes...... element.style.color="#ff0000"............ but even if you do this the style will revert to whatever is in the stylesheet when the page is refreshed if you use standard .css files or .php files for your stylesheet.
Posted: Sun Oct 12, 2003 3:51 pm
by nigma
I wanted to know if you had to refresh the page to see a style change. Like you couldn't select "red" as the background color and then use PHP to change the background color to "red" without first refreshing the page.
Posted: Sun Oct 12, 2003 4:51 pm
by Gen-ik
There are ways of changing the stylesheet without reloading the page but it can only be done with the Microsoft DOM object..... IE5.5+ as far as I know. Apart from that the page, like you guestimated, will need to be refreshed.
Although you could write a JS function to change the styles you want, save the changes in an JS array, and then when your happy with the changes you could use a JS link to build the URL and send the changes to PHP using window.location="style.php?blablabl" to 'store' or 'save' the style changes.
Posted: Fri Oct 24, 2003 11:31 am
by m3mn0n
this doesnt work for me in Mozilla. =\ It seems like it doesnt recognize .php css style sheets.
I changed my styles back to .css and it works like it would in IE...
Posted: Fri Oct 24, 2003 12:47 pm
by Gen-ik
Sami wrote:this doesnt work for me in Mozilla. =\ It seems like it doesnt recognize .php css style sheets.
I changed my styles back to .css and it works like it would in IE...
Well it works fine with IE and NS, and let's face it, they are the only browsers worth worrying about considering that about 99% of internet users use one or the other....... other browser users will just have to 'get with it' or miss out..... simple.
Posted: Fri Oct 24, 2003 2:47 pm
by d3ad1ysp0rk
Gen-ik wrote:Sami wrote:this doesnt work for me in Mozilla. =\ It seems like it doesnt recognize .php css style sheets.
I changed my styles back to .css and it works like it would in IE...
Well it works fine with IE and NS, and let's face it, they are the only browsers worth worrying about considering that about 99% of internet users use one or the other....... other browser users will just have to 'get with it' or miss out..... simple.
Basically my thinking.. except I don't even code for netscape users (cuz im too lazy

).. but i've never had issues with cross-browser problems
Posted: Fri Oct 24, 2003 6:06 pm
by JAM
Sami wrote:this doesnt work for me in Mozilla. =\ It seems like it doesnt recognize .php css style sheets.
I changed my styles back to .css and it works like it would in IE...
Can you explain what you did when you tried this, as I'm using this daily, without problems. And I can also add that Mozilla has better css support than most other browsers so...
Posted: Fri Oct 24, 2003 6:52 pm
by m3mn0n
I had no php code in the .php files (not yet anyway) but they were standard, well formed css files and what made them work was me renaming all the files from .php to .css.
I was using a new Mozilla build too. =\
Posted: Fri Oct 24, 2003 7:03 pm
by JAM
Aha, you kinda 'included' (link rel-style) a css file using the .php extension... Now I understood it.
I actually never tried that myself, but I never mess with file extensions due to previously bad experience...
But basicly, if you <link rel... a css file, then;
Code: Select all
<?php
session_start(); // demonstrative only
$_SESSION['td']['even'] = "ccc";// demonstrative only
$_SESSION['td']['odd'] = "dde"; // demonstrative only
echo '
<style>
td.even { background: #' . $_SESSION['td']['even'] . '; }
td.odd { background: #' . $_SESSION['td']['odd'] . '; }
</style>';
/*
<style>
td.even { background: #ccc; }
td.odd { background: #dde; }
</style>
*/
?>
...those td.even/odd will override the ones in the linked css file. Meaning, that if the user has not yet selected any preferences for those, the old default values will be in use.