How to modify CSS with PHP?

**Jerry Stuckle** · Aug 23 '06, 01:45 AM

Re: How to modify CSS with PHP?

deko wrote:

Is it possible to modify the background-image for a certain web page
with PHP? I'd like to but a few buttons on the top of a page so readers
can select from 2 or 3 different background images (or colors) to make
the page easier to read. Can I do this kind of Dynamic HTML without
using JavaScript? How do I modify my CSS? Or do I just point the page
to a different stylesheet just for the background-image directive?

You can point to a different style sheet - or you can simply include a
<style type="text/css">... </stylefor the background image in the
header of the page.

--
=============== ===
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp.
jstucklex@attgl obal.net
=============== ===

**deko** · Aug 23 '06, 03:35 AM

Re: How to modify CSS with PHP?

or you can simply include a

That sounds easier than maintaining multiple stylesheets.

Do this scenario sound correct:

Put HTML buttons on the page, something like this:

<form action="" method="post" name="newbackgr ound">
<input type="submit" value="white">
<input type="submit" value="yellow">
</form>

Then, in the head section of the page, use PHP like this:

<head>
<style type="text/css">
<?php
if (!empty($newbac kground = trim($_POST['white']))
{ ?>
#page {
background-image:url(/images/background-white.gif);
<?php }
elseif (!empty($newbac kground = trim($_POST['yellow']))
{ ?>
#page {
background-image:url(/images/background-yellow.gif);
<?php } ?>
</style>
</head>

Is this correct? Something tells me I'm missing something on that form...

Thanks for the help!

**randomname** · Aug 23 '06, 05:05 AM

Re: How to modify CSS with PHP?

deko wrote:

or you can simply include a
<style type="text/css">... </stylefor the background image in the
header of the page.

>
That sounds easier than maintaining multiple stylesheets.
>
Do this scenario sound correct:
>
Put HTML buttons on the page, something like this:
>
<form action="" method="post" name="newbackgr ound">
<input type="submit" value="white">
<input type="submit" value="yellow">
</form>
>
Then, in the head section of the page, use PHP like this:
>
<head>
<style type="text/css">
<?php
if (!empty($newbac kground = trim($_POST['white']))
{ ?>
#page {
background-image:url(/images/background-white.gif);
<?php }
elseif (!empty($newbac kground = trim($_POST['yellow']))
{ ?>
#page {
background-image:url(/images/background-yellow.gif);
<?php } ?>
</style>
</head>
>
Is this correct? Something tells me I'm missing something on that form...
>
Thanks for the help!

The $_POST array is keyed by the variable name... and your submit
buttons do not have names.

You should assign "name" attributes to your submit buttons, or use a
dropdown. I'd do it like this:

<select name=color>
<option value=yellow>ye llow</option>
<option value=white>whi te</option>
</select>

then in your script:

<style>
<?php

$background = trim($_POST['color']);

if ($background = 'yellow'){
//yellow bg
}elseif ($background = 'blue'){
//blue bg
}else{
//default bg
}

But look ahead.. what happens when you want to change more than just
the background image? You should really just have separate themes in
separate css files, and load those corresponding stylesheets based on
the form input:

<?php

$theme = $_POST['theme']

if ($theme = 'yellow'){
//<link rel="StyleSheet " href="yellow.cs s" type="text/css">
}elseif ...

?>

inside the stylesheets you can define the entire theme and save
yourself a lot of work.

-sam

**deko** · Aug 23 '06, 05:45 AM

Re: How to modify CSS with PHP?

Thanks random, I will give it a shot and post back

"randomname " <randomname1234 5@gmail.comwrot e in message
news:1156310103 .341962.196350@ m79g2000cwm.goo glegroups.com.. .

>
deko wrote:

or you can simply include a
<style type="text/css">... </stylefor the background image in the
header of the page.

>>
>That sounds easier than maintaining multiple stylesheets.
>>
>Do this scenario sound correct:
>>
>Put HTML buttons on the page, something like this:
>>
><form action="" method="post" name="newbackgr ound">
> <input type="submit" value="white">
> <input type="submit" value="yellow">
></form>
>>
>Then, in the head section of the page, use PHP like this:
>>
><head>
> <style type="text/css">
><?php
>if (!empty($newbac kground = trim($_POST['white']))
>{ ?>
> #page {
> background-image:url(/images/background-white.gif);
> <?php }
>elseif (!empty($newbac kground = trim($_POST['yellow']))
>{ ?>
> #page {
> background-image:url(/images/background-yellow.gif);
> <?php } ?>
> </style>
></head>
>>
>Is this correct? Something tells me I'm missing something on that form...
>>
>Thanks for the help!

>
The $_POST array is keyed by the variable name... and your submit
buttons do not have names.
>
You should assign "name" attributes to your submit buttons, or use a
dropdown. I'd do it like this:
>
<select name=color>
<option value=yellow>ye llow</option>
<option value=white>whi te</option>
</select>
>
then in your script:
>
<style>
<?php
>
$background = trim($_POST['color']);
>
if ($background = 'yellow'){
//yellow bg
}elseif ($background = 'blue'){
//blue bg
}else{
//default bg
}
>
But look ahead.. what happens when you want to change more than just
the background image? You should really just have separate themes in
separate css files, and load those corresponding stylesheets based on
the form input:
>
<?php
>
$theme = $_POST['theme']
>
if ($theme = 'yellow'){
//<link rel="StyleSheet " href="yellow.cs s" type="text/css">
}elseif ...
>
?>
>
inside the stylesheets you can define the entire theme and save
yourself a lot of work.
>
-sam
>

**deko** · Aug 23 '06, 07:05 AM

Re: How to modify CSS with PHP?

Okay, I've got the combo box on the page:

<select name=color>
<option value=yellow>ye llow</option>
<option value=white>whi te</option>
<option value=white>gra y</option>
</select>

And I have this at the top of the page in the head section:

$background = trim($_POST['color']);
[and then the if-else statement with the style directives]

My question is this:

How do I make the page refresh after the user selects the color preference? Do
I need to put the combo box inside a form? I tried this:

<select name=color onChange="post" >

but no luck.

**ibreakyourlegs@googlemail.com** · Aug 23 '06, 07:35 AM

Re: How to modify CSS with PHP?

deko wrote:

Okay, I've got the combo box on the page:
>
<select name=color>
<option value=yellow>ye llow</option>
<option value=white>whi te</option>
<option value=white>gra y</option>
</select>
>
And I have this at the top of the page in the head section:
>
$background = trim($_POST['color']);
[and then the if-else statement with the style directives]
>
My question is this:
>
How do I make the page refresh after the user selects the color preference? Do
I need to put the combo box inside a form? I tried this:
>
<select name=color onChange="post" >
>
but no luck.

yes you need a form. when you have insert the form you can use this:
<select name=color onChange="docum ent.NAMEOFTHEFO RM.submit()"to
submit the Form after selecting the value.

greetingz

**Luke - eat.lemons@gmail.com** · Aug 23 '06, 09:05 AM

Re: How to modify CSS with PHP?

ibreakyourlegs@ googlemail.com wrote:

deko wrote:

>Okay, I've got the combo box on the page:
>>
> <select name=color>
> <option value=yellow>ye llow</option>
> <option value=white>whi te</option>
> <option value=white>gra y</option>
> </select>
>>
>And I have this at the top of the page in the head section:
>>
> $background = trim($_POST['color']);
> [and then the if-else statement with the style directives]
>>
>My question is this:
>>
>How do I make the page refresh after the user selects the color preference? Do
>I need to put the combo box inside a form? I tried this:
>>
> <select name=color onChange="post" >
>>
>but no luck.

>
yes you need a form. when you have insert the form you can use this:
<select name=color onChange="docum ent.NAMEOFTHEFO RM.submit()"to
submit the Form after selecting the value.
>
greetingz
>

Hi,

Unless you HAVE to do it with php i would do this with the following code.

<input type="button" name="colr" value="BLUE"
onclick="docume nt.bgColor='#00 00FF'">
<input type="button" name="colr" value="RED"
onclick="docume nt.bgColor='#FF 0000'">
<input type="button" name="colr" value="GREEN"
onclick="docume nt.bgColor='#00 FF00'">
<input type="button" name="colr" value="WHITE"
onclick="docume nt.bgColor='#FF FFFF'">
<input type="button" name="colr" value="BLACK"
onclick="docume nt.bgColor='#00 0000'">

Paste that into a webdoc and test!

Thanks,

Luke.

**randomname** · Aug 23 '06, 09:55 AM

Re: How to modify CSS with PHP?

deko wrote:

Okay, I've got the combo box on the page:
>
<select name=color>
<option value=yellow>ye llow</option>
<option value=white>whi te</option>
<option value=white>gra y</option>
</select>
>
And I have this at the top of the page in the head section:
>
$background = trim($_POST['color']);
[and then the if-else statement with the style directives]
>
My question is this:
>
How do I make the page refresh after the user selects the color preference? Do
I need to put the combo box inside a form? I tried this:
>
<select name=color onChange="post" >
>
but no luck.

I suggest googling for a quick PHP tutorial on forms.

<select name=color onChange="this. form.submit()">

Should do it.

One last thing, in your PHP make sure the array you are accessing is
the correct one. $_POST retrieves all variables that were submitted
via form method=post, $_GET retrieves all variables that were submitted
via form method=get [in the url: eg:
domain.com?varn ame=varvalue&va r2name=var2valu e]. $_REQUEST gets the
variables either way, but should rarely be used.

Also, as a beginniner you should take extra steps to debug your code.
Add echo statements in your php script to make sure things are
happening as planned... you'll catch a lot of bugs this way.
var_dump() also comes in handy. In this script you should do
var_dump($backg round) just to make sure that value is getting set
correctly.

Also, if you are interested, you can make a dummy form with lots of
different controls, and have your php script do var_dump($_POST ) to see
how PHP populates the $_POST array based on a form's submission.

**Jerry Stuckle** · Aug 23 '06, 10:35 AM

Re: How to modify CSS with PHP?

Luke - eat.lemons@gmai l.com wrote:

ibreakyourlegs@ googlemail.com wrote:
>

>deko wrote:
>>

>>Okay, I've got the combo box on the page:
>>>
>> <select name=color>
>> <option value=yellow>ye llow</option>
>> <option value=white>whi te</option>
>> <option value=white>gra y</option>
>> </select>
>>>
>>And I have this at the top of the page in the head section:
>>>
>> $background = trim($_POST['color']);
>> [and then the if-else statement with the style directives]
>>>
>>My question is this:
>>>
>>How do I make the page refresh after the user selects the color
>>preference? Do
>>I need to put the combo box inside a form? I tried this:
>>>
>> <select name=color onChange="post" >
>>>
>>but no luck.

>>
>>
>yes you need a form. when you have insert the form you can use this:
><select name=color onChange="docum ent.NAMEOFTHEFO RM.submit()"to
>submit the Form after selecting the value.
>>
>greetingz
>>

Hi,
>
Unless you HAVE to do it with php i would do this with the following code.
>
<input type="button" name="colr" value="BLUE"
onclick="docume nt.bgColor='#00 00FF'">
<input type="button" name="colr" value="RED"
onclick="docume nt.bgColor='#FF 0000'">
<input type="button" name="colr" value="GREEN"
onclick="docume nt.bgColor='#00 FF00'">
<input type="button" name="colr" value="WHITE"
onclick="docume nt.bgColor='#FF FFFF'">
<input type="button" name="colr" value="BLACK"
onclick="docume nt.bgColor='#00 0000'">
>
>
Paste that into a webdoc and test!
>
Thanks,
>
Luke.

Doesn't work if they have JS disabled. It also wouldn't work if he
wanted the option of an image (see the first post).

--
=============== ===
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp.
jstucklex@attgl obal.net
=============== ===

**deko** · Aug 23 '06, 05:35 PM

Re: How to modify CSS with PHP?

I suggest googling for a quick PHP tutorial on forms.

>
<select name=color onChange="this. form.submit()">
>
Should do it.
>
One last thing, in your PHP make sure the array you are accessing is
the correct one. $_POST retrieves all variables that were submitted
via form method=post, $_GET retrieves all variables that were submitted
via form method=get [in the url: eg:
domain.com?varn ame=varvalue&va r2name=var2valu e]. $_REQUEST gets the
variables either way, but should rarely be used.
>
Also, as a beginniner you should take extra steps to debug your code.
Add echo statements in your php script to make sure things are
happening as planned... you'll catch a lot of bugs this way.
var_dump() also comes in handy. In this script you should do
var_dump($backg round) just to make sure that value is getting set
correctly.
>
Also, if you are interested, you can make a dummy form with lots of
different controls, and have your php script do var_dump($_POST ) to see
how PHP populates the $_POST array based on a form's submission.

Thanks for the help, random.

The URL that needs to be reloaded (with the new background) looks like this:

http: / /www . example . com/ks042/?p=14#more-83

I discovered that I can echo the background variable using:

$background = trim($_GET['color']);

with this URL:

http: / /www . example . com/ks042/?p=14&color=whi te#more-83

The below form seems to work, except for the missing 'p' variable and #more
anchor:

<form name="bgcolor" method="get">
<select>
<select name=color onChange="bgcol or.submit()">
<option value=yellow>wh ite</option>
<option value=white>yel low</option>
</select>
</form>

If the URL did NOT contain any variables or anchors, would this be the correct
way to construct the form?

How do I do it with a URL with variables?

**deko** · Aug 23 '06, 05:55 PM

Re: How to modify CSS with PHP?

This seems to be working:

<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcol or.submit()">
<option value=white>whi te</option>
<option value=yellow>ye llow</option>
</select>
</form>

BUT, after the page posts back, the option value in the combo box reverts back
to 'white' rather than sticking with what the user just selected.

How do I get it to stick with the user's choice on post back? Do I have to grab
that value with PHP code and then set the combo default manually? How?

**deko** · Aug 23 '06, 06:45 PM

Re: How to modify CSS with PHP?

Maybe adding a

>
<option value-"">select</option>
>
option at the top of the list

That seems to be the only way around this limitation of the element.

Unfortunately, due to other circumstances, I cannot regenerate the entire select
element (putting the selected option on top) with PHP on post back. So I am
using this:

<form name="bgcolor" action="http: / /www . example . com/ks032/?p=49"
method="post">
<select name=color onChange="bgcol or.submit()">
<option selected value=default>s elect background color</option>
<option value=white>whi te</option>
<option value=yellow>ye llow</option>
<option value=gray>gray </option>
</select>
</form>

The problem I have now is the width of the combo box. The text 'select
background color' gets truncated because the combo box is too narrow. I tried
this:

<select name=color width="60" onChange="bgcol or.submit()">

and this:

<form name="bgcolor" width="60" action=" ... " method="post">

but no luck.

How do I set the width of that combo box??

Thanks in advance.

**mootmail-googlegroups@yahoo.com** · Aug 23 '06, 07:05 PM

Re: How to modify CSS with PHP?

deko wrote:

This seems to be working:
>
<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcol or.submit()">
<option value=white>whi te</option>
<option value=yellow>ye llow</option>
</select>
</form>
>
BUT, after the page posts back, the option value in the combo box reverts back
to 'white' rather than sticking with what the user just selected.
>
How do I get it to stick with the user's choice on post back? Do I have to grab
that value with PHP code and then set the combo default manually? How?

Yes, you will need to set the selected option manually.
Try something like this:

<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcol or.submit()">
<option value=white
<?=($_POST['color']=='white'?'sele cted':'')?>>whi te</option>
<option value=yellow
<?=($_POST['color']=='yellow'?'sel ected':'')?>>ye llow</option>
</select>
</form>

**deko** · Aug 23 '06, 07:15 PM

Re: How to modify CSS with PHP?

>How do I get it to stick with the user's choice on post back? Do I have to

>grab
>that value with PHP code and then set the combo default manually? How?

>
Yes, you will need to set the selected option manually.
Try something like this:
>
<form name="bgcolor" action="http: // www . example . com/ks123/?p=85"
method="post">
<select name=color onChange="bgcol or.submit()">
<option value=white
<?=($_POST['color']=='white'?'sele cted':'')?>>whi te</option>
<option value=yellow
<?=($_POST['color']=='yellow'?'sel ected':'')?>>ye llow</option>
</select>
</form>

Unfortunately, I cannot do that in my current situation, but thanks for the tip.
I may use that elsewhere.

How to modify CSS with PHP?

How to modify CSS with PHP?

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment