Many websites today will not have labels next to their input boxes anymore. Instead they place the text inside the input box. Contact Form 7 plug in can do this out of the box, but the user has to erase what is in the box before they can type in their information. This is a) annoying and b) not user friendly at all. Fortunately there is a hack that makes this work. Special thanks to emj for this solution.
Note that this is a bit of a hack, so not sure how it will work as you upgrade to newer versions.
First: add this javascript to header.php
Second: in the contact form 7 plugin folder, edit file /modules/text.php
Third: find line 76
$html = ‘‘;
Fourth: between ‘input’ and ‘type’, add:
onFocus=”clearText(this)” onBlur=”restoreText(this)”
That should do it. It isn’t perfect, but it works pretty well.
Styling your drop down text
With the basic wordpress install, you are able to nicely style the menu colors etc, but I have run into a problem several times where I use the same color to highlight which page I am on as the color of the background of my dropdown. So if I had a blue nav bar, my…
Contact Form 7 Clear textarea
Last time we talked about how to clear the input labels on Contact From 7 using a slight hack to the code. This is great for simply using input labels, but what about a text area? As I quickly found it, it doesn’t work. Why is doesn’t work is because the text area is controlled…
Completed Google Analytics Essentials
I just finished the Google Analytics Essential Training on Lynda.com. I thought it was well done and I did learn a few new things to help me better understand web traffic and how we can use GA to increase sales. The course is about four and a half hours, so it does take some time,…
