[Jak] zmienić kolor tekstu w formularzu kontaktowym 7

Czy wiesz, że Contact Form 7 umożliwia zmianę koloru tekstu zastępczego?

Jeśli kiedykolwiek korzystałeś z Formularza kontaktowego 7, być może zauważyłeś, że ma domyślny kolor tekstu zastępczego. Możesz dostosować tekst zastępczy za pomocą wbudowanych opcji Contact Form 7 — lub nawet dostosować go za pomocą CSS!

W tym artykule pokażemy, jak zmienić kolor tekstu zastępczego formularza kontaktowego 7 i przedstawimy przykłady kodu dla obu metod.

Spis treści[Pokazać]

Odkryliśmy, że wielu klientów na naszym forum pomocy technicznej ma problemy z ustawieniem lub zmianą koloru czcionki tekstu zastępczego formularza kontaktowego.

Formularz kontaktowy 7 to obecnie jedna z najpopularniejszych wtyczek WordPress, umożliwiająca tworzenie podstawowych lub złożonych formularzy kontaktowych w witrynie WordPress. Już pisaliśmy jak naprawić błędy w wysyłaniu wiadomości z Formularza kontaktowego 7.

Pokażemy Ci, jak dostosować kolor tekstu za pomocą niestandardowego kodu: Jeśli nie znasz kodowania, ale potrzebujesz prostszej i łatwiejszej w użyciu wtyczki do tworzenia formularzy, wypróbuj WPForms.

CSS dla tekstu zastępczego 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;
}

Użyj !ważny tag

Tag „!important” służy do zagwarantowania, że ​​inne style nie zostaną zastosowane do tych selektorów CSS. Gwarantuje to, że styl działa. Jeśli chcesz, aby styl był używany tylko na 7 polach formularza kontaktowego, możesz użyć tego:

.wpcf7::-webkit-input-placeholder { /* przeglądarki WebKit */ color: #000 !important; krycie: 1; }

Jeśli chcesz udostępnić jeden konkretny formularz kontaktowy w swojej witrynie bez zmiany innych formularzy kontaktowych 7, poszukaj identyfikatora formularza w następujący sposób:

zmień tekst zastępczy cf7

Kliknij prawym przyciskiem myszy dany element i wybierz opcję Sprawdź element. Skróty: F11 (Windows) lub CMD + SHIFT + C (MAC) Znajdź identyfikator i zastąp nim „wpcf_id” w tym kodzie:

#wpcf_id::placeholder { kolor: #000 !ważne; krycie: 1; }

JESTEM H

Chcesz szybką stronę internetową?

Kogo ja oszukuję? Czyż nie wszyscy?

Dlaczego więc tak wielu z nas walczy?

Największym wyzwaniem jest zwykle znalezienie szybkiej, niezawodnej firmy hostingowej.

Wszyscy przechodziliśmy przez koszmary – wsparcie trwa wieczność lub nie rozwiązuje naszego problemu, zawsze obwiniając coś po swojej stronie… 

Ale największym problemem jest to, że witryna zawsze działa wolno.

At CollectiveRay hostujemy za pomocą hostingu InMotion, a nasza strona jest głupio szybka. Działamy na niestandardowym stosie konfiguracji serwera LightSpeed ​​na MariaDB z silnikiem PHP 7.4 i frontem przez Cloudflare. 

W połączeniu z naszymi optymalizacjami front-endu niezawodnie obsługujemy 6000 użytkowników każdego dnia, przy szczytowej liczbie 50+ jednoczesnych użytkowników. 

Chcesz uzyskać szybką konfigurację, taką jak nasza? Przenieś swoją witrynę za darmo na hosting InMotion i uzyskaj 50% ZNIŻKI na aktualne ceny.

Wypróbuj InMotion Hosting z 50% ZNIŻKĄ na CollectiveRay gości TYLKO w czerwcu 2024 r.!

Hosting InMotion 50% ZNIŻKI dla CollectiveRay odwiedzający

Zostaw komentarz lub zadaj pytanie poniżej!

O autorze
Dawid Attar
David pracuje w branży internetowej i cyfrowej od 21 lat. Ma ogromne doświadczenie w branży oprogramowania i projektowania stron internetowych, wykorzystując WordPress, Joomla i nisze je otaczające. Współpracował z agencjami rozwoju oprogramowania, międzynarodowymi firmami zajmującymi się oprogramowaniem, lokalnymi agencjami marketingowymi, a obecnie jest dyrektorem ds. operacji marketingowych w Aphex Media – agencji SEO. Jako konsultant cyfrowy koncentruje się na pomaganiu firmom w uzyskaniu przewagi konkurencyjnej dzięki połączeniu ich strony internetowej i dostępnych obecnie platform cyfrowych. Połączenie wiedzy technologicznej z dużym zmysłem biznesowym zapewnia jego pismom przewagę konkurencyjną.

Jeszcze jedna rzecz... Czy wiesz, że osoby, które udostępniają przydatne rzeczy, takie jak ten post, również wyglądają NIESAMOWITE? ;-)
Proszę zostaw użyteczny skomentuj swoje przemyślenia, a następnie udostępnij to na swoich grupach na Facebooku, które uznają to za przydatne i wspólnie zbierzmy korzyści. Dziękuję za udostępnienie i bycie miłym!

Ujawnienie: Ta strona może zawierać linki do zewnętrznych witryn produktów, które kochamy i gorąco polecamy. Jeśli kupisz sugerowane przez nas produkty, możemy otrzymać opłatę za polecenie. Takie opłaty nie wpływają na nasze rekomendacje i nie przyjmujemy płatności za pozytywne recenzje.

Autorzy promowani w:  Inc Czasopismo Logo .   Logo Sitepoint   Logo CSS Tricks    logo webdesignerdepot   Logo WPMU DEV   i wiele więcej ...