Font Color Drop-Down Menu

[mihosa]

Hello to everyone !

 

I am new in php, and need some help.

 

I had, a website coded, in html, and decided to change it in php.  In the old version, I had some controls for giving the user the oportunity to change the text and background color of my website based in his/her, choice, by using some buttons.

 

When I changed my website, into php, I was also try to change the color controls of the old website, to work in php.

 

Unfortunatelly, I achieved to change only the half part of these controls, basically only the background color selection and make a dropdown menu for that.

 

But I couldn't create a dropdown menu for changing the font controls.  As I know, in PHP there is not actually the possibility to control the color of the text, there is no color actually but the colors are being implemented as html in the client side.(Correct me if I am Wrong)

 

My questions are:

 

1) how can I implement a drop down menu, which will give the oportunity to the visitors of my website, to change the color of the text in my website

2) how can I take actually the selected value from the html, and store it to a php cookie, like I did it in the background color selection

 

Thanks in Advance !!!

[cyberRobot]

You could give visitors a regular HTML form to choose which text color they want. The form could submit to a PHP script which stores the color preference in a PHP Session. Your website could then use the session variable to determine which color to use for the text.

[jcbones]

Short example:

<?php
if(!empty($_GET['fontColor'])) { //if the form passed a color (form set to GET).
    setcookie('fontColor',$_GET['fontColor']); //set the cookie, of course you need to set the expiration.
    $_COOKIE['fontColor'] = $_GET['fontColor']; //also set the color in the cookie super global array.
}
 
//An array that holds all CSS3 colors.
$colors = array("*TITLE01*"       => "Reds",
      "Indian Red"        => "#CD5C5C",
      "Light Coral"        => "#F08080",
      "Salmon"        => "#FA8072",
      "Dark Salmon"        => "#E9967A",
      "Light Salmon"        => "#FFA07A",
      "Crimson"        => "#DC143C",
      "Red"           => "#FF0000",
      "Fire Brick"        => "#B22222",
      "Dark Red"        => "#8B0000",
       
      "*TITLE02*"       => "Pinks",
      "Pink"           => "#FFC0CB",
      "Light Pink"        => "#FFB6C1",
      "Hot Pink"        => "#FF69B4",
      "Deep Pink"        => "#FF1493",
      "Medium Violet Red"     => "#C71585",
      "Pale Violet Red"     => "#DB7093",
       
      "*TITLE03*"       => "Oranges",
      "Light Salmon"        => "#FFA07A",
      "Coral"        => "#FF7F50",
      "Tomato"        => "#FF6347",
      "Orange Red"        => "#FF4500",
      "Dark Orange"        => "#FF8C00",
      "Orange"        => "#FFA500",
       
      "*TITLE04*"       => "Yellows",
      "Gold"           => "#FFD700",
      "Yellow"        => "#FFFF00",
      "Light Yellow"        => "#FFFFE0",
      "Lemon Chiffon"     => "#FFFACD",
      "Light Goldenrod Yellow" => "#FAFAD2",
      "Papaya Whip"        => "#FFEFD5",
      "Moccasin"        => "#FFE4B5",
      "Peach Puff"        => "#FFDAB9",
      "Pale Goldenrod"     => "#EEE8AA",
      "Khaki"        => "#F0E68C",
      "Dark Khaki"        => "#BDB76B",
             
      "*TITLE05*"        => "Purples",
      "Lavender"        => "#E6E6FA",
      "Thistle"        => "#D8BFD8",
      "Plum"           => "#DDA0DD",
      "Violet"        => "#EE82EE",
      "Orchid"        => "#DA70D6",
      "Fuchsia"        => "#FF00FF",
      "Magenta"        => "#FF00FF",
      "Medium Orchid"     => "#BA55D3",
      "Medium Purple"     => "#9370DB",
      "Blue Violet"        => "#8A2BE2",
      "Dark Violet"        => "#9400D3",
      "Dark Orchid"        => "#9932CC",
      "Dark Magenta"        => "#8B008B",
      "Purple"        => "#800080",
      "Indigo"        => "#4B0082",
      "Slate Blue"        => "#6A5ACD",
      "Dark Slate Blue"     => "#483D8B",
       
      "*TITLE06*"       => "Greens",
      "Green Yellow"        => "#ADFF2F",
      "Chartreuse"        => "#7FFF00",
      "Lawn Green"        => "#7CFC00",
      "Lime"           => "#00FF00",
      "Lime Green"        => "#32CD32",
      "Pale Green"        => "#98FB98",
      "Light   Green"        => "#90EE90",
      "Medium Spring Green"     => "#00FA9A",
      "Spring Green"        => "#00FF7F",
      "Medium Sea Green"     => "#3CB371",
      "Sea Green"        => "#2E8B57",
      "Forest Green"        => "#228B22",
      "Green"        => "#008000",
      "Dark Green"        => "#006400",
      "Yellow Green"        => "#9ACD32",
      "Olive Drab"        => "#6B8E23",
      "Olive"        => "#808000",
      "Dark Olive Green"     => "#556B2F",
      "Medium Aquamarine"     => "#66CDAA",
      "Dark Sea Green"     => "#8FBC8F",
      "Light Sea Green"     => "#20B2AA",
      "Dark Cyan"        => "#008B8B",
      "Teal"           => "#008080",
       
      "*TITLE07*"       => "Blues",
      "Aqua"           => "#00FFFF",
      "Cyan"           => "#00FFFF",
      "Light Cyan"        => "#E0FFFF",
      "Pale Turquoise"     => "#AFEEEE",
      "Aquamarine"        => "#7FFFD4",
      "Turquoise"        => "#40E0D0",
      "Medium Turquoise"     => "#48D1CC",
      "Dark Turquoise"     => "#00CED1",
      "Cadet Blue"        => "#5F9EA0",
      "Steel Blue"        => "#4682B4",
      "Light Steel Blue"     => "#B0C4DE",
      "Powder Blue"        => "#B0E0E6",
      "Light Blue"        => "#ADD8E6",
      "Sky Blue"        => "#87CEEB",
      "Light Sky Blue"     => "#87CEFA",
      "Deep Sky Blue"     => "#00BFFF",
      "Dodger Blue"        => "#1E90FF",
      "Cornflower Blue"     => "#6495ED",
      "Medium Slate Blue"     => "#7B68EE",
      "Royal Blue"        => "#4169E1",
      "Blue"           => "#0000FF",
      "Medium Blue"        => "#0000CD",
      "Dark Blue"       => "#00008B",
      "Navy"           => "#000080",
      "Midnight Blue"     => "#191970",
             
      "*TITLE08*"       => "Browns",
      "Cornsilk"        => "#FFF8DC",
      "Blanched Almond"     => "#FFEBCD",
      "Bisque"        => "#FFE4C4",
      "Navajo White"        => "#FFDEAD",
      "Wheat"        => "#F5DEB3",
      "Burly Wood"        => "#DEB887",
      "Tan"           => "#D2B48C",
      "Rosy Brown"        => "#BC8F8F",
      "Sandy Brown"        => "#F4A460",
      "Goldenrod"        => "#DAA520",
      "Dark Goldenrod"     => "#B8860B",
      "Peru"           => "#CD853F",
      "Chocolate"        => "#D2691E",
      "Saddle Brown"        => "#8B4513",
      "Sienna"        => "#A0522D",
      "Brown"        => "#A52A2A",
      "Maroon"        => "#800000",
             
      "*TITLE09*"       => "Whites",
      "White"        => "#FFFFFF",
      "Snow"           => "#FFFAFA",
      "Honeydew"        => "#F0FFF0",
      "Mint Cream"        => "#F5FFFA",
      "Azure"        => "#F0FFFF",
      "Alice Blue"        => "#F0F8FF",
      "Ghost White"        => "#F8F8FF",
      "White Smoke"        => "#F5F5F5",
      "Seashell"       => "#FFF5EE",
      "Beige"          => "#F5F5DC",
      "Old Lace"       => "#FDF5E6",
      "Floral White"       => "#FFFAF0",
      "Ivory"          => "#FFFFF0",
      "Antique White"       => "#FAEBD7",
      "Linen"          => "#FAF0E6",
      "Lavender Blush"    => "#FFF0F5",
      "Misty Rose"       => "#FFE4E1",
       
      "*TITLE10*"       => "Greys",
      "Gainsboro"       => "#DCDCDC",
      "Light Grey"       => "#D3D3D3",
      "Silver"       => "#C0C0C0",
      "Dark Gray"       => "#A9A9A9",
      "Gray"          => "#808080",
      "Dim Gray"       => "#696969",
      "Light Slate Gray"    => "#778899",
      "Slate Gray"       => "#708090",
      "Dark Slate Gray"    => "#2F4F4F",
      "Black"          => "#000000"
      );
 
//end of processing, start output.
?>
 
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
<?php
        if(isset($_COOKIE['fontColor'])) { //only if there is a fontColor set:
        //then set a css for the font color;
            echo '<style type="text/css">
                           body
                               {
                                   color:' . $_COOKIE['fontColor'] .';
                                }
                        </style>';
        }
?>
    </head>
    <body>
<?php
        // print out the form, with the select.
        echo '<form><label for="fontColor">Font Color</label>
                     <select name="fontColor">';
        foreach($colors as $name => $code) { //for each color
            if(strpos($name,'*') !== false) { //if the index contains an *, then:
                $name = $code; //change the index to the value;
                $code = '#FFFFFF'; //set the value to #FFFFFF
            }
             echo "<option style='color:{$code};' value='{$code}'>{$name}</option>"; //echo out the options (with styling).
        }
        //end the select, and the form, adding a submit button.
        echo '</select>
                    <input type="submit" value="Submit" /></form>
                    <div>THIS IS TESTING TEXT!!!</div>';
       
?>
</body>
</html>

Edited February 3, 2014 by jcbones