Hola, tengo una tienda en Prestashop 1.6.1.18 que utiliza el tema default-bootstrap.
Mi consulta es ¿cómo puedo cambiar el color del botón "añadir al carrito" en la página de producto?
Por defecto viene en color azul, aunque deseo mantener los efectos hoover, el color no me gusta. (Adjunto captura)
He tratado intentado editar el archivo /themes/default-bootstrap/css/product.css pero no consigo gran cosa.
Quizá pueda hacerse con algún código css? Agradeceré muchísimo vuestra ayuda
URL del sitio: Contenido solo visible a usuarios registrados
Hola,
Prueba a crear un fichero llamado customuser.css en el directorio css de tu plantilla e insertar el siguiente código:
.box-info-product .exclusive:hover { background-image: linear-gradient(#007ab7,#009ad0); }
Tendrás que cambiar los colores #007ab7 y #009ad0 que son el hexadecimal en azul.
Hola
He aplicado el código variando los colores, pero no cambia nada
Hola
Podrías probar con el siguiente código :
.box-info-product .exclusive{ background:none; background-color:red; }
Prueba agregar este código al final de algún archivo CSS que carga tu theme, por ejemplo global.css, no puedo decirte cual porque estas usando optimizaciones para CSS, desde Parámetros avanzados > Rendimiento desactiva la sección de CCC para estilos en caso no funcionen los cambios que haces.
Siempre que hagas este tipo de cambios mejor no optimizar tu sitio porque no verás los cambios que apliques, luego puedes habilitar optimizaciones.
Saludos.
Hola, los códigos los estoy probando en un prestashop 1.6.1.18 de prueba que tengo en un directorio protegido con contraseña para evitar la indexación.
En dicho prestashop de prueba están desactivadas todas las opciones CCC, lamentablemente el último código tampoco funciona.
Hola
El código funcionará siempre que este insertado correctamente.
Difícilmente podemos ayudarte si no podemos ver tu sitio, necesitamos ver el sitio en donde estas insertando el código para ver si esta correctamente o detectar que otro problema pueda suceder.
Ten en cuenta que si tienes un código erroneo CSS antes de insertar este código entonces no funcionará, por ejemplo es común que falten cerrar llaves en tu código anterior.
En resumen, habilita temporalmente tu sitio y envíanos la url exacta para revisar.
Saludos.
He habilitado el sitio, puedes revisarlo en:
http://prueba.compraraceiteargan.com/es/
Quiero cambiar el botón a un color naranja en vez del azul que trae por defecto
Hola
Prueba agregar el siguiente código al final del archivo global.css
body .button.ajax_add_to_cart_button span, body .button.ajax_add_to_cart_button, body #center_column.col-sm-9 .col-md-3 .box-info-product .exclusive{ background:none; background-color:blue; }
Cambia blue por un código de color, esto cambiará los botones de la lista y del detalle de producto.
Saludos.
Funciona a medias, pero creo que ya le he encontrado el truco para llegar al efecto que deseo. Gracias
El problema con el código anterior, es que cuando pongo el cursor sobre el botón se pone en color azul.
Cómo se puede modificar eso?
Hola,
En el fichero que te indico Jhon prueba con el código que te envié anteriormente:
.box-info-product .exclusive:hover { background-image: linear-gradient(#007ab7,#009ad0); }
Hola, el color ya ha cambiado pero los bordes y la línea central del botón siguen en el color azul por defecto.
Cómo puedo cambias esas líneas a color negro?
Hola,
Para los bordes puedes probar con el código:
.box-info-product .exclusive { border-top: 1px solid #0079b6; border-right: 1px solid #006fa8; border-left: 1px solid #006fa8; border-bottom: 1px solid #012740; }
Tienes que cambiar los colores hexadecimales.
Ok, muchas gracias