• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 621
  • Last Modified:

Writing to CSS file

I want to make a simple php page that will edit things in the default.css page.
Just certain things like the header font color.
I am looking to be put in the right direction on how to do this, or if there is any example code to do this.
I have an idea of simply write a whole new css page out but , if there is a simpler way just to edit certain things then thats what i would like to do.
0
Sam Cohen
Asked:
Sam Cohen
  • 5
  • 4
  • 3
  • +2
1 Solution
 
quincydudeCommented:
The idea can be reading and put the content of CSS file into a text area and save it back after editing.
But why don't you edit the css file directly?
0
 
Beverley PortlockCommented:
Put all your non-changing CSS in the default.css file, then write your changeable CSS into the HTML between STYLE tags

<head>
   <style>
       <?php
             // Code to generate style info
       ?>
   </style>
   <link rel='stylesheet' type='text/css' href='default.css' />
</head>
0
 
Sam CohenAuthor Commented:
bportlock,

That wont work. Because style sheet has to be separate. But i have a thought based on what you said,
What if i make a separate writable style sheet in addition to the default? Or what if I make a writable dummy file that hold my vars of the the changable color codes (e.g $Header_color ='#33FF30' ) and make it an include file? Is it possible to make an include file for Css?

What is the best way? and how do i accomplish this?
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
Beverley PortlockCommented:
An HTML document can reference multiple style sheets. You could have a static one and one that gets regenerated on occassion and include them both

<link rel='stylesheet' type='text/css' href='changeablecss' />
<link rel='stylesheet' type='text/css' href='static.css' />

If have seen other approaches where a "template" style sheet is created. This is then read in to PHP and str_replace used to sub the values in. The new string is then written to a new file. Like this

(UNTESTED)

style.template.css

body {
    color: ^BODY_COLOR^;
    background: ^BACKG_COLOR;
}

.myClass {
    width: ^MY_CLASS_WIDTH^;
}


This then gets read into memory as a big string using something like file_get_contents and is merged with values from where ever you store them

$str = file_get_contents( "style.template.css");

$bodyColor = "#ffff00";
$bodyBackg = "#000099";
$myClassWidth = get_the-Size_of_the_screen();

$newStr = str_replace ( array("^BODY_COLOR^", "^BODY_BACKG^", "^MY_CLASS_WIDTH^"),  array( $bodyColor, $bodyBackg, $myClassWidth ), $str );

file_put_contents( "changeable.css", $newStr );



           
0
 
eszaqCommented:
I really wonder what the purpose is for doing this. If it is supposed to be specific user preferences there is no reason for creating file - just embed styles in the head of the document. But if you really need to create file, then go with solution offered by bportlock. This case, even if something goes wrong you have your basic CSS file safe.

Also, you have to remember, the way CSS works is such that if properties for the same selector are specified twice, the later values override the earlier ones. So, you have to list your CSS files in the head of the document in this order:
<link rel='stylesheet' type='text/css' href='static.css' />
<link rel='stylesheet' type='text/css' href='changeable.css' />
0
 
Sam CohenAuthor Commented:
bportlock.

I like your solution. What if i just change the static.css only without interrupting the other classes, is that possible?

eszaq.
The reason why i need this , is , i am making a popup in my backend of my site that changes allow me to choose my colors for each respect part (Header,main font, form fields ) and write it to the main css.
0
 
Beverley PortlockCommented:
"What if i just change the static.css only without interrupting the other classes, is that possible?"

If you mean can it all be in one stylesheet and you just change a few classes then the answer is "yes" - it just makes the template bigger that's all.
0
 
Sam CohenAuthor Commented:
So basically.
I can do this:

$str = file_get_contents( "static.css");

$bodyColor = "#999999";
$bodyBackg = "#336699";

$newStr = str_replace ("body {color: #ffff00; background: #000099;}","body {color:'.$bodyColor.'; background: '.$bodyBackg.';}", $str)

file_put_contents( "static.css", $newStr );


Is this right???
0
 
Beverley PortlockCommented:
It is right, but you will have to be very careful to get a precise match for the string replace to work. For instance if in your stylesheet you had

color: #99ff00;

and in your string replace you had

Color: #99ff00;

then the replace would not proceed because color and Color are different from each other. That is why most people use use a variable with no spaces, maybe all in upper case, to eliminate non-matches. In your case you could do

$newStr = str_replace ("body {BODY_CSS}","body {color:'.$bodyColor.'; background: '.$bodyBackg.';}", $str)

I suppose it depends on whether you use a template for generating your new CSS or if you need to read an existing CSS. If the latter you will find it very difficult. It is much better to use a template, combine your new values and write a new CSS.


0
 
eszaqCommented:
Well, but what if you decide later on, that you want to change properties again? Then you'll either need to know what the previous values were. And then I see no reason why you'd need to make changes programmatically instead of just editing your static.css directly.

But if you are going for dynamic solution, then I assume you do not necessarily know what current values are. And then you'd need to either use regular expressions for replacing values, either to have changeable.css and rewrite entire contents of it.

If you use changeable.css, you'll never need to change your static.css. You will have you html shown as specified in changeable anyway (values of properties in changeable.css will override values in static.css)
0
 
eszaqCommented:
By saying values of properties in changeable.css will override values in static.css I mean - later declarations for the same selectors override previous ones, take precedence.
0
 
Beverley PortlockCommented:
An additonal thought, if you have string of variable spacing and such, then rather than using str_replace which requires an exact match, you might be better served by using a regex along the lines of

<?php

$bodyColor = "#123456";
$bodyBackg = "#987654";

$str = "body {color: #ffff00; background: #000099;}";
$rep = "body { color:'.$bodyColor.'; background: '.$bodyBackg.'; }";

$newCss = preg_replace('/body \{(.+)\}/', $rep, $str );

echo $newCss;
echo "<br>";

// Same agin, but demonstrting variation

$str = "body {color: #ffff00;     BACKground: #000099;}";
$rep = "body { color:'.$bodyColor.'; background: '.$bodyBackg.'; }";

$newCss = preg_replace('/body \{(.+)\}/', $rep, $str );

echo $newCss;

?>

These would produce the following ouput

body { color:'.#123456.'; background: '.#987654.'; }
body { color:'.#123456.'; background: '.#987654.'; }
0
 
Sam CohenAuthor Commented:
Thanks bportlock.

eszag.
Yes , i would have to make a dummy.css which holds the original values, which never changes.
Pull info from there , do str replace, then copy to default.css.
0
 
designersxCommented:
here buddy we are replacing the previous css but what would i do if i want the new css(same in this case no problem) should be appended to the previous css every time.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 5
  • 4
  • 3
  • +2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now