El Blog de Oscommerce

Son redundantes las consultas sobre cómo modificar los emails que Oscommerce manda por defecto (en alta de clientes, al realizar un pedido, con el formulario de contacto, etc). Cuando se requiere un tipo de correo más elaborado, con html, archivos adjuntos, etc, me gusta programarlo manualmente usando phpmailer. Sin embargo no todas las tiendas virtuales Oscommerce necesitan tanta elaboración en sus correos, por lo que casi siempre es suficiente con instalar alguna contribución que proporcione un mayor diseño al mismo.

Con la contribución U HTML Emails lograréis un diseño de correo electrónico bastante resultón. Miremos cómo queda un email estandar de Oscommerce:

Y ahora cómo quedaría el mismo email con U HTML Emails:

Como se puede ver el resultado es mucho más vistoso y profesional. Como dato importante, recordad que ciertos webmails tienden a marcar como spam los correos enviados automáticamente sin la cabecera completa, y si además mandamos el email con HTML, todavía más facilidad para que nuestros correos acaben en la carpeta de spam. Es importante avisar al cliente para que la revise por si se da el caso.

Contribución: U HTML Emails

Oscommerce por defecto muestra los listados de productos en filas de una sola columna:

Sin embargo, muchos prefieren mostrar dichos listados de productos en columnas. Para ello os recomiendo descargaros la contribución   con la que podréis lograrlo fácilmente. Básicamente se trata de sustituir un archivo y listo. Dependiendo de la versión que te descargues podrás controlar el número de columnas editando el código (sólo hay que cambiar un número) o directamente desde el panel de administración de Oscommerce. Una vez instalada lograremos mostrar los productos en varias columnas:

Contribución: Product Listing in Columns

Para aquellos que se hacen un lío a la hora de cambiar colores en Oscommerce voy a dejaros aquí dos trucos muy sencillos y efectivos.

1- En Firefox instala Colorzilla, un addon que te permitirá capturar los colores de la pantalla con un clic de ratón.

2- Selecciona el color que quieres cambiar en tu oscommerce (de un box, un tipo de letra, etc).

3- Edita stylesheet.css, busca el color y pon el que te guste.

Este primer truco tiene una pega, y es que los colores pueden repetirse varias veces en la hoja de estilos de Oscommerce. Así que mejor complementamos con este segundo truco.

4- Instala Firebug, un plugin que permite analizar el código de una web.

5- Inspecciona el elemento que quieres cambiar de color. Mira los estilos que le dan el color.

6- Busca el estilo en stylesheet.css y cámbialo.

Con estos dos complementos para firefox cambiar el aspecto de vuestro Oscommerce debería resultaros mucho más cómodo. Para los que no sepan cómo funcionan o cómo se instalan estos complementos os recomiendo que le echéis un vistazo a este vídeo tutorial sobre cómo instalar y usar firebug. Cuando tenga listo uno sobre cómo instalar y usar filezilla actualizaré esta entrada.

Uno de los temas que más problemas da cuando se está rediseñando Oscommerce es el control del ancho de las columnas. El problema reside en que pocos usuarios conocen cómo crea oscommerce los box que forman las columnas, y por eso les cuesta adaptarlas a su gusto.

El ancho de los box y columnas viene inicialmente determinado por una constante WIDTH que se encuentra definida dentro de includes/application_top. Editando este archivo y cambiando el tamaño de dicha constante veréis cómo aumenta o disminuye el ancho de las columnas. También hay que tener en cuenta que los box de las columnas son generados usando una clase en php que podéis encontrar en includes/classes/boxes.php y también podéis modificar para darle otro aspecto (cambiar valores de cellpadding, cellspacing, etc). Si optáis por poner imágenes que no sean de fondo en las cabeceras de los box estas imágenes deben tener el tamaño adecuado o pueden llegar a descuadrar el box y hacer tu columna más ancha. Por último con stylesheet.css podéis modificar los colores que forman los box para ponerlos a vuestro gusto.

Si queréis tener algunos box con un estilo diferente al de los demás, podéis duplicar el código correspondiente en la clase boxes.php, modificarla y aplicarla a los box que queráis que sean diferentes. Y con un poco de programación podéis ayadir diferentes imágenes de fondo, colores distintos en cada línea del box, etc. El límite está en vuestra imaginación.

Todos los que me conocen saben que cuando uso Oscommerce para crear una tienda virtual nunca uso plantillas. Las plantillas o templates no siguen el orden de programación de Oscommerce, tienden a hacer cosas como poner la columna izquierda integrada en la cabecera y cositas por el estilo. Y luego cuesta el triple instalar cualquier contribución. Muchos piensan que el diseño de Oscommerce está limitado, o que no es moderno. Para los que piensan así hoy quiero mostraros la última tienda virtual que hemos echo basada en Oscommerce. Se trata de quimipool.com, una tienda virtual para el mundo de las piscinas.

Mirad el diseño bien. Dos columnas, cabecera y pie de página. Típico de Oscommerce, pero mejorado a mano. Hemos instalado muchas contribuciones y programado muchas otras cosas manualmente, pero en tema de diseño nos hemos ceñido al que trae Oscommerce por defecto. Y personalmente creo que nos ha quedado muy bien. Sencillo, funcional y no daña la vista

Con esto quiero animar a todos los que usáis Oscommerce a que no os dejéis convencer cuando os dicen que uno de los puntos flacos de Oscommerce es el diseño. Cierto que el que trae por defecto es bastante vulgar, pero mirad lo que puede lograrse sabiendo aprovechar Oscommerce adecuadamente. Espero que os guste el diseño tanto como a mí.