Home Forums WoodMart support forum Conflicto visual crítico entre WoodMart y pasarela de pago

Conflicto visual crítico entre WoodMart y pasarela de pago

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #707097

    rfriedl
    Participant

    Hola equipo de Soporte,

    Les escribo porque tengo un problema visual grave en la página de Finalizar Compra (Checkout) de mi sitio. Estoy usando el plugin oficial de pagos “Payway” (Argentina) y la plantilla WoodMart está rompiendo el diseño del formulario de tarjetas.

    El Problema: Los campos del formulario de pago (Número de tarjeta, Vencimiento, DNI) se ven superpuestos, sin fondo y desalineados. El diseño de columnas y estilos predeterminados de WoodMart está forzando una estructura que rompe la visualización estándar del plugin.

    Lo que ya intenté: Intenté corregirlo inyectando CSS personalizado (display: block, width: 100%) y scripts JS. El arreglo funciona por un segundo, pero apenas WooCommerce actualiza el checkout vía AJAX (cuando carga la página o calcula el envío), los scripts de WoodMart vuelven a renderizar el formulario y rompen el diseño nuevamente.

    Solicitud: Necesito que me indiquen qué configuración cambiar o me faciliten un código CSS (“Snippet”) para evitar que los estilos de WoodMart interfieran con el contenedor de métodos de pago. Necesito que el formulario se muestre en bloques estándar (una sola columna) y que no se rompa con la actualización AJAX.

    Adjunto capturas de pantalla del error.

    Quedo a la espera de una solución urgente. Gracias.

    #707161

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Could you please check how it works with some default WordPress themes like WooCommerce Storefront to understand if it is our theme issue or not?

    If there is an issue with our theme,Can you please share some screenshots of the issue along with the site admin access, so I can further check and give you a possible solution?

    Best Regards,

    #707218

    rfriedl
    Participant

    Hola Aizaz,

    He realizado la prueba que solicitaste:

    Prueba con tema Storefront (ÉXITO): Instalé el tema base “Storefront” y confirmo que el formulario de Payway carga perfectamente. Los campos tienen la estructura correcta, no se superponen y son accesibles. (Ver captura adjunta “storefront_test.png”).

    Prueba con WoodMart (FALLO): En cuanto reactivo WoodMart, el diseño del formulario se rompe nuevamente debido a un conflicto de CSS del tema (estilos flex/columnas que se superponen).

    Esto confirma 100% que el problema es causado por los estilos predeterminados de WoodMart y no por el plugin.

    He creado una cuenta de Administrador para que ustedes entren y arreglen el código CSS.

    Las credenciales de acceso están en el área de “Private Content” (Contenido Privado) más abajo.

    Por favor, apliquen una corrección (CSS Fix) para asegurar que el contenedor #payway-payment-form se muestre como un bloque estándar. Gracias.

    #707220

    rfriedl
    Participant

    Disculpa me olvide los adjuntos

    Attachments:
    You must be logged in to view attached files.
    #707227

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    You have missed the admin login URL. Can you please share the WP admin login URL in the private area so I can check and give you a possible solution?

    Best Regards

    #707235

    rfriedl
    Participant
    #707290

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Try to add the following custom css code in Theme Settings > Custom CSS. Change code as per your requirements.

    .payment_method_payway_gateway input,
    .payment_method_payway_gateway select {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        clear: both !important;
    
      /* Restore Woodmart input styling */
        background: #fff !important;
        border: 1px solid #e6e6e6 !important;
        padding: 10px 12px !important;
        border-radius: 4px !important;
        line-height: 1.4 !important;
    }
    /* Validation borders */
    .woocommerce-checkout form .wc-gateway-payway .woocommerce-invalid input,
    .woocommerce-checkout form .wc-gateway-payway .woocommerce-invalid select {
        border-color: #cc1818 !important;
    }
    .woocommerce-checkout form .wc-gateway-payway .woocommerce-validated input,
    .woocommerce-checkout form .wc-gateway-payway .woocommerce-validated select {
        border-color: #2ea44f !important;
    }

    Best Regards,

    #707362

    rfriedl
    Participant

    Quedo muy bien, muchas gracias

    #707431

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    You’re Most Welcome!

    Feel free to write back anytime. If you need further assistance, we are always here to help you.

    If you have a minute, we’d truly appreciate your feedback — it helps us improve the product and shape future updates more effectively. We’d love your feedback on our theme: https://tally.so/r/w4l54k

    Thanks for contacting us.
    Have a great day.

    Topic Closed.
    Best Regards.

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Conflicto visual crítico entre WoodMart y pasarela de pago’ is closed to new replies.