En la séptima clase del curso de Underscores, trabajaremos con la página de blog, donde se muestran todas las entradas, y con los posts individuales.
7.1 - Funcionalidad
Llegamos a una de las partes más importantes de cualquier theme de WordPress: definir cómo deben ser los templates de blog y de posts. En este caso, lo primero que tenemos que hacer es definir la forma en la que queremos que se muestren estos dos templates.
En primer lugar, en la página de blog, queremos que cada entrada cuente con su imagen destacada, título y excerpt, por ese orden, y sin ningún otro elemento añadido.
Y, en segundo lugar, necesitamos que los posts muestren el título, la meta información, imagen destacada, contenido y la categorización al final, también en ese orden. Al final, también debemos encontrar los comentarios y su formulario.
Para ello, trabajaremos con el template part "content", el cual programaremos con condicionales para que muestre en cada caso solamente lo que nos interesa. ¡Empecemos!
7.2 - Maquetación
Una vez lista la funcionalidad de estos dos templates, llega la hora de darle estilos, o sea, "ponerlo bonito" para que quede como el diseño inicial que hemos planteado.
Lo primero que vemos es que gracias a la utilización de clases e id’s comunes, buena parte del trabajo ya está hecho, puesto que el blog ya está prácticamente maquetado. Y lo poco que le queda, más la maquetación de los posts, es lo que vemos a continuación. ¡Empecemos!
¡Hecho! ¿Te das cuenta de la potencia de las condicionales? Hemos sido capaces de gestionar tanto el blog como los posts desde un único template.
De este modo, nos ahorramos tener que crear un template para cada uno. Ojo, no existe una forma mejor o más correcta de trabajar. Simplemente, es bueno conocerlas todas y poder decidir cuál utilizar en cada caso.
En la siguiente lección, la octava del curso, daremos estilos a dos de las páginas que todavía nos faltan: Quién soy y Contactar. ¡Nos vemos en ella!
Todos los capítulos de este curso:
- Curso de Underscores #1. Introducción
- Curso de Underscores #2. Estilos generales
- Curso de Underscores #3. Header y footer
- Curso de Underscores #4. Widget areas
- Curso de Underscores #5. Homepage
- Curso de Underscores #6. Portfolio
- Curso de Underscores #7. Blog y posts
- Curso de Underscores #8. Páginas de «Quién soy» y de «Contactar»
- Curso de Underscores #9. Página de resultados de búsqueda y de error 404
- Curso de Underscores #10. Adaptación responsive