Eligiendo el Skin para las plantillas de email en Magento

Una de las virtudes de Magento, es que a nivel funcional tiene cubiertos tantos temas que pareciera que uno no necesita nada más.

Una de sus contras, es que al momento de necesitar una mínima personalización, uno puede terminar sintiéndose perseguido por una multitud de líneas de código corriendo en círculos.

Hoy vamos a ver un pequeño truco, detalle, …… (complete la línea punteada con la palabra que mejor le resulte); que sirve para indicarle a la plantilla, de qué skin tomará las imágenes que se mostrarán en el caso de las plantillas html.

Si ya les tocó tener que personalizar esas plantillas, es probable que hayan visto dentro del código que imprime el logotipo, una línea parecida a la siguiente.

<td valign="top"><a href="{{store url=""}}"><img src="{{skin url="images/logo_email.gif" _area='frontend'}}" alt="Magento"  style="margin-bottom:10px;" border="0"/></a></td>

Un repaso rápido de las variables usadas:

  • {{store url=»»}} es el base_url de la tienda. Por ejemplo: http://www.mitienda.com.ar/
  • {{skin url=»…»}} transforma el source de la imagen a http://www.mitienda.com.ar/skin/frontend/default/default/ y le concatena images/logo_email.gif. Nos quedaría la siguiente url: http://www.mitienda.com.ar/skin/frontend/default/default/images/logo_email.gif.
  • {{skin url}} aplica una directiva: _area=’frontend’. Como vimos en el punto anterior, la imagen es tomada desde …/skin/frontend/. Si el valor de _area lo cambiamos por _area=’adminhtml’, el template buscará la imagen dentro del contenido del skin default/default del backend.

Hasta acá tenemos lo que a simple vista se ve y más o menos podíamos suponer.

Para la variable {{skin url}} tenemos dos directivas adicionales, no documentadas, que nos dan un poco más de flexibilidad. Un ejemplo podría ser:

<img src="{{skin url="images/logo_email.gif" _area='frontend' _package='paquete' _theme='tema'}}" alt="Magento"  style="margin-bottom:10px;" border="0"/>

Las dos «nuevas» directivas funcionan de la siguiente manera.

  • _package=’paquete’ determina de que paquete del skin se está hablando. Recuerden que los skins pueden estar conformados por múltiples paquetes con múltiples temas cada uno. Si usáramos como skin default/blue, default sería el paquete y blue el tema.
  • _theme=’tema’ hace exactamente lo mismo pero, obviedad mediante, a nivel tema.

De ésta forma, podríamos estar usando un skin determinado para nuestra tienda, y podríamos usar imágenes de otro skin en nuestros templates. En realidad, podríamos hacer tantas combinaciones y configuraciones como complicaciones o requerimientos nos lleguen.