Cambiar CSS dinámicamente. (CSS Switching)
Marzo 28th, 2004
En el menú de la página principal del blog aparecen unos links a diferentes estilos de la página web. El culpable de estos cambios de página no es la propia página en si, puesto que el código es exáctamente el mismo, son los CSS o Cascade Style Sheets, hojas de estilo para que nos entendamos de aquí en adelante.
En rosanegra, el cambio de un estilo a otro queda reflejada en una cookie, que hará q cuando vuelvas a visitar la página, o visites las entradas individualmente, te conserver tu elección hasta que decidas lo contrario.
A continuación explicaré en pasos el proceso que he seguido:
Primer Paso: Crear un script en php que me permita cambiar de hoja de estilo.
Lo más normal sería hacer
<?php
setcookie (’sitestyle’, $set, time()+31536000, »
‘/’, ‘rosanegra.org’, ‘0′);
header("Location: $HTTP_REFERER");
?>
Sin embargo este código no es nada seguro y por eso he elegido mejor esto:
<?php
$set = $_GET['set'];
$set = preg_replace(’#[^a-zA-Z0-9_-]#’, ”, $set);
setcookie (’sitestyle’, $set, time()+31536000, ‘/’, ‘www.rosanegra.org’, ‘0′);
header(’Location: ‘.$_SERVER['HTTP_REFERER']);
?>
Al archivo se le llama switcher.php , y se sube a la raíz. Es el encargado de colocar la cookie en el ordenador del visitante elector.
Segundo Paso:
Suponiendo que tengamos dos hojas de estilo, styles-site y styles-site2:
<a href="./switcher.php?set=styles-site2">Landscape</a><br>
<a href="./switcher.php?set=styles-site">Cityscape</a>
Estos van a ser los enlaces que van a ver y seleccionar a las diferentes hojas de estilo.
Tercer Paso:
Hay que enlazar la hoja de estilo a la página. Entre <head> y </head> colocamos lo siguiente:
<link rel="stylesheet" type="text/css"
media="screen" title="User
Defined Style" href="<?php echo
(!$sitestyle)?’styles-site’:$sitestyle ?>.css">
En caso de querer poner el enlace completo hasta la hoja de estilo ponemos la dirección antes del
<?php:
<link rel="stylesheet" type="text/css"
media="screen" title="User
Defined Style" href="http://www.rosanegra.org/directoriocss/<?php echo
(!$sitestyle)?’styles-site’:$sitestyle ?>.css">
Evidentemente hay que seleccionar una hoja de estilo para aquellos que no tienen la cookie instalada en el ordenador, en este caso, la hoja de estilo por defecto es styles-site.
6 Responses (Add Your Comment)
-
-
Bonito mogway
-
Un truco cojonudo: pr
-
No me funciono
-
Yo veo un problema: si la página en cuestión utiliza variables para mostrar el contenido (por ejemplo, una página joomla, que es en la que estoy trabajando ahora) utilizar estos enlaces te saca de donde estabas.
Hacerlo con javascript también tiene un problema: no es accesible si javascript no está activado.
Cómo solucinarías ésto en php?
Saludos,
María
Interesante art