How can I have Label and Field in the same row?

Question:
How can I have Label and Field in the same row?

Answer:
This is a new easy to set feature in Version 2.9.7 (Thanks to David Knell at www.pudgyfish.com for sending me the first sample that this feature is based on).
Here is how to set the options:
Be sure to upgrade to version 2.9.7 or higher before you begin.
The settings for this are on the contact form settings page. The settings are individual for each form.

How to set the style “Form Labels Left”:
Check the setting “Reset the styles to labels on left”, then click Update Options. Now view your form the changes should be automatic and visible instantly. Sites with page cashing plugins enabled may not change instantly.

setting-style-left

How to set the style “Form Labels Top”:(default)
Check the setting “Reset the styles to labels on top (default)”, then click Update Options. Now view your form the changes should be automatic and visible instantly. Sites with page cashing plugins enabled may not change instantly.

setting-style-top

form-labels-left

form-labels-top

Click here to discuss in the WordPress forums

The style with form labels on left requires more width on your page (550px by default), the style with form labels on top requires only (375px by default). You must consider this when making your choice.
You can adjust the inline CSS on the contact form edit setting page to make the forms narrower, all the settings you need are there, but do so at your own risk. If you mess it up, just click “Reset the styles to labels on top”(or left), then click Update Options.

The style with form labels on left sometimes causes problem in Internet Explorer. Make sure to test it. Here are a couple forum posts about this problem: Form breaking in IE8 buts looks fine in FF and Chrome problems with IE floats

Do you need help?

Send us a Donation:

Donate to Mike Challis

Comments are closed.