This topic has 9 replies, 3 voices, and was last updated 9 years by 
-
-
Hi, this may be an easy one but I don’t get it to work. How can change the textcolor of the placeholder of ‘Search Form’ in Visual composer? (but just of that, not sitewide) Asked already Visual composer Support, they say that:
“Hi, you can use Custom CSS to overwrite this element if there is extra class name available for this element. Search form is not default VC element and seems to be added by your WP theme author so I would recommend getting more information from theme author on this one as well.”
Thanks!
Hi,
After you add a search form module from visual composer, add a class for example mycustomclass
If you want to add another name to that class don’t forgot to rename class from mycustomclass with your class in CSS.
COPY CODE.kleo-search-form.mycusomclass input::-webkit-input-placeholder { /* WebKit, Blink, Edge */ color: red !important; } .kleo-search-form.mycusomclass input::-moz-placeholder { /* FF 4-18 */ color: red; } .kleo-search-form.mycusomclass input::-moz-placeholder { /* FF 19+ */ color:: red; } .kleo-search-form.mycusomclass input:-ms-input-placeholder { /* IE 10+ */ color: red; }Add this css to kleo-child/style.css or in Theme Options -> General Settings -> Quick CSS
Regards
RAdu
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionhi,
trying to apply the solution you offered to change the search form placeholder color on my home page, but nothing changes, tried to find the placeholder in the theme files, but couldn’t find it anywhere.everything is still the same. i have already changed the color of the input text without any problems.
hope to find a solution.thank you,
regards, eli.Hi elis,
Can you please provide your website url ?
Cheers
Radu
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionHi,
Please add this css to wp-admin -> theme options -> general settings -> quick css
COPY CODEbody.home input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea { color:red !important;} body.home .kleo-search-form #searchform input.input-lg { color:red !important; }Let me know if is ok
Cheers
Radu
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionhi radu,
thank’s for your replay, unfortunately it didn’t help.
the code you suggest is for changing the color of the input text, which i already managed to change.
the only thing i can’t change is the color of the placeholder text.
any other ideas how to do it?thank’s
regards, eli.Hi,
Try with this CSS
COPY CODE.kleo-search-form.search-style-default #searchform .input-lg::-webkit-input-placeholder { color: red !important; } .kleo-search-form.search-style-default #searchform .input-lg:-moz-placeholder { /* Firefox 18- */ color: red !important; } .kleo-search-form.search-style-default #searchform .input-lg::-moz-placeholder { /* Firefox 19+ */ color: red !important; } .kleo-search-form.search-style-default #searchform .input-lg:-ms-input-placeholder { color: red !important; }Replace red with your desired color
Cheers
Radu
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution
The forum ‘KLEO’ is closed to new topics and replies.
