Visitor can change background color on the web site

[bethandmars]

I am working on a web site: http://www.socoirlen.com/index.php
and I have an option for the visitor to change the background color (this is mandatory for the visitor to be able to do this because it helps test for an eye syndrome) and I CANNOT FOR THE LIFE OF ME GET IT TO WORK!!!!!!!!!!!!! Please let me know how much somebody would charge to get this to work.
http://www.socoirlen.com/index.php

Thanks!

[calguy1000]

In your page template all you need to do is:

{$bgcolor = 'white'}
{if isset($smarty.get.bg)}{$bgcolor=$smarty.get.bg}{/if}
</__body style="background-color: {$bgcolor};">

[bethandmars]

I put the suggested code in my template and it did not work.
I want the visitor to be able to click on the box of the color and change the background color.

[calguy1000]

I looked at your site... and looked at the HTML before I made that suggestion. You have the get parameter already working, you just need the smarty magic.

[bethandmars]

Ok, I understand! THANK YOU, THANK YOU, THANK YOU!!!!!!!!!!
It worked!

[bethandmars]

Now, some of the colors do not show up. Can you help me with this?
Template:
<div id='change_color'>
<ul>
<li id='change_gray'><a href='/index.php?bg=gray' title='Gray'>Gray</a></li><li id='change_yellow'><a href='/index.php?bg=yellow' title='Yellow'>Yellow</a></li><li id='change_almond'><a href='/index.php?bg=almond' title='Almond'>Almond</a></li><li id='change_biscuit'><a href='/index.php?bg=biscuit' title='Biscuit'>Biscuit</a></li><li id='change_white'><a href='/index.php?bg=white' title='White'>White</a></li><li id='change_pink'><a href='/index.php?bg=pink' title='Pink'>Pink</a></li><li id='change_light_blue'><a href='/index.php?bg=light_blue' title='Light Blue'>Light Blue</a></li> </ul>
<p id='change_text'>Change the background color:</p>

CSS:
/*CHANGE COLOR*/

#change_color{clear:both; padding-right:55px; _padding-right:70px; margin-top:15px; text-align:right; position:relative; z-index:1000}
#change_color #change_text{float:right; padding-right:5px;}
#change_color ul{padding:0; margin:0; list-style-type:none; }
#change_color ul li{float:right; width:20px; padding:0; margin:0 3px 0 0; _cursor:pointer; position:relative;}
#change_color ul li a{cursor:pointer; display:block; position:relative; height:20px; border:1px solid gray; text-indent:-9999px; text-align:left; position:relative; outline:none;}

#change_color li#change_gray a{background-color:#e9e9e2;}
#change_color li#change_yellow a{background-color:#ffff66;}
#change_color li#change_almond a{background-color:#f4eda5;}
#change_color li#change_biscuit a{background-color:#f5f2c9;}
#change_color li#change_white a{background-color:white;}
#change_color li#change_pink a{background-color:#ffccff;}
#change_color li#change_light_blue a{background-color:#ccffff;}

[Rolf]

In your pagesource:

Code: Select all

"</__body style="background-color: biscuit;">


</head></__body>