This adds support for html5 placeholder option (replaces the need for watermark).
To use: [text* your-name placeholder “enter your name”]
Add the following code into text.php and textarea.php just above the line that saysif ( wpcf7_script_is() && $value && preg_grep( '%^watermark$%', $options ) ) {
):
Placeholder code:
$ph_att = '';
if ( $value && preg_grep( '%^placeholder$%', $options ) ) {
$ph_att .= sprintf( ' %s', $value );
$value = '';
}
if ( $ph_att )
$atts .= sprintf( ' placeholder="%s"', trim( esc_attr( $ph_att ) ) );
—
Use the following jquery script for older browsers that don’t support html5 placeholder:
// Check if browser supports HTML5 input placeholder
function supports_input_placeholder() {
var i = document.createElement('input');
return 'placeholder' in i;
}
// Change input text on focus
if (!supports_input_placeholder()) {
$(':text').focus(function(){
var self = $(this);
if (self.val() == self.attr('placeholder')) self.val('');
}).blur(function(){
var self = $(this), value = $.trim(self.val());
if(val == '') self.val(self.attr('placeholder'));
});
} else {
$(':text').focus(function(){
$(this).css('color', '#000');
});
}