Return to Snippet

Revision: 11432
at February 5, 2009 02:51 by dbug13


Updated Code
-- This is a very easy way to create a dynamically generated CSS file in PHP
-- 
-- The important parts of the code below:
-- 	1. note that the PHP generated CSS file must start out with 
--     header('Content-type: text/css');
--
--  2. The file name should end in .php not .css , since this is a PHP file.
--
-- Why this works: when the CSS file is requested by the remote server, the 
-- server sees the .php extension and preprocesses it before sending it to
-- the client browser. Since the PHP file sets the Content-type as text/css
-- the client browser treats it like a CSS file.
-- 
-- Code written by dbug13(Jamie Allison)

----- Begin Dynamic CSS file: base.css.php -----
<?php
header('Content-type: text/css');

// Try changing the variables below, and refresh your html file.
$bg_color = "purple";
$base_font="Verdana,Arial,sans";
?>
body{
	font-family: <?php echo $base_font; ?>;
	background-color: <?php echo $bg_color; ?>;
	
}
?>
----- End Dynamic CSS file

----- Begin HTML file that uses above CSS file: index.html -----
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<!-- Include the dynamic CSS file -->
	<link rel="stylesheet" href="base.css.php" type="text/css" media="screen" title="no title" charset="utf-8">
	<title>untitled</title>
	
</head>

<body>

<h1>Hello World</h1>

</body>
</html>
----- End HTML file -----

Revision: 11431
at February 5, 2009 02:50 by dbug13


Initial Code
-- This is a very easy way to create a dynamically generated CSS file in PHP
-- 
-- The important parts of the code below:
-- 	1. note that the PHP generated CSS file must start out with 
--     header('Content-type: text/css');
--
--  2. The file name should end in .php not .css , since this is a PHP file.
--
-- Why this works: when the CSS file is requested by the remote server, the 
-- server sees the .php extension and preprocesses it before sending it to
-- the client browser. Since the PHP file sets the Content-type as text/css
-- the client browser treats it like a CSS file.
-- 
-- Code written by dbug13(Jamie Allison)

----- Begin Dynamic CSS file: base.css.php -----
<?php
header('Content-type: text/css');

// Try changing the variables below, and refresh your html file.
$bg_color = "purple";
$base_font="Verdana,Arial,sans";
?>
body{
	font-family: <?php echo $base_font; ?>;
	background-color: <?php echo $bg_color; ?>;
	
}
----- End Dynamic CSS file

----- Begin HTML file that uses above CSS file: index.html -----
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<!-- Include the dynamic CSS file -->
	<link rel="stylesheet" href="base.css.php" type="text/css" media="screen" title="no title" charset="utf-8">
	<title>untitled</title>
	
</head>

<body>

<h1>Hello World</h1>

</body>
</html>
----- End HTML file -----

Initial URL


Initial Description
One other thing to note, is that the php generated css file can make use of query parameters, for instance:

&lt;link rel="stylesheet" href="base.css.php?type=alternate" type="text/css" &gt;

in your PHP file you can use the variable:

if ($_GET['type'] == 'alternate'){ 
   // set some options etc. ....
}

Initial Title
use PHP to create an external  dynamically generated CSS file.

Initial Tags
css, php

Initial Language
PHP