[RESOLVED] CSS variable substitution problem

IceRegent

I need some help with something. I am storing color information in a database, such as "#000000". I have a stylesheet, such as "styles.css", that I need to inject color information into it from the database. I do not know the method to use variables inside of a stylesheet. Does any one have any idea how I would do that?

Thank you;
Ice
😕

NogDog

Make your style sheet a PHP file (i.e. you'll probably give it a .php suffix. Then add PHP code in it as needed just like you would a HTML file, except you'll want to set the content type before any output:

<?php // nothing before this line!
header('Content-Type: text/css');
?>
#foo {
   color: <?php echo $color_string_from_DB; ?>;
}

IceRegent

Hey, I was just thinking of doing such a thing. I just wasnt quite sure of all the elements needed to accomplish such a thing. Thank you for pointing me in the right direction!

Thanks;
Ice

IceRegent

I have tried to implement the fix as suggested, and here is my error message, which I will follow with the code:

Warning: Cannot modify header information - headers already sent by (output started at /home/iceregen/public_html/bands/template/include/config.php:1) in /home/iceregen/public_html/bands/template/themes/default/css.php on line 2

Here is the index file that is trying to get the css info from the database:

<?php
session_start();
//read config file

include '../template/include/config.php';
if($_GET['website'] <> NULL) {
$_SESSION['website'] = $_GET['website'];
}

$web=$_SESSION['website'];
//echo $web;
$result = mysql_query("SELECT bid , band , theme , links , center , cogs , footer  FROM band WHERE band LIKE '$web'") or exit(mysql_error());
	while($row = mysql_fetch_array($result, MYSQL_ASSOC))	
	{
$cssstyle = "../template/themes/" . $row['theme'] . "/css.php";
$leftcontent=$row['links'];
$centercontent=$row['center'];
$rightcontent=$row['cogs'];
$footercontent=$row['footer'];
	}

echo '<head>';
echo '<title>' . $web . ' Band Pages</title>';
//echo '<link rel="stylesheet" type="text/css" href=" ' . $cssstyle . '">';
include $cssstyle;
echo '</head>';
echo '<body>';

Here is the 'css/php' file I tried to implement as suggested:

<?php
header('Content-Type: text/css');
$web=$_SESSION['website'];
$result = mysql_query("SELECT *  FROM colors WHERE band LIKE '$web'") or exit(mysql_error());
$bcolor = $row['body'];
$h1color = $row['headerh1'];
$menufore = $row['menufore'];
$menuli = $row['menu li'];
$menua = $row['men a'];
$hover = $row['hover'];
$hoverback = $row['hoverback'];
$leftfore = $row['leftfore'];
$leftback = $row['leftback'];
$centerfore = $row['centerfore'];
$centerback = $row['centerback'];
$rightfore = $row['rightfore'];
$rightback = $row['rightback'];
$footfore = $row['footer'];
?>
body
{
    background-color: <?php echo $bcolor; ?>;
}
.header
{
    padding: 5px 0px 0px 5px;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
}
.header h1
{
    position: absolute;
    top: 0px;
    left: 300px;
    font-size: 48px;
    color: <?php echo $h1color; ?>;
}

That is just a partial listing of the css file, but you can see where the color codes have been replaced with variables. I am not sure where to begin troubleshooting right now. Any ideas?

Here is the subweb that I am trying to develop out. The url is going to be part of a larger portal, but for now, it is just a basic layout Click on the BandWebPages links, and then choose the 'default' website. http://bands.iceregent.com

Thanks;
Ice

NogDog

You don't want to include() the style file into the web page: it should still be called by a HTML <link> tag like any other style sheet file. The only difference will be that since it is a PHP file, any PHP code in it will be processed by the server just as it would a PHP web page, so the browser would receive that resulting output at the stylesheet.

IceRegent

I initially used the regular link method, and the result was as iff there was no style sheet at all. Here is the code section with the regular link, which works with the unmodified css.css file:

<?php
session_start();
//read config file

include '../template/include/config.php';
if($_GET['website'] <> NULL) {
$_SESSION['website'] = $_GET['website'];
}

$web=$_SESSION['website'];
//echo $web;
$result = mysql_query("SELECT bid , band , theme , links , center , cogs , footer  FROM band WHERE band LIKE '$web'") or exit(mysql_error());
	while($row = mysql_fetch_array($result, MYSQL_ASSOC))	
	{
$cssstyle = "../template/themes/" . $row['theme'] . "/css.php";
$leftcontent=$row['links'];
$centercontent=$row['center'];
$rightcontent=$row['cogs'];
$footercontent=$row['footer'];
	}

echo '<head>';
echo '<title>' . $web . ' Band Pages</title>';
echo '<link rel="stylesheet" type="text/css" href=" ' . $cssstyle . '">';
//include $cssstyle;
echo '</head>';

I am uploading the new index file, and if you go to the website again, you will see that it acts as if there was no stylesheet. If I change the extension from css.php to css.css to utilize the normal static stylesheet, it works..

Ice

IceRegent

Ok, I changed things a bit. I used the include, but, turned it into an 'inline stylesheet' instead, and it seems to work. Lets see if I change the colors in the database, if the follow thru.

Ice

IceRegent

Ok, that seems to work, however, the variables dont seem to be introduced now.

Ooops.. Ok, so I forgot one simple addition to my results of the database read. Now it works when I add that in.

Ice

NogDog

The problem with the link tag may have been the extra space between the " and ' characters for the href attribute.

IceRegent

Ok, here is the solution to what I am doing, it works just great!

Here is the index file head section:

<?php
session_start();
//read config file

include '../template/include/config.php';
if($_GET['website'] <> NULL) {
$_SESSION['website'] = $_GET['website'];
}

$web=$_SESSION['website'];
//echo $web;
$result = mysql_query("SELECT bid , band , theme , links , center , cogs , footer  FROM band WHERE band LIKE '$web'") or exit(mysql_error());
	while($row = mysql_fetch_array($result, MYSQL_ASSOC))	
	{
$cssstyle = "../template/themes/" . $row['theme'] . "/css.php";
$leftcontent=$row['links'];
$centercontent=$row['center'];
$rightcontent=$row['cogs'];
$footercontent=$row['footer'];
	}

echo '<head>';
echo '<title>' . $web . ' Band Pages</title>';
//echo '<link rel="stylesheet" type="text/css" href=" ' . $cssstyle . '">';
include $cssstyle;
echo '</head>';
echo '<body>';

Here is the beginning section of the css.php file:

<?php

$web=$_SESSION['website'];
$result = mysql_query("SELECT *  FROM colors WHERE band LIKE '$web'") or exit(mysql_error());
while($row = mysql_fetch_array($result, MYSQL_ASSOC))	
	{
$bcolor = $row['body'];
$h1color = $row['headerh1'];
$menufore = $row['menufore'];
$menuli = $row['menu li'];
$menua = $row['men a'];
$hover = $row['hover'];
$hoverback = $row['hoverback'];
$leftfore = $row['leftfore'];
$leftback = $row['leftback'];
$centerfore = $row['centerfore'];
$centerback = $row['centerback'];
$rightfore = $row['rightfore'];
$rightback = $row['rightback'];
$footfore = $row['footer'];
}


?>
<html>
<style type="text/css">
body
{
    background-color: <?php echo $bcolor; ?>;
}

This works wonderfully for creating templates that can allow the user to make a limited number of changes, such as colors for the basic layouts I can make. That is what I was aiming for. Thanks for your help NogDog! You rock!

Ice