¿Como enmarcar modulos?

[Larenz]

Bueno voy a profundizar un poquito. Recordemos que Joomla trae estilos (CSS) pre-definidos a usar en cualquier plantilla. Ejemplos:

-> componentheading - para los títulos de las noticias.
-> pollstableborder - la tabla que enmarca las encuestas.
-> blog_more - estilo para enlaces a Mas Artículos.
-> moduletable - para los módulos.

Ahora, en cada módulo tenemos la opción de trabajar con sufijos; al igual que incluso en cada Item de Menú podemos trabajar con sufijos para mostrar una página.

Partiendo de la explicación de JahierFP, veremos que al mostrar un módulo normalmente se encerrará bajo la clase moduletable, y al agregarle un sufijo quedaría moduletable_sufijo. Veamos un ejemplo:

Código:

div.moduletable_enlaces {
    margin-bottom: 1em;
    padding: 0 10px 10px;
    border: 1px solid #CCC;
    background: transparent;
    color: #333;
}

Cabe señalar que los parámetros que definen el estilo no deben llevar un punto al comenzar el parámetro a como lo puso JahierFP. Eso es incorrecto. Ahora recordemos que los módulos tienen encabezados que están distinguidos por el tag h3, a los cuales también hay que definirlos o se verán distorsionados a la hora de presentarlos. Ejm:

Código:

div.moduletable_enlaces h3 {
    font-size: 115%;
    font-family: Georgia, "Times New Roman", Verdana, sans-serif;
    margin: 0 0 10px 0;
    padding: 10px 0;
    border-bottom: 1px solid #CCC;
}

Digamos que tu módulo contendrá enlaces y usarás las etiquetas ul y las etiquetas li éste sería un ejemplo:

Código:

div.moduletable_enlaces ul {
    margin: 10px 0 10px 0;
    background: none;
}

div.moduletable_enlaces ul li {
    padding: 3px 0;
    list-style-type: disc;
}

Esos son algunos ejemplos que ayudarán a entender la personalización individual de cada módulo.

Es necesario que sepan también que hoy en día muchas plantillas traen predefinadas ciertas opciones para sus módulos mediante archivos .php y .js y mediante la inserción de la carpeta html en la cual se agregan muchos datos para personalizar la presentación de módulos, secciones, categorías, etc.

Personalmente he editado las etiquetas o clases componentheading por los h1 para lograr una mejor semántica en el código. Esto se logra a como dije: agregando la carpeta html y agreando archivos adicionales. Mi objetivo no es explicar como hacer esto, sino comentarles que los estilos pueden verse afectados por estos cambios en una plantilla.