Personalitzar Formulari en Contact Form 7


Exemple del codi de Contact Form 7 per a personalitzar un formulari. Aquest codi s’enganxa en “Editar Formulario” en Contact Form 7.

<div id="contactoContactForm">
[text Nombre placeholder "Escribe aquí tu Nombre"]
[text Telefono placeholder "Escribe aquí tu Teléfono"]
[email* Email placeholder "Escribe aquí tu Correo"]
[text Ciudad placeholder "Escribe aquí tu Ciudad"]
[textarea Mensaje 10x3 placeholder "Escribe aquí tu consulta, pregunta o duda"]
[acceptance acceptance-740 optional] He leído y acepto la política de privacidad y cookies [/acceptance]
[cf7ic]
[submit "QUIERO INFORMACIÓN"]
</div>

I amb aquest codi personalitzem el CSS del formulari:

Amb el Placeholder hi ha codis per a tots els navegadors.

#contactoContactForm {
    max-width: 100%;
}
#contactoContactForm input,
#contactoContactForm textarea {
    background-color: #14445c;
    margin-top: 12px;
    color: #ccc;
}
#contactoContactForm input[type="submit"] {
    margin-top: 8px;
    width: 100% !important;
    background-color: #947f70;
    color: #000;
    border-radius: 10px;
}
#contactoContactForm ::-webkit-input-placeholder {
    color: #fff;
    font-size: 13px;
}
#contactoContactForm ::-moz-placeholder {
    color: #fff;
    font-size: 13px;
}
#contactoContactForm :-ms-input-placeholder {
    color: #fff;
    font-size: 13px;
}
#contactoContactForm ::placeholder {
    color: #fff;
    font-size: 13px;
}


Deixa un comentari

L’adreça electrònica no es publicarà. Els camps necessaris estan marcats amb *

fifteen + twenty =

Información básica sobre protección de datos Ver más

  • Responsable: Jordi Juan Pérez.
  • Finalidad:  Moderar los comentarios.
  • Legitimación:  Por consentimiento del interesado.
  • Destinatarios y encargados de tratamiento:  No se ceden o comunican datos a terceros para prestar este servicio. El Titular ha contratado los servicios de alojamiento web a NICALIA que actúa como encargado de tratamiento.
  • Derechos: Acceder, rectificar y suprimir los datos.
  • Información Adicional: Puede consultar la información detallada en la Política de Privacidad.

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos. Contiene enlaces a sitios web de terceros con políticas de privacidad ajenas que podrás aceptar o no cuando accedas a ellos. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Ver Política de cookies
Privacidad