Artículo

---

2 ¡votar!

Cómo utilizar variables PHP en hojas de estilos CSS

Chis Coyier ha publicado un artículo donde explica como poder utilizar variables de PHP dentro de hojas de estilos de una forma sencilla y en pocos pasos. Vamos a ver la forma de hacerlo.

Lo primero que hace es cambiar la extensión a la hoja de estilos, y en vez de llamarla por ejemplo Style.css, lo llama Style.php. En la inclusión del archivo en la página html, quedaría de la siguiente forma.

<link rel='stylesheet' type='text/css' href='css/style.php' />

Dentro de este archivo php, hay que indicarle el tipo de archivo que será, y para ello habrá que poner lo siguiente.

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

A continuación, lo que hacemos es indicar en el archivo style.php las variables que queremos utilizar.

<?php
header("Content-type: text/css; charset: UTF-8");
$brandColor = "#990000";
$linkColor = "#555555";
$CDNURL = "http://cdn.blahblah.net";
?>

Por último, lo que nos queda es utilizar las variables que hemos definido dentro de las propiedades de las hojas de estilos, como se muestran en el siguiente ejemplo.

#header {
background: url("<?php echo $CDNURL; ?>/images/header-bg.png") no-repeat;
}
a {
color: <?php echo $linkColor; ?>;
}
...
ul#main-nav li a {
color: <?php echo $linkColor; ?>;
}

Esto funciona bien en páginas estáticas, pero en una dinámica no funcionará, pero se puede hacer que funcione por medio de un archivo .htaccess. Lo que habría que hacer es dejar el archivo con extensión CSS, y parsearlo a php desde el archivo .htaccess de la siguiente manera.

<FilesMatch "^.*?style.*?$">
SetHandler php5-script
</FilesMatch>

Vía: Cssblog

Publicado por: angel carrero

Recomendar a un amigo

Compartir en redes

Email  

Comentarios