homepage Welcome to WebmasterWorld Guest from 54.197.65.82
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / PHP Server Side Scripting
Forum Library, Charter, Moderators: coopster & jatar k

PHP Server Side Scripting Forum

    
PHP within css file
Sub_Seven



 
Msg#: 4246484 posted 9:07 pm on Dec 27, 2010 (gmt 0)

Hello, this post could belong to another category but I'm just not sure.

I was doing some research to find out if PHP could be run inside a *.css file, I have found several tutorials online but I cannot make it work, maybe someone here (as always) knows how to make it work, this is what I've done:

1. I put the header data in my CSS file (with .css extension).

<?php header("Content-type: text/css; charset: UTF-8"); ?>

2. I created an .htaccess file with the following data in it:

AddHandler application/x-httpd-php .css

I also tested it this way:

AddHandler application/x-httpd-php5 .css

3. Tested it with my css file that looks like this:

<?php
header("Content-type: text/css; charset: UTF-8");
$color = 'blue';
?>

h2 {color: <?=$color?>}

Bottom line my h2 data should be blue but it isn't, does anybody know what is wrong here?

Thanks in advance for any responses received.

 

Readie

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4246484 posted 2:33 am on Dec 28, 2010 (gmt 0)

First things first, check the basics:

Make sure you're including the correct .css file into your webpage.

If that's fine, what does it look like when you visit the .css file in your browser?

astupidname

5+ Year Member



 
Msg#: 4246484 posted 7:31 am on Dec 28, 2010 (gmt 0)

Just another guess, perhaps you may not have php short tags enabled? Try:
h2 {color: <?php echo $color; ?>;}
It works fine for me with
AddHandler application/x-httpd-php .css
also I believe it should be charset=UTF-8 rather than charset: UTF-8, not sure if it makes a difference : vs =

Sub_Seven



 
Msg#: 4246484 posted 5:29 pm on Dec 28, 2010 (gmt 0)

@Readie

I can see everything, including whats in the php tags, this is my css file:
<?php
header("Content-type: text/css; charset=UTF-8");
$color = 'blue';
?>

/* Master */
body {font-family: Georgia; padding: 0; margin: 0}
#content {width: 960px; margin: 0 auto; min-height:100%; margin-bottom:-96px; position: relative}
#clearfooter {height: 96px; clear: both}
#footer {width: 100%; min-width: 960px; height: 80px; padding-top: 16px; text-align: center; position: relative}
html, body {height:100%;}
/* Master */

/* Header */
h2 {margin: 0; padding: 0; font-size: 1.5em; color: <?php echo $color; ?>}
/* Header */



@astupidname

I have tried both ways <? ?> and <?php ?>, the results were the same. Also I've changed to charset=UTF-8 and the h2 still looks pretty black to me...


You can see it for yourself here: testland[dot]devseven[dot]com

Readie

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4246484 posted 8:27 pm on Dec 28, 2010 (gmt 0)

The problem here lies in that PHP is not being parsed as PHP in the CSS file. I'm not sure how to go about enabling it if I'm honest - I'm a bit detached from the whole server settings process.

You can probably turn up how to enable it with a Google search without too much trouble.

Sub_Seven



 
Msg#: 4246484 posted 8:56 pm on Dec 28, 2010 (gmt 0)

AddHandler application/x-httpd-php .css

The line above in a .htaccess file in the same folder where the css is is the way to do it, according to several sources from google

Others say it is this way:

AddType application/x-httpd-php .css

But that one actually disables my css so I think I'm hitting a dead end, unless there is a way to modify Apache (a workaround...)

Readie

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4246484 posted 9:24 pm on Dec 28, 2010 (gmt 0)

If you have access to the php.ini file, you should be able to add a parameter there for it.

Also, what do you mean by "disables my CSS"?

Sub_Seven



 
Msg#: 4246484 posted 10:09 pm on Dec 28, 2010 (gmt 0)

I mean that everything is displayed as if there was no CSS at all, for example the footer is displayed right after the h2 and not at the bottom like I have it set or the content div looses the margin: 0 auto; property and everything is aligned at the left of the screen...

I'll contact my hosting provider and see if I can edit the php.ini, thanks for the help.

Readie

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4246484 posted 10:34 pm on Dec 28, 2010 (gmt 0)

Ok, that is actually promising, it suggests that "AddType application/x-httpd-php .css" is correct, but something with your PHP is making your CSS completely unrecognisable.

Turn that flag on again, and visit the .css file in your browser to see what it looks like.

Sub_Seven



 
Msg#: 4246484 posted 10:50 pm on Dec 28, 2010 (gmt 0)

Huh, I did and if I try to go to testland[.]devseven[.]com/css/styles.css it brings up a "save as" box

What is the difference between AddType and AddHandler?

Now, could this line be wrong in some way:

header("Content-type: text/css; charset=UTF-8");

and maybe it should be

header("Content-type=text/css; charset=UTF-8"); or
header('Content-type="text/css"; charset="UTF-8"');

Sub_Seven



 
Msg#: 4246484 posted 12:31 am on Dec 29, 2010 (gmt 0)

Been trying to find the bug, turns out that this:

header("Content-type: text/css; charset=UTF-8");

is the correct way...

The problem is still unresolved.

Anyango

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4246484 posted 8:32 am on Dec 29, 2010 (gmt 0)

why not just rename the .css to php ?

css.php

<?php
header("Content-type: text/css; charset=UTF-8");
$color = 'blue';
?>

/* Master */
body {font-family: Georgia; padding: 0; margin: 0}
#content {width: 960px; margin: 0 auto; min-height:100%; margin-bottom:-96px; position: relative}
#clearfooter {height: 96px; clear: both}
#footer {width: 100%; min-width: 960px; height: 80px; padding-top: 16px; text-align: center; position: relative}
html, body {height:100%;}
/* Master */

/* Header */
h2 {margin: 0; padding: 0; font-size: 1.5em; color: <?php echo $color; ?>}
/* Header */



index.html

<link href="css.php" rel="stylesheet" type="text/css">
<h2>testing, should be blue</h2>


That works as you want, why struggle with .css extension

Sub_Seven



 
Msg#: 4246484 posted 7:50 pm on Dec 29, 2010 (gmt 0)

@Anyango

Thanks for the help, I had tried that already but when I visited the styles.php file it gave me this error:

styles.php
Warning: Cannot modify header information - headers already sent by (output started at /home/devseven/public_html/testland/css/styles.php:1) in /home/devseven/public_html/testland/css/styles.php on line 2
/* Master */ body {font-family: Georgia; padding: 0; margin: 0} #content {width: 960px; margin: 0 auto; min-height:100%; margin-bottom:-96px; position: relative} #clearfooter {height: 96px; clear: both} #footer {width: 100%; min-width: 960px; height: 80px; padding-top: 16px; text-align: center; position: relative} html, body {height:100%;} /* Master */ /* Header */ h2 {margin: 0; padding: 0; font-size: 2em; color: blue} /* Header */


I'm going to upload this files to a different hosting/server and see if it happens there as well as I'm running out of options...

topr8

WebmasterWorld Senior Member topr8 us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 4246484 posted 9:02 pm on Dec 29, 2010 (gmt 0)

there is an error in your css code anyway - the trailing semi-colons ;

have been omitted in nearly every line, not sure if this would cause an error but it's certainly invalid.

however why are you trying to do this, by using php in a css file you are losing the caching benefit of an external style sheet as the browser will have to download it fresh for each page (most likely)

you should have a static css file and then if required use php to write rules into the <head> ... these rules will override the rules in the style sheet

Sub_Seven



 
Msg#: 4246484 posted 9:36 pm on Dec 29, 2010 (gmt 0)

Hey topr8, you just made me think I could have just asked for the best solution to what I'm trying to do.

In general I'm trying to get more functionality from my CSS and also trying to let the client change small things without compromising the well-being of the website.

It all started with a website I've had for years, it is a landscaping website from NJ, all I want is to base the background image under a php if statement that will change the image depending on the date (a different image for each season), I know I could do this outside the CSS but the fact that I cannot make it work has created the urgency to not give up (yes I am stubborn).

Another reason is that I like to keep the HTML as clean as possible <head> and <body> so anything I can send to an external file is welcome.

About caching, thatís something I was trying to ignore but it has been pointed out on several pages and now here, I guess the cons equal the pros so probably if it ainít broken donít try to fix it.

So if you know any better solutions please let me know, thanks a lot for the help :)

topr8

WebmasterWorld Senior Member topr8 us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 4246484 posted 10:12 pm on Dec 29, 2010 (gmt 0)

ok here's my solution

1)
the main css file served as normal, no php!
build 4 extra css files each with the season background image rule
use php to serve the extra file depending on date.
or even 4 complete files identical except for the bg image rule

2)
write some kind of cron job that overwrites the image file on the server with the new image every 3 months

not saying these are the best way to do it but both would work and be easy to impliment.

Sub_Seven



 
Msg#: 4246484 posted 10:34 pm on Dec 29, 2010 (gmt 0)

Your right, I leave my styles with their original extension, I'll probably create 4 new css files with the background property only and create the script that will swap them externally and call it in the <head> with a single line php include.

Thanks for all the help :)

Anyango

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4246484 posted 6:26 am on Dec 30, 2010 (gmt 0)

that header error is just because there was a white line before the <?php

Anyango

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4246484 posted 6:30 am on Dec 30, 2010 (gmt 0)

with that whitespace gone it works perfectly, we cannot send any blank lines or any output whatsoever before the header php function call. what you are trying to achieve is so simply possible with php, i dont think youd need seperate files and to swap them externally, its very easy here.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / PHP Server Side Scripting
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved