El Blog de Oscommerce

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.

Oscommerce es un script de comercio electrónico que normalmente no da problemas de tiempo de carga. Aunque siempre se puede mejorar, máxime cuando empezamos a modificar diseño, tener gran cantidad de productos e imágenes, etc. Aquí os dejo unos consejillos para mejorar el tiempo de carga de vuestro oscommerce.

1- Instalar contribución para thumbnails. Crea miniaturas de las imágenes de gran calidad y ahorra ancho de banda y transferencia.

2- Evita imágenes o flash de gran peso en cabecera.

3- Si usas el box de ofertas con scroll (scrolling specials) no pongas muchos artículos en la rotación, ya que ralentizará la carga.

4- Usa css para todo lo que puedas.

5- Comprueba el TTL de tu proveedor de hosting (con un ping). Intenta que sea inferior a 60.

Mejorar el tiempo de carga de nuestro oscommerce nos ayudará tanto a posicionar mejor como a mejorar la experiencia del usuario.

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í.