• Resuelto ermak11

    (@ermak11)


    Hola, como podría hacer que el formulario tuviera los campos que se rellenan, con un borde negro fino?

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

Viendo 12 respuestas - de la 1 a la 12 (de un total de 12)
  • Moderador LGrusin

    (@lgrusin)

    Ya tienen un borde negro fino. Explica mejor lo que quieres hacer.

    Un saludo

    Iniciador del debate ermak11

    (@ermak11)

    debajo de donde pone nombre: (requerido)

    ahí no veo que salga debajo un cuadrado para indicar donde se debe rellenar, no se si me explico

    Hola!

    Por lo que veo los inputs (donde se rellenan los datos) no tienen el borde. El problema viene de un estilo del contact form 7

    .wpcf7-form textarea, .wpcf7-form input[type="date"], .wpcf7-form input[type="datetime"], .wpcf7-form input[type="datetime-local"], .wpcf7-form input[type="email"], .wpcf7-form input[type="month"], .wpcf7-form input[type="number"], .wpcf7-form input[type="password"], .wpcf7-form input[type="search"], .wpcf7-form input[type="tel"], .wpcf7-form input[type="text"], .wpcf7-form input[type="time"], .wpcf7-form input[type="url"], .wpcf7-form input[type="week"] {
        border: 0.1px solid #aeaeae;
    }

    Por lo que parece, es un estilo puesto en alguna configuración de tu tema o similar y es el que prevalece. El problema es que 0.1px es super pequeño, y eso hace que no se vea la línea.

    Luego veo en el style.css

    .wpcf7-form textarea, .wpcf7-form input[type="date"], .wpcf7-form input[type="datetime"], .wpcf7-form input[type="datetime-local"], .wpcf7-form input[type="email"], .wpcf7-form input[type="month"], .wpcf7-form input[type="number"], .wpcf7-form input[type="password"], .wpcf7-form input[type="search"], .wpcf7-form input[type="tel"], .wpcf7-form input[type="text"], .wpcf7-form input[type="time"], .wpcf7-form input[type="url"], .wpcf7-form input[type="week"] {
        border-width: 2px;
    }

    Que parece intenta solucionarlo, pero el primero que te puse es que el prevalece en la cascada y no lo consigue arreglar.

    Lo suyo es que localices dónde has metido tu css primero, y si le cambias por ejemplo a
    border: 1px solid #aeaeae;
    verás que te vuelven a salir las líneas del input.

    Saludos

    Iniciador del debate ermak11

    (@ermak11)

    Hola @blavela, gracias por responder

    Estoy buscando con las indicaciones que me dices, dentro del plugin Contact Form 7 solo tengo el codigo:
    <label style=»color: #111111;»> Nombre: (<span style=»font-style: italic;»>requerido</span>)
    [text* your-name] </label>

    <label style=»color: #111111;»> Email: (<span style=»font-style: italic;»>requerido</span>)
    [email* your-email] </label>

    <label style=»color: #111111;»> Asunto:
    [text your-subject] </label>

    <label style=»color: #111111;»> Mensaje: (<span style=»font-style: italic;»>requerido</span>)
    [textarea* your-message x4] </label>

    <label style=»color: #111111; text-decoration: underline;»> [acceptance Aceptolapolticadeprivacidad]Acepto la política de privacidad

    <label style=»text-align: left;»>
    [recaptcha] </label>

    [submit «Enviar»]

    Nada respecto de Border

    Donde más podria encontrarlo?

    hola @ermak11!

    Al no conocer tu tema, no sé si tendrá un sitio dónde meter código o qué puede ser. Lo mejor sería modificar ese código que te está dando la lata.

    Si no lo localizas, puedes irte a tu style.css y donde pone

    .wpcf7-form textarea, .wpcf7-form input[type="date"], .wpcf7-form input[type="datetime"], .wpcf7-form input[type="datetime-local"], .wpcf7-form input[type="email"], .wpcf7-form input[type="month"], .wpcf7-form input[type="number"], .wpcf7-form input[type="password"], .wpcf7-form input[type="search"], .wpcf7-form input[type="tel"], .wpcf7-form input[type="text"], .wpcf7-form input[type="time"], .wpcf7-form input[type="url"], .wpcf7-form input[type="week"] {
        border-width: 2px;
    }

    Lo cambias a

    .wpcf7-form textarea, .wpcf7-form input[type="date"], .wpcf7-form input[type="datetime"], .wpcf7-form input[type="datetime-local"], .wpcf7-form input[type="email"], .wpcf7-form input[type="month"], .wpcf7-form input[type="number"], .wpcf7-form input[type="password"], .wpcf7-form input[type="search"], .wpcf7-form input[type="tel"], .wpcf7-form input[type="text"], .wpcf7-form input[type="time"], .wpcf7-form input[type="url"], .wpcf7-form input[type="week"] {
        border-width: 2px!important;
    }

    Como te digo, lo suyo es modificar el que está dando la lata, pero a unas malas, lo segundo te tiene que funcionar.

    Saludos!

    Moderador LGrusin

    (@lgrusin)

    La verdad es que el borde es muy fino pero yo lo veo con Mozilla.

    De todas formas tal como dice @blavela pon el borde que desees en el archivo style.css del tema.

    Si lo quieres más fácil y que afecte a todo el formulario, según la documentación de Contact Form 7 https://contactform7.com/styling-contact-form/

    debería funcionar:

    .wpcf7
    {
    border: 1px solid #000;
    }

    Un saludo

    Iniciador del debate ermak11

    (@ermak11)

    Hola, gracias a ambos por responder.

    @blavela, he econtrado el style.css, mi tema es Human rights child, este tema hijo hereda plantillas de un tema padre, HumanRights.

    dentro de HRChild, apenas pone esto:
    /*
    Theme Name: HumanRights Child
    Theme URI: http://www.wpcharming.com/themes/humanrights
    Description: HumanRights Child Theme
    Author: WPCharming
    Author URI: http://www.wpcharming.com
    Template: HumanRights
    Version: 1.0.1
    License: GNU General Public License v2 or later
    License URI: http://www.gnu.org/licenses/gpl-2.0.html
    Text Domain: wpcharming
    Tags:two-columns, left-sidebar, right-sidebar, light, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
    */

    y dentro de Human rights ya veo lo que dices, y he añadido el !important y sigue igual.

    @lgrusin

    ¿donde debería poner el código que me propones??

    gracias a ambos

    Tanto con mi código o el @lgrusin, no te olvides actualizar la cache después de hacer los cambios

    😉

    Moderador LGrusin

    (@lgrusin)

    En el archivo style.css del tema actual, o sea, el tema hijo.

    Recuerda lo que ha dicho @blavela , si usas un plugin de caché puede que no veas los cambios sobre la marcha. Tendrías que vaciarlo o desactivarlo mientras estés haciendo pruebas.

    Un saludo

    • Esta respuesta fue modificada hace 7 años, 5 meses por LGrusin.
    Iniciador del debate ermak11

    (@ermak11)

    Perdonadme, pero debo ser muy bruto…

    he desactivado el plugin, he colocado
    .wpcf7
    {
    border: 1px solid #000;
    }

    en el tema hijo antes del cierre */

    y al activarlo, sigue igual.

    Por cierto con Internet explorer si lo veo con reborde, con chrome no

    • Esta respuesta fue modificada hace 7 años, 5 meses por ermak11.
    Moderador LGrusin

    (@lgrusin)

    Debes ponerlo debajo de */ , no antes…

    Todo lo que esté entre /* …. y */ es un comentario y no tiene efecto.

    Saludos

    • Esta respuesta fue modificada hace 7 años, 5 meses por LGrusin.
    Iniciador del debate ermak11

    (@ermak11)

    Hola, perdonad por tardar tanto en responder pero estaba haciendo pruebas, ya lo he logrado con el codigo de 2px!important dentro del tema padre, el otro codigo hacia que todo el formulario tuviera un recuadro al rededor suyo.

    gracias a los dos!

Viendo 12 respuestas - de la 1 a la 12 (de un total de 12)
  • El debate ‘Contact form 7, bordes de recuadro’ está cerrado a nuevas respuestas.