• Resuelto joseemanuelrr

    (@joseemanuelrr)


    Buenas tardes amigos, tengo una duda con respecto a los productos variables.

    Quisiera cambiar el color del precio (desde – hasta) con CSS, ya logre cambiar el tamaño, pero no he podido cambiar el color sin afectar el color de todos los precios.

    Imagen ejemplo

    En la imagen adjunta es el que está en Azul, y el que está en rojo lo pude cambiar sus propiedades con la siguiente clase.

    .woocommerce-variation-price span.amount

    • Este debate fue modificado hace 5 años, 9 meses por joseemanuelrr.

    La página con la que necesito ayuda: [accede para ver el enlace]

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • Simplemente tienes que hacer un selector css un poco más específico.

    El HTML de las páginas de producto cambia de unos temas a otros, pero el bloque de arriba con el título y el primer precio suele se un div con la clase product_title o entry-title, así que tu CSS sería algo así:

    .entry-title .woocommerce-variation-price .amount {
    	color: red;
    }

    Espero que te sirva, no puedo hacer nada más con la web cerrada.

    Iniciador del debate joseemanuelrr

    (@joseemanuelrr)

    Muchas gracias por tu respuesta amigo, el codigo que me compartiste hace lo mismo que el código que puse arriba, lo que quisiera en esta ocasión es cambiar el color de los precios (desde-hasta), en la imagen adjunta arriba es el que está dentro del círculo Azul.

    Ya puedes tener acceso, te pondre el link de un producto variable aqui Producto variable

    Vale, ya he visto el problema, el precio de arriba (el desde-hasta) no tiene un selector específico. Lo más sencillos es que cambies los dos y luego arregles el de abajo:

    /* con esto pones todos los precios del cuadro en rojo */
    .summary-inner .price, .summary-inner .price span {
        color: #f00;
    }
    
    /* con esto le devuelves el verde al precio de abajo */
    .summary-inner .woocommerce-variation-price .price span {
    	color: #cbd248;
    }
    Iniciador del debate joseemanuelrr

    (@joseemanuelrr)

    Muchas gracias amigo! me funciono, pero tambien se me cambian los estilos de los precios en los productos simples

    No se podrán encapsular solo a los productos variables?

    Muchas gracias por tu tiempo amigo

    Sí claro, lo puedes ir haciendo tan específico como necesites:

    /* con esto pones todos los precios del cuadro en rojo */
    .product-type-variable .summary-inner .price,
    .product-type-variable .summary-inner .price span {
        color: #f00;
    }
    
    /* con esto le devuelves el verde al precio de abajo */
    .product-type-variable .summary-inner .woocommerce-variation-price .price span {
    	color: #cbd248;
    }
    Iniciador del debate joseemanuelrr

    (@joseemanuelrr)

    Muchas gracias por tus respuestas amigo, me fueron de muchísima ayuda, ahora tengo una pregunta parecida para con el carrito de compras.

    Gracias por tu tiempo, cierro tema. 🙂

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • El debate ‘Duda con clases CSS de productos variables’ está cerrado a nuevas respuestas.