Soporte » Diseño – Temas y plantillas » Botón de envío de Ninja Forms transparente

  • Resuelto castelrink

    (@castelrink)


    Muy buenas a todos,

    He instalado el formulario Ninja Forms. Es muy intuitivo y ya en su versión gratuita me parece que da muchas opciones de personalización al usuario.

    El caso es que he creado mi formulario casi todo bien, salvo porque el botón de “Enviar” ha quedado muy transparente, casi invisible. Solo al pasar el ratón por encía se ve bien.

    No se si esto tiene fácil solución o debo plantearme cambiar de plugin para formularios.

    Gracias de antemano por vuestra ayuda.`

    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)
  • Moderador Jose Luis

    (@jose64)

    Hola.

    Bienvenido al foro de soporte. Tiene fácil solución, aquí te dejo dos códigos de ejemplo para que veas como funciona el color en los botones.

    El primero define el color (en este caso azul) que se le aplicará al botón cuando el cursor pase por encima (efecto hover):

    button#wpforms-submit-68:hover {
        background-color: blue;
    }

    El segundo define el color normal del botón:

    button#wpforms-submit-68 {
        background-color: red;
    }

    Estos códigos puedes añadirlos en el archivo style.css de tu tema hijo, con un plugin de personalizaciones en el el CSS adicional del tema, en la ruta Apariencia > CSS adicional

    Por supuesto, tienes que ajustar los valores de los colores a tus necesidades.

    Comenta si tienes alguna duda y, por favor, recuerda marcar el debate como resuelto, así nos ayudas a mantener el foro al día.

    • Esta respuesta fue modificada hace 4 semanas por Jose Luis. Razón: corregir código
    Iniciador del debate castelrink

    (@castelrink)

    Muchas gracias Jose Luis,

    Algo he de haber hecho mal. He ido a Apariencia > CSS adicional y he introducido ahí el código, tal cual, pero no han habido cambios.

    No se si es un dato que sirva de algo pero te comento que la línea
    ‘button#wpforms-submit-68 {
    Se pone de color rojo.

    Un saludo.

    Moderador Jose Luis

    (@jose64)

    Hola.

    Se había colado un apostrofe en el código, ahora ya lo tienes corregido. La línea en rojo indica que el código es incorrecto.

    Haz la prueba nuevamente y ahora si debería funcionar.

    Iniciador del debate castelrink

    (@castelrink)

    Hola Jose,

    He puesto el código en CSS adicional y nada de rojo, todo en azul, verde y negro; pero sigue sin funcionar.
    Si se pone muy rensevesado puedo usar algún otro plugin para formulario.

    Gracias!

    Moderador Jose Luis

    (@jose64)

    También cambiaste el formulario, así que ahora no coincide nada con lo que tienes en el formulario. Prueba estos códigos:

    botón normal:

    input#nf-field-13 {
        color: blue;
        background: red;
    }

    al pasar el cursor:

    input#nf-field-13:hover {
        color: red;
        background: blue;
    }
    Iniciador del debate castelrink

    (@castelrink)

    Si señor, ahora si.

    Muchas gracias.

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • Debes estar registrado para responder a este debate.