Saltear al contenido principal

Modificar estilos en osCommerce

Empezamos un tutorial de como modificar la hoja de estilos de las tiendas osCommerce llamada stylesheet.css

Abrimos nuestra hoja de estilos con un editor de texto como el bloc de notas que trae por defecto windows, con dreamweaver o con topstyle.

Y nos encontraremos con las etiquetas que definen los estilos de nuestra tienda osCommerce.
body
TR.header
TR.headerNavigation
TD.headerNavigation
TR.footer
TD.footer
.infobox
.infoboxcontents
.infoboxheading

dentro de estos estilos tenemos parte del diseño de nuestra tienda virtual.
Empecemos a modificar nuestra tienda

En nuestra etiqueta «body» podemos darle un ancho predefinido a la tienda con margenes superior, inferior, derecho e izquierdo, medido en pixeles, por ej., añadamos un ancho a la tienda de 900px.
Las instrucciones, como ancho, alto,margenes, etc…, deben ir en inglés:
body { width:900px;}

podeis practicar añadiendo imagenes de fondo, cambiando el color de texto y de fondo….

Seguimos, imaginemos que queremos modificar el color de los enlaces en general, después del estilo «body» tenemos 2 estilos:
color del enlace:
A {
color:#0099FF;
text-decoration: none;
}
color del enlace cuando posicionas el ratón encima del enlace:
A:hover {
color:#33FFFF;
text-decoration: none;
}

Continuaremos en próximas semanas

Samuel

Consultor SEO, diseñador web, 2D y 3D, CSS. Apasionado de los gestores de contenido como oscommerce y wordpress, así como de la accesibilidad y usabilidad web. Vivo en Madrid, España. Sigueme en Twitter

Esta entrada tiene 3 comentarios
  1. Hola, estoy montando la tienda espiacenter.com y entre otros, tengo el problema de que intento darle color a la zona donde tendrían que salir las categorias (que por cierto, tampoco salen) ahora simplemente sale el fondo de la imagen que le he dado.

    me podrías ayudar?

    muchas gracias.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Volver arriba