Search form Changing text and color

Hello,

I have a problem i just can’t seem to fix. I am making my website with the theme Total.

I have a search option on my website that appears in my header once you click on the “magnifying glass” the header changes into a searchform. The text that appears is: TYP THEN HIT ENTER TO SEARCH…

I am dutch and also is my website and my future clients so i want the search text to be dutch, i want it to be: Vul hier uw zoekopdracht in…

I have tried a lot of things but when i looked my question up on google i got the same code multiple times. This is the code that is in my searchfrom.php:

<form role="search" method="get" class="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
	<input type="search" class="field" name="s" value="Vul hier uw zoekopdracht in..." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" />
</form>

This is what i found on Google and the description was that i had to change it in my searchform.php so i did but nothing happend… These are the two codes, one i saw multiple times and the other one i have found in my FTP (httpdocs -> wordpress -> wp-content -> functions (the map) -> search (the map) -> search-header-replace.php). i tried both of them.. I don’t know wich one is the right one So i hope somebody can help me..

The first code is a code from google:

<form method="get" id="searchform-header-replace" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label class="hidden" form="s"><>php _e( 'Search for: '); ?></label>
<div>
<input type="text" value="Vul hier uw zoekopdracht in..." name="s" id="s" onfocus="if (this.value == 'Vul hier uw zoekopdracht in...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Vul hier uw zoekopdracht in...';}" />
<input type="submit" id="searchsubmit" value="search" />
</div>
</form>

The message said i had to put in my text in the value part, so I did.

The second code i got from my search-header-replace.php it says that i have to add the code to the nav… i don’t know what they mean by that… but this is that code:

// Add code for header replace to nav
if ( ! function_exists( 'wpex_search_header_replace' ) ) {
	function wpex_search_header_replace() {
		if ( !wpex_search_in_menu() ) return; ?>
			<div id="searchform-header-replace" class="clr header-searchform-wrap">
				<form method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>" role="search" class="header-searchform"><input type="search" name="s" autocomplete="off" placeholder="<?php _e( 'Vul hier uw zoekopdracht in...', 'wpex' ); ?>" /></form>
				<span id="searchform-header-replace-close" class="fa fa-times"></span>
			</div><!-- #searchform-header_replace -->
		<?php
	} // End function
} // End if

add_action( 'wpex_hook_header_inner', 'wpex_search_header_replace' );

Here i also put in my text only this time in the placeholder.

Now i use chrome so i obviously inspected the element. The code that stands there is this:

<div id="searchform-header-replace" class="clr header-searchform-wrap" style="display: block;">
<form method="get" action="https://www.chocoladewereld.com/wordpress/" role="search" class="header-searchform">
<input type="search" name="s" autocomplete="off" placeholder="Vul hier uw zoekopdracht in...">
</form>

Here i also put in the placeholder.

Every code i tried didn’t work. The text still says: Typ then hit enter to search.

Can somebody help me, cause i am stuck. I have two other questions regarding the searchform, i will make another post on the forum but maybe you know the answer so i will ask them here to.

I allready changed the color of the X (to close the searchfrom) to brown (#440f00) the text in the searchfrom is grey until you typ in it then it also turns brown, i want it to be brown both ways, when you want to search and see the text in the searchform and when you typ in it. Again my color is #440f00 and then the last question.. The text is all in capital letters (if i typ it right.. sorry, i am dutch) now it is like this: TYP THEN HIT ENTER TO SEARCH and when you typ in the form it stays big.. i want it to start with a capital letter, but not every letter you typ.

My website: https://www.chocoladewereld.com/wordpress you can only search when you go to promotie, pasen, sinterklaas or kerst. Can i change that also? that the magnifying glass is always in the navigation bar? Also when you are one the pages: homepage, over ons, offerte and contact?

Thanks in advance! Greets Jaimie