[Support request] Problemas de estilos con botón

[Pedro]

Hola! Recientemente he comprado un plugin que coloca un botón de “comprar ahora” en la página de producto.

El enlace del plugin es este: https://quadlayers.com/portfolio/woocommerce-direct-checkout/

Después de configurarlo y activarlo en mi sitio, el botón de “comprar ahora” se muestra en la página de producto.

Sin embargo, por más que intente cambiar el CSS para cambiar el color del botón, no ocurre ningún cambio.

Me he puesto en contacto con el desarrollador del plugin y me dijo que el plugin incluye la clase para personalizar el botón.

Aquí me envió esta captura de pantalla: https://snipboard.io/vQF23s.jpg

Me dijo que tenía que hablar con ustedes para ver por qué el tema no está incluyendo el CSS.

Aquí les dejo un enlace de producto para que puedan revisar: https://www.rebajaslocas.com/producto/blanqueador-dental-carbon-activado/

Les pido por favor me ayuden a arreglar esto.

Muchas gracias!

[Pedro]

He tenido que desactivar el botón porque me estaba causando problemas con las compras.

[Leo]

Hi there,

I’m not sure what he meant by “He said he had to talk to you guys to see why the topic isn’t including CSS.”?

A screenshot doesn’t help for issues like this unfortunately.

Can you activate the button so I can see what’s going?

Might be good to start a staging site if you can’t activate it on the live site.

[Pedro]

Hola Leo,

Gracias por responder. Ya he habilitado nuevamente el botón en el sitio.

El desarrollador me dijo que me contactara con el soporte de GeneratePress (wordpress theme) porque no está incluyendo el CSS personalizado para ese botón.

Aquí puedes hacer pruebas con el botón: https://www.rebajaslocas.com/producto/blanqueador-dental-carbon-activado/

[Leo]

Are you talking about this button here?
https://www.screencast.com/t/uiU9J2jeD

What’s wrong with it? It’s missing a CSS class? The theme itself definitely cannot cause that to happen.

Have you tried clearing your WP Rocket cache first and disable it for now?

[Pedro]

Hola Leo,

Por favor recarga la página, deberían aparecerte dos botones (“añadir al carrito” y “comprar ahora)

El botón del problema es “comprar ahora”

Ya he probado desactivando wp rocket y limpiando cache.

[Leo]

Ok now I see it:
https://www.screencast.com/t/Azlh2qGv8

But what’s wrong with it?

Can you disable WP Rocket so I can take a closer look of the code/source?

[Pedro]

Hola Leo,

El problema es que he agregado un CSS para cambiar el color del botón, pero no se efectua ningun cambio.

Aquí te muestro:

Añado CSS en el personalizador de WordPress: mega.nz/file/TsMyEQIS#B2aC-GbSuy2kPHs7-LGeBteWdMCnRaejMW_9qkS9_YA

Y aquí en la configuración del plugin añado esa clase: mega.nz/file/bpckmQwZ#9iFpvkMrL4J_UCnAaNzo1nZXYrROB5Uc0iQMCXP92dI

Pero a pesar de eso, el botón no cambia de color, como si el CSS no funcionara: mega.nz/file/q9UwFaCL#9RFsg6SdZku_swANdyu3Ut43vd0RrxPFv-1fnsynAjY

He desactivado temporalmente WP Rocket.

[Leo]

Hard to believe that the plugin author would blame the theme for this.

Add !important to your CSS should work:

.my-custom-button-class {
    background: #000 !important;
    color: #fa8c0f !important;
}

[Pedro]

Hola Leo,

Yo también les dije eso, pero me dijeron que el problema era GeneratePress.

Es que el soporte de ellos me disculparás, es un asco.

Muchas gracias por toda tu ayuda, eres el mejor!

[Leo]

No problem 🙂

[Pedro]

Leo, disculpa una última pregunta.

Qué atributo debería usar para cambiar el color del botón cuando se hace hover?

[Leo]

This should help:
https://www.w3schools.com/cssref/sel_hover.asp

[Author]

Posts