Hoy conoceremos brevemente cuales son los elementos wrapper de una plantilla , lo cual nos ayudará posteriormente a la personalización de tu plantilla (sobre todo para CSS).

Los contenedores siguen una estructura de envolventes, una jerarquí­a, como se muestra en la imágen de abajo. 

El outer-wrapper es el envoltorio principal del blog, el mayor, el que define el ancho total (de pereferencia no debe exceder los 960 pí­xeles de modo que se eviten scrolls horizontales, aíºn usando la extensión All in one sidebar de Firefox que recorta espacio horizontal) y demás parámetros.

El header-wrapper es el que contiene al encabezado, nuestro logo, etc. Evidentemente el ancho de éste y los demás elementos principales que contiene el outter-wrapper debe ser menor o igual a éste, sino se producirán errores de overflow sobre todo en Internet Explorer.

content-wrapper es el contenedor de contenido, no me refiero al contenedor de los posts, sino a uno mayor que engloba al sidebar y a los posts. Al igual que el header-wrapper su parámetro de ancho (width) debe ser menor o igual al del outer-wrapper.

El main-wrapper es el contenedor de los posts, aqui por ejemplo puedes elegir un color de fondo para todo este campo o los márgenes respecto a los lí­mites del content-wrapper o los paddings, etc.

El sidebar-wrapper es el contenedor del sidebar, aquel donde se encuentran contenidos todos nuestros widgets y/o elementos que hemos incoporado en forma de código html, javascript, imágenes o similares. Aqui suelen configurarse (dentro) el estilo de las listas (por ejemplo para las entradas o el archivo, el blogroll o los enlaces, etc.)

El footer-wrapper es aquel contenedor inferior del blog donde se publican los créditos del theme, el hosting, licencias, autores, etc.

Como puedes haberte dado cuenta la estructura de una plantilla no es compleja,  estoy seguro que con estas definiciones podrás hacer algunos cambios en el código CSS.

Enlace | TecnologiaDiaria

Entradas Relacionadas