Hace unos días comentabamos que Sandbox era el theme semántico por excelencia, pero…
¿por que es tan semántico?
Sandbox, usa el atributo class de los elementos para informar una cantidad de datos referentes a una página y/o entrada concreta. Esto nos da lugar a elementos HTML similares a este.
<body class="wordpress y2007 m08 d06 h06 home">Como podemos ver, todas esta información está cargando una cantidad de información semántica no visible al usuario bastante importante, pero…
¿Como podemos hacer que el usuario la vea?
Evidentemente podemos aprovecharnos de nuestros CSS para hacer que cada elementos concreto se vea de una forma determinada, para ello usaremos definiciones de todas las clases. Que como es obvio, deberemos conocer 😀
¿Como se generan las clases?
Dependiendo del lugar que mostramos, las clases se generan mediante una función u otra determinada. Estas funciones definen una serie de nombres de clases basadas en algunas estáticas y otras dinámicas que van cambiando dependiendo de la fecha, el autor, la categoría,…
Actualmente son 3 las que se encargan de esta misión:
sandbox_body_class() | Clases del elemento <body>
Esta clase nos devuelve una serie de clases dependiendo de la página que estamos mostrando, todas las clases están relacionadas con la página y la fecha actual.
<body class="<?php sandbox_body_class() ?>"> | wordpress | Está clase indica la aplicación |
|---|---|
| home | Indica que estamos en la home |
| search | Indica que estamos en busqueda |
| four04 | Indica que estamos en una página «404 no encontrado». |
| loggedin | Cuando el usuario está logueado |
| y[current year] | El año actual |
| m00–12 | El mes actual (00-12) |
| d01–31 | El día actual (01-31) |
| h00–24 | La hora actual (00-24) |
| page | Indica que estamos en una página |
| page-author-[name] | Indica que estamos en la página de autor [name] |
| page-paged-[n] | Indica que se trata de una entrada paginada y estamos en la página [n] |
| archive | Indica que estamos en una página de archivo (categorias, archives,…) |
| date | Indica que estamos filtrando por date |
| date-paged-[n] | Indica que se trata de una entrada paginada basada en fechas, estamos en la página [n] |
| author | Indica que estamos en la página autor |
| author-[name] | Indica que estamos en la página del autor [name] determinado |
| author-paged-[n] | Indica que estamos en la página del autor paginada |
| category | Indica que estamos en una categoría |
| category-[name] | Para una categoría determinada |
| category-paged-[n] | Paginación de categorias |
| single | Se trata de una entrada single |
| s-author-[name] | Una entrada simple de un autor determinado |
| s-category-[name] | Una entrada simple de una cateogoría determinada |
| s-y[current year] | Una entrada simple de un año determinad |
| s-m00–12 | Una entrada simple de un mes determinado |
| s-d01–31 | Una entrada simple de un día determinado |
| s-h00–24 | Una entrada simple de una hora determinada |
| paged | Está paginada |
| paged-[n] | Mostramos la página [n] |
| pageid-[n] | Mostramos la página con ID [n] |
| postid-[n] | Mostramos el post con ID[n] |
sandbox_post_class() | Clases del elemento <div /> de Posts
Esta función nos carga todas las clases referentes al post en concreto, las fechas hacen referencia las de publicación, al igual que las categorías y autor.
<div id="post-<?php the_ID() ?>" class="<?php sandbox_post_class() ?>">| hentry | Para la especificación hAtom 0.1, se aplica a cada post. |
|---|---|
| page | Clase general, se aplica a cada página |
| post | Clase general, se aplica a cada post |
| private | Para un post en estado privado |
| protected | Para un post en estado protegido |
| publish | Para un post en estado publicado |
| draft | Para un post en estado borrador |
| y[post year] | Para un post publicado en un año concreto |
| m00–12 | Para un post publicado en un mes concreto |
| d01–31 | Para un post publicado en día concreto |
| h00–24 | Para un post publicado en una concreta |
| author-[name] | El nombre del autor |
| category-[name] | La categoría del post |
| alt | Para los posts impares (posibilita hacer efecto zebra) |
| p[n] | Numero de post relativo a la página |
sandbox_comment_class() | Clases para los comentarios <li />
Esta función nos mostrará todas las clases referentes al comentario concreto, las fechas estarán condicionadas a la de publicación, al igual que el autor.
<li id="comment-<?php comment_ID() ?>" class="<?php sandbox_comment_class() ?>">
| comment | Clase general, indica que es un comentario |
|---|---|
| trackback | Clase general, indica que es un track/pingback |
| byuser | Para cada comentario de un usuario registrado |
| bypostauthor | Comentario del autor del post |
| comment-author-[name] | Para un comentario concreto de un usuario registrado |
| alt | Para los comentarios impares (posibilita hacer efecto zebra) |
| c-y2007 | Para un comentario en año concreto |
| c-m00–12 | Para un comentario en un mes concreto |
| c-d01–31 | Para un comentario en un día concreto |
| c-h00–24 | Para un comentario en una hora concreta |
| c[n] | Numero de comentario relativo a la página |
| t[n] | Numero de track/pingback, relativo a la página |
9 comentarios, 0 referencias
+
#