Avisos
Vaciar todo

Color de "añadir al carrito" e "ir a la caja"  

 
Ignacio
 Ignacio
Usuario experto

Buenas tardes,
querría cambiar el color de ambos botones ("añadir al carrito" e "ir a la caja"). He buscado en el foro y he encontrado un código que pienso podría valerme para alguno de ellos (cambiando los colores). Es el siguiente:
.product_list .product-block:hover .WhiteRounded{
background-color:green;
}

.product_list .product-block:hover .WhiteRounded:hover{
background-color : red;
}
¿Me valen? ¿De ser así?, ¿podría insertarlo en el recuadro "CSS personalizado" que hay en Ajustes del tema?
Gracias anticipadas,
Nacho

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 22/02/2016 7:45 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Primero agrega un archivo CSS personalizado :
https://www.webempresa.com/blog/agregar-archivo-css-personalizado-para-plantillas-gantry.html

Agrega el siguiente código para el botón de añadir al carrito

.woocommerce a.add_to_cart_button{
  background:red;
  color:white;
}

Sin embargo no he visto el botón de ir a caja , tendrías que indicarnos la url exacta

Saludos.

ResponderCitar
Respondido : 22/02/2016 10:24 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

Ignacio
 Ignacio
Usuario experto

Buenos días,
gracias por la respuesta. Lo he hecho y ya he podido cambiar el color. Pero donde realmente estoy interesado en hacerlo es en la pantalla en la que ya he seleccionado un determinado producto, dentro de la categoría; así como en la que aparece "ir a la caja". Como me solicitas os paso la url de cada caso:
Producto:
http://www.perfumablelifestyle.com/producto/cuaderno-perfumable-diseno-elegants/
Ir a la caja:
http://www.perfumablelifestyle.com/carrito/
Muchas gracias por todo,
Nacho

ResponderCitar
Respondido : 23/02/2016 9:29 am
Rafael
 Rafael
Miembro Moderator

Buenos días Nacho,

Entiendo que quieres cambiar color a:

En este caso, tan solo tendrías que usar: (colocar los colores que desees)

a.checkout-button.button.alt.wc-forward {
  background:red;
  color:white;
}

Adicionalmente, te sugiero te instales Firebug en el navegador Firefox, esto te ayudará a encontrar los estilos a cambiar: www.webempresa.com/blog/item/282-usando-firebug-para-modificar-la-apariencia-de-una-plantilla-joomla.html

Es recomendable tener algo de conocimiento de CSS para poder localizar mejor los estilos y los archivos afectados.

También te recomendamos estos libros gratuitos sobre CSS que te permitirán iniciarte en CSS, tienes el libro de introducción y el avanzado:

http://www.librosweb.es/

Saludos

ResponderCitar
Respondido : 23/02/2016 9:41 am

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Ignacio
 Ignacio
Usuario experto

Buenos días Rafael,
Muchas gracias por vuestra ayuda.
Saludos,
Nacho

ResponderCitar
Respondido : 23/02/2016 12:02 pm