For a recent project I was working on with a very low budget, I had to use a free plugin for WordPress which would allow me to create a custom contact form to be used on both the contact page and also in a widget.
The plugin I opted for was Contact Form 7, an excellent, free plugin by Takayuki Miyoshi.
The only one issue I had was in the design I was working from, no labels were being used, only placeholders in the inputs and textareas.
Now, Contact Form 7 as standard does not have this feature, but pryley from the WordPress support forums came up with an excellent solution to the problem.
The solution does unfortunately mean editing plugin files, which I don’t like doing, but it is a quick and easy solution for those like me looking for one.
First of all copy the following code:
// Edited 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 ) ) );
if ( wpcf7_script_is() && preg_grep( '%^watermark$%', $options ) ) {
$class_att .= ' wpcf7-use-title-as-watermark';
$title_att .= sprintf( ' %s', $value );
$value = '';
}
You now want to take that code and paste it into line 61 of text.php and textarea.php.
Now in your WordPress admin, specifically in the Contact Form 7 admin page, you can now use the following code to add a placeholder:
[text* your-name placeholder "Your Name"]
I would also recommend using the following code to make sure the placeholders work on old browsers, otherwise it will no end leave some old man in China thoroughly confused…