PHP CSS Query

Trav · 03-21-2007, 11:23 PM

Hey yo.

I'm working on customisation of mass-produced websites. I've nailed image/sound customisation but I have a problem with CSS customisation.

I'm looking for a User to complete a 'form' in php, which can be used to change CSS values. So in theory a user can change the background colour or text colour whenever they choose.

But I've been looking around and cant seem to find a solution, anybody got any ideas?
Or perhaps a better form of customisation.

Greatly appreciated.

Reynard Struan · 03-22-2007, 05:33 AM

Maybe I'm just dumb (and I'm not really putting a lot of thought into it because it's 5:30AM and I'm tired), but one way I could see to do it is re-code the CSS as inline instead of as an external file and have the form call a PHP script that uses an include statement to dump in the text of the CSS up until the part where you want to change a value, and then throw in an echo $_POST['variableName']; and then another include statement to dump the rest of the page in.

I'm sure there's a more elegant solution, but I'll leave that up to better programmers than I who aren't posting at 5:30AM

Kionae · 03-22-2007, 11:39 AM

I did this same thing for a site once...

You can actually include PHP inside of a CSS file. What I did was I created a form that stored the values for background color, link color, text color, etc. in a database table and then linked up the PHP inside the CSS file to the database and echoed them out in the proper places.

Try googling 'dynamic css'.

Trav · 03-22-2007, 04:34 PM

Thanks very much for the info. Now I know it IS possible so great. Do you still have the files Kionae or some link for demostration?

Kionae · 03-22-2007, 07:36 PM

Meh... I tried to find the files after I posted. I guess that project never got uploaded to my web site after I graduated and had to clear off of the university servers, because they're not on my portfolio site (though I could have sworn I had them there).

I'll see if I can hunt them down in my class project files when I get home, but I had computer issues a while back, and I'm not sure they made it onto my backup drive or not. I know I lost a few things from my last couple of semesters, and since it's not online like I thought it was, that may have been one of them.

Trav · 03-22-2007, 09:00 PM

OMG I made a partial attempt at this plus looking at references online this is some difficult ****!

<BRICK WALL> anybody care to give me some help?

Kionae · 03-23-2007, 12:39 AM

Quote:

Originally Posted by Travnia

OMG I made a partial attempt at this plus looking at references online this is some difficult ****!

<BRICK WALL> anybody care to give me some help?

It's easy. It really is. You may just be thinking about it too much and missing the obvious. I know I did when I first tried this.

Set up your html (or php... whatever) file, then for your CSS file, instead of using the .css extension, you use .php... so your call to your external style sheet would look like this:

<link rel="stylesheet" href="test.php" type="text/css" />

Now, in your stylesheet, before you start typing out your CSS rules, since you're using a file extension that doesn't match the content of the file, you have to tell the browser what to do with it. In order to do that, the first line of your stylesheet needs to be:

<?php Header ("Content-type: text/css");?>

You can now use whatever PHP you want in your stylesheet to pull in values.

As an example:

http://www.nlb-creations.com/mystuff/test.html

The HTML (test.html):

Code:

<html>
<head>

<link rel="stylesheet" href="test.php" type="text/css" />

</head>

<body>

The CSS for this page is stored in a php file.

</body>
</html>

And the CSS (test.php):

Code:

<?php Header ("Content-type: text/css");?>

<?php

echo "body {";
echo "background-color: #000000;";
echo "color: #ffffff;";
echo "}";

?>

I hope that's clear... I've been writing php all day at work, so I'm a little loopy. XD

Trav · 03-23-2007, 07:38 AM

Yeah thanks Kionae I had got that far, I got into difficulties with parameters.

Example:
1. A form asking for a colour hex format
2. #FF5A00 entered
3. Background of webpage changed to #FF5A00 colour

This is where I'm getting tripped up.

YopY · 03-23-2007, 09:24 AM

I dunno what you're getting at in that last post tbh :/.

Trav · 03-23-2007, 10:06 AM

How so?

1. A form asking for a colour in hex format
2. #FF5A00 string is entered
3. Background of webpage changed to #FF5A00 colour

This is what I want.

But this means I have to write this data to the CSS file, every website has told me to disguise the CSS file as a PHP file.

Kionae · 03-23-2007, 12:24 PM

Quote:

Originally Posted by Travnia

How so?

1. A form asking for a colour in hex format
2. #FF5A00 string is entered
3. Background of webpage changed to #FF5A00 colour

This is what I want.

But this means I have to write this data to the CSS file, every website has told me to disguise the CSS file as a PHP file.

Hmm... Maybe I'm not understanding the problem. Once you've set up your CSS as a PHP file, doing that should be as simple as taking the value from the form and writing it to a database table, then pulling it back out of the database in the stylesheet, the same way you'd do with any other information stored in a database.

For example, in the css file with the .php extension, do something like this:

Code:

<?php Header ("Content-type: text/css");?>

<?php
	$dbhost = 'localhost';
	$dbname = 'mydatabase';
	$dbuser = 'myusername';
	$dbpass = 'mypassword';

	mysql_connect($dbhost, $dbuser, $dbpass) or die(mysql_error());
	mysql_select_db($dbname) or die(mysql_error());

	$result = mysql_query("SELECT * FROM mytable") or die(mysql_error());  
	$row = mysql_fetch_array($result);
?>

body {
	background-color: <?php $row['bgcolor'] ?>
}

Code example plx? Maybe if I saw exactly how you're going about this I could point you toward a solution.

Alternatively, if you don't want to use a database, I think you can pass parameters straight to the CSS file... but you'd still have to find a way to store them somewhere, else they won't be persistant.

Code:

<link rel="stylesheet" href="mystyle.php?&myparam="<? php echo $_POST['myvalue']; ?>" type="text/css" />

Trav · 03-23-2007, 03:32 PM

I've decided to do something more concrete.

A User can submit their CSS file via a form. PHP reads the CSS file and prints the contents in a textarea. Once in the textarea changes can be made and then saved. Writing the results back.

I'll post an example of this real soon once I get home and stuff.

Kionae · 03-23-2007, 04:28 PM

Quote:

Originally Posted by Travnia

I've decided to do something more concrete.

A User can submit their CSS file via a form. PHP reads the CSS file and prints the contents in a textarea. Once in the textarea changes can be made and then saved. Writing the results back.

I'll post an example of this real soon once I get home and stuff.

That would work, sure, but it's not quite as userfriendly for css-n00bs. And you have the hassle of dealing with writing to files. Using a database simplifies things considerably.

Just for my own clarification, is this what you're trying to do?

http://www.nlb-creations.com/mystuff/form.php

Trav · 03-23-2007, 04:39 PM

Yes! Exactly that!

However I dont think I can use a database, as this has to be a distributed system.

I have a series of website with common functionality.

I've added these diagrams as a general illustration of my website. It is quite a complex system.

Kionae · 03-23-2007, 04:46 PM

I don't see why you couldn't use a database. Set it up with fields like:

client_id
bgcolor
color
a-link
a-visited
etc., etc. etc.

That way, each client has their own unique record in the database table containing their custom CSS values. When you need to render a page owned by a specific client, just query the table looking for the client's id number.

Trav · 03-23-2007, 04:47 PM

I think that's solved it. Thanks a lot Kionae you are a star.

Do you have the source code for that demo you posted?

Kionae · 03-23-2007, 04:57 PM

Sure. Had to change the .html file's extension to attach it.

Not my prettiest code, but meh... what do you want for 10 minutes of effort. XD

Also, I should point out... you don't need to use hex values with this setup (since you're not saving in a file, and don't have to worry about string position when echoing out the contents). Text color values (black, green, navajowhite, etc.) are all valid as well.

03-21-2007, 11:23 PM	#1 (permalink)
Trav kill em all Join Date: Mar 2007 Location: Scotland Age: 24 Posts: 351 Rep Power: 0	PHP CSS Query Hey yo. I'm working on customisation of mass-produced websites. I've nailed image/sound customisation but I have a problem with CSS customisation. I'm looking for a User to complete a 'form' in php, which can be used to change CSS values. So in theory a user can change the background colour or text colour whenever they choose. But I've been looking around and cant seem to find a solution, anybody got any ideas? Or perhaps a better form of customisation. Greatly appreciated.

03-22-2007, 05:33 AM	#2 (permalink)
Reynard Struan Member Join Date: Mar 2007 Location: Moncton, New Brunswick Age: 28 Posts: 75 Rep Power: 4	Maybe I'm just dumb (and I'm not really putting a lot of thought into it because it's 5:30AM and I'm tired), but one way I could see to do it is re-code the CSS as inline instead of as an external file and have the form call a PHP script that uses an include statement to dump in the text of the CSS up until the part where you want to change a value, and then throw in an echo $_POST['variableName']; and then another include statement to dump the rest of the page in. I'm sure there's a more elegant solution, but I'll leave that up to better programmers than I who aren't posting at 5:30AM __________________

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

03-22-2007, 04:34 PM	#4 (permalink)
Trav kill em all Join Date: Mar 2007 Location: Scotland Age: 24 Posts: 351 Rep Power: 0	Thanks very much for the info. Now I know it IS possible so great. Do you still have the files Kionae or some link for demostration?

03-22-2007, 09:00 PM	#6 (permalink)
Trav kill em all Join Date: Mar 2007 Location: Scotland Age: 24 Posts: 351 Rep Power: 0	OMG I made a partial attempt at this plus looking at references online this is some difficult ****! <BRICK WALL> anybody care to give me some help?

03-23-2007, 07:38 AM	#8 (permalink)
Trav kill em all Join Date: Mar 2007 Location: Scotland Age: 24 Posts: 351 Rep Power: 0	Yeah thanks Kionae I had got that far, I got into difficulties with parameters. Example: 1. A form asking for a colour hex format 2. #FF5A00 entered 3. Background of webpage changed to #FF5A00 colour This is where I'm getting tripped up.

03-23-2007, 09:24 AM	#9 (permalink)
YopY BOOM HEADSHOT! Join Date: Jan 2007 Age: 22 Posts: 299 Rep Power: 4	I dunno what you're getting at in that last post tbh :/.

03-23-2007, 10:06 AM	#10 (permalink)
Trav kill em all Join Date: Mar 2007 Location: Scotland Age: 24 Posts: 351 Rep Power: 0	How so? 1. A form asking for a colour in hex format 2. #FF5A00 string is entered 3. Background of webpage changed to #FF5A00 colour This is what I want. But this means I have to write this data to the CSS file, every website has told me to disguise the CSS file as a PHP file.

03-23-2007, 03:32 PM	#12 (permalink)
Trav kill em all Join Date: Mar 2007 Location: Scotland Age: 24 Posts: 351 Rep Power: 0	I've decided to do something more concrete. A User can submit their CSS file via a form. PHP reads the CSS file and prints the contents in a textarea. Once in the textarea changes can be made and then saved. Writing the results back. I'll post an example of this real soon once I get home and stuff.

03-23-2007, 04:47 PM	#16 (permalink)
Trav kill em all Join Date: Mar 2007 Location: Scotland Age: 24 Posts: 351 Rep Power: 0	I think that's solved it. Thanks a lot Kionae you are a star. Do you have the source code for that demo you posted?