[Comment] Changer la couleur du texte de l'espace réservé du formulaire de contact 7

Saviez-vous que le formulaire de contact 7 vous permet de changer la couleur du texte de l'espace réservé ?

Si vous avez déjà utilisé le formulaire de contact 7, vous avez peut-être remarqué qu'il a une couleur de texte d'espace réservé par défaut. Vous pouvez personnaliser le texte de l'espace réservé à l'aide des options intégrées de Contact Form 7 ou même le personnaliser avec CSS !

Cet article montrera comment modifier la couleur du texte de l'espace réservé du formulaire de contact 7 et fournira des exemples de code pour les deux méthodes.

Table des matières[Afficher]

Nous avons découvert que de nombreux clients de notre forum d'assistance rencontrent des problèmes pour définir ou modifier la couleur de la police du texte de l'espace réservé du formulaire de contact 7.

Le formulaire de contact 7 est l'un des plugins WordPress les plus populaires aujourd'hui, vous permettant de créer des formulaires de contact basiques ou complexes sur votre site WordPress. Nous avons déjà écrit comment corriger les erreurs lors de l'envoi des messages du formulaire de contact 7.

Nous allons vous montrer comment personnaliser la couleur du texte avec un code personnalisé : Si vous n'êtes pas familier avec le codage mais que vous avez besoin d'un plugin de création de formulaires plus simple et plus facile à utiliser, essayez WPForms.

CSS pour CF7 Texte d'espace réservé

::-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;
}

Utiliser la balise !important

La balise "!important" est utilisée pour garantir que d'autres styles ne sont pas appliqués à ces sélecteurs CSS. Cela garantit que le style fonctionne. Si vous souhaitez que le style ne soit utilisé que sur les 7 champs du formulaire de contact, vous pouvez utiliser ceci :

.wpcf7::-webkit-input-placeholder { /* Navigateurs WebKit */ color: #000 !important; opacité : 1 ; }

Si vous devez exposer un formulaire de contact spécifique sur votre site sans modifier les autres formulaires de contact 7, recherchez l'identifiant du formulaire comme suit :

changer le texte de l'espace réservé cf7

Cliquez avec le bouton droit sur l'élément en question et sélectionnez Inspecter l'élément. Raccourcis : F11 (Windows) ou CMD + SHIFT + C (MAC) Localisez l'ID et remplacez « wpcf_id » par celui-ci dans ce code :

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

IMH

Voulez-vous un site Web rapide?

Qui suis-je plaisantais? Ne sommes-nous pas tous?

Alors pourquoi sommes-nous si nombreux à lutter ?

Le plus grand défi est généralement de trouver une société d'hébergement rapide et fiable.

Nous avons tous vécu des cauchemars - le support prend une éternité ou ne résout pas notre problème en blâmant toujours quelque chose de votre côté... 

Mais le plus gros problème est que le site Web semble toujours lent.

At CollectiveRay nous hébergeons avec l'hébergement InMotion et notre site Web est stupide et rapide. Nous exécutons sur une pile personnalisée de configuration de serveur LightSpeed ​​sur MariaDB avec un moteur PHP7.4 et via Cloudflare. 

Combiné avec nos optimisations frontales, nous servons de manière fiable 6000 utilisateurs chaque jour, avec des pics de plus de 50 utilisateurs simultanés. 

Vous souhaitez obtenir une configuration rapide comme la nôtre ? Transférez votre site gratuitement vers l'hébergement InMotion et bénéficiez de 50 % de réduction sur les tarifs actuels.

Essayez l'hébergement InMotion avec 50 % de réduction pour CollectiveRay visiteurs en mars 2024 UNIQUEMENT !

Hébergement InMotion 50 % de réduction pour CollectiveRay visiteurs

N'hésitez pas à laisser un commentaire ou à poser une question ci-dessous !

À propos de l’auteur
David Attar
David travaille dans ou autour de l'industrie en ligne et numérique depuis 21 ans. Il possède une vaste expérience dans les secteurs des logiciels et de la conception Web utilisant WordPress, Joomla et les niches qui les entourent. Il a travaillé avec des agences de développement de logiciels, des éditeurs de logiciels internationaux, des agences de marketing locales et est désormais responsable des opérations marketing chez Aphex Media, une agence de référencement. En tant que consultant numérique, son objectif est d'aider les entreprises à obtenir un avantage concurrentiel en utilisant une combinaison de leur site Web et des plateformes numériques disponibles aujourd'hui. Son mélange d'expertise technologique combiné à un fort sens des affaires confère un avantage concurrentiel à ses écrits.

Encore une chose ... Saviez-vous que les personnes qui partagent des informations utiles comme cet article ont l'air géniales aussi? ;-)
Veuillez laisser un incontournable commentez vos pensées, puis partagez-les sur votre ou vos groupes Facebook qui trouveraient cela utile et récoltons ensemble les avantages. Merci d'avoir partagé et d'être gentil!

Divulgation: Cette page peut contenir des liens vers des sites externes pour des produits que nous aimons et que nous recommandons sans réserve. Si vous achetez des produits que nous suggérons, nous pouvons percevoir des frais de parrainage. Ces frais n'influencent pas nos recommandations et nous n'acceptons pas les paiements pour les avis positifs.

Auteur (s) présenté sur:  Logo du magazine Inc   Logo Sitepoint   Logo CSS Tricks    logo webdesignerdepot   Logo WPMU DEV   et beaucoup plus ...