Caminando con Pier #5 - Creando una págína con estructura

En el post anterior habíamos visto como agregar páginas y blogs a nuestro sitio. Sin embargo, algo falta para que pueda se considerado "operativo" (además de un estilo propio, claro): en general, todas las páginas de entrada a un sitio tienen una estructura particular, en donde presentan distintos datos: bienvenida, novedades, etc. 

En mi caso, para este ejercicio, quiero que mi punto de entrada quede así: 

Sin tomar en cuenta el estilo, que es un poco exagerado -a propósito-, necesito darle cierta estructura a la página.

Por suerte, para este ejemplo, el header, logo y menú ya lo tengo por defecto, con la configuración estándar de Pier.
Entonces, lo que se necesita es crear la estructura interna: los tres paneles (animation, news y others).

Crear esta estructura, con ciertas limitaciones, es bastante simple:

Selecciono el “Home”.

Del sidebar, selecciono “Edit”.

Cambio el título por: “¡Bienvenido!”
En los contents, ingreso la estructura XHTML con la que desee ver la página:

Después, es tan simple como agregar las páginas o componentes internos seleccionando los componentes, para lograr una estructura de la forma que queramos.

Detalle: Embeber componentes en Pier.
Esta es una de las características (features) únicas en Pier: embeber componentes. Esto es tan simple como poner entre “+” el nombre del componente a embeber, por ejemplo: +welcome+, +news+. Luego, será tan fácil como hacer click sobre los links generados y seguir el wizard de adicion de componentes, para obtener un componente embebido.
Además, es posible agregar componentes ya existentes (indicando el path, por ejemplo: ++).
Es importante destacar que esta es la forma en la que uno insertaría imágenes o links a documentos descargables: se embeben como cualquier componente, y luego se selecciona “File” como tipo de componente.

Problema: Según el diseño de las páginas de Pier, todas llevan un título. Para armar estructuras a veces es deseable no poner un título (veamos por ejemplo el diseño con el que estoy trabajando), pero no hemos encontrado una forma elegante de ocultarlo o eliminarlo. Hay, sin embargo, algunos workarounds:
Lo más fácil es simplemente cambiar el CSS para el título (H1), y ponerle “display: none” o alguna de las otras formas.
Es posible modificar la estructura desde Squeak, para sacarle el título.

Para completar la estructura, hago click sobre cada componente y ingreso el contenido:

• banner, tiene una imagen (animada, idealmente, pero por ahora no tengo). Despues del click, selecciono tipo File y subo la imagen que quiero usar. 
• news, es una página embebida, con un listado de novedades (cubriremos esto en el proximo post), por ahora simplemente la agrego como una página: luego del click, selecciono tipo Page y salvo. 
  
• welcome, es, al igual que news, una página embebida, pero con contenido (debo poner un mensaje de bienvenida, ¿no?). Para obtener esto repito lo hecho para las novedades, pero agrego como contenido el texto que quiero. 

Con eso, la página queda así. De más esta decir que, con un diseño (y un diseñador adecuado), quedaría muy pero muy bien, pero eso queda para un post mas adelante.

En la próxima entrega (con un poco de suerte mañana mismo ;)), mostraré como construir la página de novedades. 

¡Hasta luego!