style o link ?

[uamistad]

Saludos !

Tengo una página que se compone de varios módulos:

======== EJEMPLO ============

cabecera

modulo comentarios

modulo publicidad

pie

============================

Cada uno de los módulos lleva sus estilos, pero ninguna de las siguientes formas me ha convencido, me gustaría poder hacer que cada módulo tuviera sus estilos, pero no incluirlos en el código fuente, sino que se pudiera usar una ruta relativa o absoluta para poder indicar en dónde se encuentra la hoja de estilos. Probé con las siguientes, pero ninguna cuadra:

Alternativa 1 (sirve pero no cumple estándares)
Cada uno tiene sus propios estilos CSS. Pensé en poner un link a cada uno, pero el validador HTML me dice que para que cumpla con el estándar, la etiqueta LINK no puede ir en el BODY, así que no puedo incluir el módulo junto con su hoja de estilos.

Alternativa 2 (sirve pero llena la página de basura)
Otra que probé fue usar la etiq. de STYLE en cada módulo y funcionó, pero al ver el código fuente se puede ver el contenido de la hoja de estilos y no quiero eso porque no es más que basura para un buscador.




¿Alguna otra forma posible? Por ejemplo, sería válido usar STYLE junto con el atributo SRC para darle una URL ? alguna sugerencia ?

Thanks !!

[AlvaroG]

pero.... ¿no probaste poner las llamadas a las diferentes hojas de estilo una a continuación de la otra en la cabecera de la página principal?

algo como

<link rel="stylesheet" href="hoja1.css" .... />
<link rel="stylesheet" href="hoja2.css" .... />
<link rel="stylesheet" href="hoja3.css" .... />

Si se contradicen, pos le podés poner cada módulo dentro de un <div> y asignarle una clase.....


Saludos.

[uamistad]

Así como lo mencionas tú funciona, pero pues yo quería mantener el 'módulo' completo y no separar unos pedazos aquí y otros allá.

Pensaba por ejemplo mantener todo el módulo completo para quitar y poner con toda libertad, sin tener que, además, fijarme en que tengo que añadir en la cabecera determinado estilo.

Pero parece que no se puede, =(

Thanks =)

[JavierB]

Hola uamistad

No se si habré entendido bien tu duda podrías poner cada módulo dentro de un div:

<div id="uno">Módulo 1</div>
<div id="dos">Módulo 2</div>

y ponerles los estilos que necesites:

Código:

#uno {font-size:1em; color:red}
#uno a {text-decoration:none}
#dos {font-size:2em; color:green}
#dos a {color:yellow}

Saludos,

[uamistad]

No es que no hayas entendido, jeje, sino que no supe explicarme muy bien.

Es que mira, yo tomé como 'módulo' algo que como dices, bien puedo meter en un DIV.

Lo que hice al principio fue lo que tú me sugieres y funciona, pero son varios módulos y cada uno tiene un montón de líneas de estilos y lo que pasó al final, fue que tenía una hoja de estilos llenísima de información que era dificil de mantener.

Luego pensé, ¿por qué no separar los estilos de cada módulo en hojas de estilo separadas?

Así lo hice y funcionó también, además el código es más fácil de mantener.

Pero como no estaba conforme aún (y como los módulos los incluyo dinámicamente) pensé que quizá podría incluir los estilos junto con el módulo y tener algo así:

Código:

<a link hoja-estilo-modulo-publicidad
<script codigo-javascript-del-modulo-publicidad
<p>aqui todo el código HTML y el contenido del modulo publicidad

Así, todo empaquetado, junto con pegado, jeje. El día que quisiera quitar un módulo, pues nada más quito una línea de código (la que llama al módulo), cuando lo quiera poner, pues pongo una sola línea de código también.

Si pudiera tener todo junto, como menciono, en cualquier parte de la web podría llamar al módulo publicidad mediante:

include("modulos/publicidad");

Mega-Fácil.

Pero pues no importa mucho, no salió como quería pero más malo sería que no hubiera podido hacerlo, =)

Podría tener todo junto si usara <style>aqui los estilos</style>, pero tiene el problema de que al ver el código fuente ahí se verán varias líneas de estilos y soy superticioso y pienso que no es buena idea mirando hacia un buen posicionamiento con el Tío Google.

Thanks anyway por su intervención, =)

[Jorolo]

Hola a todos, hola uamistad.

Espero haberte entendido.

Yo creo que buscando variantes de la alternativa 1 tienes varias opciones:

a- Si tienes un include que inserta el modulo en el body, crea otro include que inserte un link en el head... pregunta en el foro de php.

b- Otra solución más comoda es poner en el head los link necesarios para todos los modulos independientemente de que estén 'incluidos' o no.

[uamistad]

Me gusta la solución b, siempre y cuando se cacheen para que no se estuvieran re-cargando a cada instante.

Entre todas no dan más de 30kb, así que no será un abuso que se carguen todas con la primera visita del internauta.

Creo que tendré que quitar todas esas cabeceras de no-cache y manejarlo por if-modified-since.

Vale, te la compro .

[Hereje]

Hola uamistad.

¿Dónde defines los modulos y sus configuraciones?
Tan solo deberias agregar las hojas de estilos y scripts como una propiedad más, por ejemplo:

Código PHP:

  <?php 
$conf['inicio'] = array( 
    'nombre' => 'Inicio', 
    'smodulos' => array( 
        'inicio' => array( 
            'archivo' => 'inicio.inc.php', 
            'css' => array( 
                0 => array('archivo'=>'inicio.css', 'media'=>'all') 
            ), 
            'js' => array('inicio.js','dos.js') 
        ), 
    ), 
    'layout' => 'sinmisc.inc.php' 
); 
?>   

Ahora cuando armas el layout del encabezado:

Código PHP:

 <head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
 
<link rel="stylesheet" type="text/css" href="/layouts/css/comun.css" media="all" /><!-- siempre se incluye --> 
<?php 
if(isset($conf[$modulo]['smodulos'][$smodulo]['css'])) 
    foreach($conf[$modulo]['smodulos'][$smodulo]['css'] as $css) 
        echo "\t<link rel=\"stylesheet\" type=\"text/css\" href=\"$path_includes{$css['archivo']}\" media=\"{$css['media']}\" />\n"; 
?> 
 
<script type="text/javascript" src="/layouts/js/comun.js"></script><!-- script común que siempre se incluye --> 
<?php 
if(isset($conf[$modulo]['smodulos'][$smodulo]['js'])) 
    foreach($conf[$modulo]['smodulos'][$smodulo]['js'] as $js) 
        echo "\t<script type=\"text/javascript\" src=\"$path_includes$js\"></script>\n"; 
?> 
 
<title>...</title> 
</head>  

Mmmm..., me parece que armé mucho lio!
Jeje, bueno, espero sirva por lo menos de alguito. Saludos!

[uamistad]

$conf[$modulo]['smodulos'][$smodulo]['js']

Tú sí andas en otro nivel, maestro. Ya la cuarta dimensión no la percibo ni con chochos, =)