Retomamos los artículos después de un tiempo de vacaciones.
Vamos a intentar ayudar a resolver dudas de como cambiar de posición o de orden un bloque, o simplemente hacer que este no aparezca.
Cualquier diseño de Magento está formada por un gran número de bloques que se muestran en las columnas de la izquierda o de la derecha, todo depende de la plantilla de Magento que estemos utilizando. Cambiar la posición, el orden o realizar cualquier operación con estos bloques es muy sencillo.
Toda la gestión de módulos, bloques y complementos de una página de Magento se gestiona desde unos ficheros de extensión XML que encontramos dentro del directorio “layout” de nuestra plantilla: /app/desgin/frontend/<tienda>/<plantilla>/layout/
Estos ficheros tienen la estructura de cualquier fichero XML: tenemos una serie de etiquetas anidadas correctamente de la forma <etiqueta>, cerrados correctamente, con un único elemento raíz (en este caso <layout>), sensible a mayúsculas y minúsculas, con posibilidad de asignar atributos o valores a cada una de nuestra etiquetas siempre dentro de comillas, etc… Más información sobre los ficheros XML.
Por lo tanto modificando los atributos de una etiqueta, o asignando nuevos, podemos modificar la apariencia y la estructura de la plantilla.
Por ejemplo, tenemos el bloque que se encarga de mostrar la caja para comparar productos y la caja para productos relacionados con el producto actual:
<reference name="right">
<block type="core/template" after="column_login" name="catalog.compare.sidebar" template="catalog/product/compare/sidebar.phtml"/>
</reference>
<reference name="left">
<block type="catalog/product_list_related" name="catalog.product.related" before="-" template="catalog/product/list/related.phtml"/>
</reference>
En este ejemplo encontramos que la etiqueta se llama <block> y que tiene una serie de atributos: type, after, name… Por supuesto cerramos la etiqueta con “/>” al final para respetar el estándar de codificación XML (también puede ser con </block>) Todo ello contenido dentro de una etiqueta llamada <reference>
¿Cómo cambio la posición de este bloque?
Para cambiar la posición del bloque nos fijamos en la etiqueta <reference> a la que tiene que pertenecer el bloque. En esa etiqueta encontraremos un atributo name que puede contener diferentes valores: left, right, header, footer, content… que como su nombre indica hace referencia a una zona de la plantilla de Magento.
Copiamos la línea de nuestro bloque y la pegamos en la nueva referencia donde queramos que aparezca.
Por ejemplo, en el caso anterior, si queremos mover la caja de comparación de productos, llamada catalog.compare.sidebar, la moveremos a la zona de referencia de la izquierda, quedando:
<reference name="left">
<block type="core/template" after="column_login" name="catalog.compare.sidebar" template="catalog/product/compare/sidebar.phtml"/>
<block type="catalog/product_list_related" name="catalog.product.related" before="-" template="catalog/product/list/related.phtml"/>
</reference>
Recargamos nuestra página (no hay que olvidarse de la caché de Magento) y tendremos los bloques colocados en otra posición.
¿Cómo modifico el orden de los bloques?
Es posible que al cambiar los bloques de columna estos no aparezcan donde nos interesa. Modificar el orden de los bloques de una zona se realiza indicando uno de los atributos “before” o “after” o los dos a la vez.
Para mostrar el bloque como el primero de todos utilizamos:
before=”-”
Para mostrar el bloque como el último:
after=”-”
Para mostrar el bloque antes de otro bloque:
before=”nombre-del-bloque”
Para mostrar el bloque después de otro bloque:
after=”nombre-del-bloque”
En nuestro ejemplo anterior vemos que:
<block type="catalog/product_list_related" name="catalog.product.related" before="-" template="catalog/product/list/related.phtml"/>
mostrará el bloque de productos relacionados el primero de la columna izquierda.
¿Y donde indico la página a mostrarlo?
Los ficheros XML que se encuentran dentro de la carpeta “layout” hacen refencia a diferentes secciones del diseño , por ejemplo el fichero catalog.xml hace referencia a todas las secciones de tipo catálogo.
Si analizamos el fichero encontraremos todas las páginas que forman parte del diseño del catálogo: <catalog_product_compare_index>, <catalog_product_view>… y el más importante <default>
Si queremos definir un bloque para toda la estructura general lo incluiremos dentro de <default>, si queremos que nuestro bloque sólo se muestre dentro de la vista del producto lo incluiremos dentro de <catalog_product_view>.
¿Y si quiero evitar que aparezca el bloque?
Se puede dar el caso de querer que aparezca un bloque en toda la profundidad (utilizando <default>) excepto en una zona en concreto. En este caso utilizaremos, dentro de la referencia concreta:
<remove name=”nombre-del-bloque”>
Y si queremos evitar que aparezca toda la columna o cualquier tipo de referencia:
<remove name=”right”>
<remove name=”left”>
…
Que es lo que se utiliza cuando tenemos un diseño de varias columnas y en páginas como el checkout no nos interesa mostrar columnas.
Un último apunte…
Una de las dudas que más me preguntan es porque sigue apareciendo un bloque en un sitio aunque se le haya modificado la ubicación. Esto puede ser porque no hemos refrescado la caché desde el panel de administración o bien que dentro de las opciones de CMS la página en cuestión tiene definido su propio layout y contiene un bloque que sobreescribe lo que se le indica desde el fichero XML.
02 Octubre 2009
Tags: añadir, bloques, eliminar, layout, modificar, mover, xml
Categorías: Magento, Programación