[Cómo] Cambiar el color del texto del marcador de posición del formulario de contacto 7

¿Sabía que el Formulario de contacto 7 le permite cambiar el color del texto del marcador de posición?

Si alguna vez ha utilizado el Formulario de contacto 7, es posible que haya notado que tiene un color de texto de marcador de posición predeterminado. Puede personalizar el texto del marcador de posición utilizando las opciones integradas de Contact Form 7, ¡o incluso personalizarlo con CSS!

Este artículo mostrará cómo cambiar el color del texto del marcador de posición del formulario de contacto 7 y proporcionará ejemplos de código para ambos métodos.

Contenido[Espectáculo]

Hemos descubierto que muchos clientes en nuestro foro de soporte tienen problemas para configurar o cambiar el color de fuente del texto del marcador de posición del formulario de contacto 7.

El formulario de contacto 7 es uno de los complementos de WordPress más populares en la actualidad, lo que le permite crear formularios de contacto básicos o complejos en su sitio de WordPress. Ya hemos escrito cómo corregir errores en el envío de mensajes del Formulario de contacto 7.

Le mostraremos cómo personalizar el color del texto con código personalizado: si no está familiarizado con la codificación pero necesita un complemento de creación de formularios más simple y fácil de usar, pruebe WPForms.

CSS para texto de marcador de posición CF7

::-webkit-input-placeholder { /* WebKit browsers */
    color: #000 !important;
    opacity: 1;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #000 !important;
    opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #000 !important;
    opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #000 !important;
    opacity: 1;
}

Utilice la etiqueta! Important

La etiqueta "! Important" se utiliza para garantizar que no se apliquen otros estilos a estos selectores CSS. Esto asegura que el estilo funcione. Si desea que el estilo se use solo en los campos del formulario de contacto 7, puede usar esto:

.wpcf7 :: - webkit-input-placeholder {/ * Navegadores WebKit * / color: # 000! important; opacidad: 1; }

Si necesita exponer un formulario de contacto específico en su sitio sin alterar otros formularios de contacto 7, busque el identificador del formulario de la siguiente manera:

cambiar el texto del marcador de posición cf7

Haga clic con el botón derecho en el elemento en cuestión y seleccione Inspeccionar elemento. Accesos directos: F11 (Windows) o CMD + MAYÚS + C (MAC) Busque el ID y reemplace 'wpcf_id' con él en este código:

#wpcf_id :: placeholder {color: # 000! important; opacidad: 1; }

IMH

¿Quieres un sitio web rápido?

¿A quién estoy engañando? ¿No todos?

Entonces, ¿por qué tantos de nosotros luchamos?

El mayor desafío suele ser encontrar una empresa de hosting rápida y confiable.

Todos hemos pasado por pesadillas: la toma de soporte tarda una eternidad o no resuelve nuestro problema, siempre culpando a alguien de su lado... 

Pero el mayor fastidio es que el sitio web siempre se siente lento.

At CollectiveRay alojamos con alojamiento InMotion y nuestro sitio web es estúpidamente rápido. Ejecutamos una pila personalizada de la configuración del servidor LightSpeed ​​en MariaDB con un motor PHP7.4 y afrontamos a través de Cloudflare. 

En combinación con nuestras optimizaciones de front-end, atendemos de manera confiable a 6000 usuarios todos los días, con picos de más de 50 usuarios simultáneos. 

¿Quiere obtener una configuración rápida como la nuestra? Transfiera su sitio de forma gratuita al alojamiento de InMotion y obtenga nuestro 50 % de descuento sobre el precio actual.

Pruebe InMotion Hosting con 50 % de descuento para CollectiveRay ¡Visitantes SOLO en marzo de 2024!

Alojamiento de InMotion 50 % de descuento para CollectiveRay visitantes

¡No dude en dejar un comentario o hacer una pregunta a continuación!

Sobre la autora
David Atard
David ha trabajado en la industria digital y en línea durante los últimos 21 años. Tiene una amplia experiencia en las industrias de software y diseño web utilizando WordPress, Joomla y los nichos que los rodean. Ha trabajado con agencias de desarrollo de software, empresas de software internacionales, agencias de marketing locales y ahora es Jefe de Operaciones de Marketing en Aphex Media, una agencia de SEO. Como consultor digital, su objetivo es ayudar a las empresas a obtener una ventaja competitiva utilizando una combinación de su sitio web y las plataformas digitales disponibles en la actualidad. Su combinación de experiencia en tecnología combinada con una sólida visión para los negocios aporta una ventaja competitiva a sus escritos.

Una cosa más... ¿Sabías que las personas que comparten cosas útiles como esta publicación también se ven IMPRESIONANTES? ;-)
Por favor, deja un eficiente Comente con sus pensamientos, luego comparta esto en su (s) grupo (s) de Facebook que lo encontrarán útil y cosechemos los beneficios juntos. ¡Gracias por compartir y ser amable!

Divulgación: Esta página puede contener enlaces a sitios externos para productos que amamos y recomendamos de todo corazón. Si compra productos que le sugerimos, es posible que ganemos una tarifa de referencia. Tales tarifas no influyen en nuestras recomendaciones y no aceptamos pagos por reseñas positivas.

Autor (es) destacado en:  Logotipo de la revista Inc   Logotipo de Sitepoint   Logotipo de CSS Tricks    logotipo de webdesignerdepot   Logotipo de WPMU DEV   y muchos más ...