CF7 Skins Ready now offers you a Label Position option for each form field. Using this option, you can choose where to display a label with respect to a form field.
In this article, we show you how to use the Label Positions option from the CF7 Skins Visual Editor quickly and easily.
The Label Position option is available in our CF7 Skins Ready Add-on.
Adding the label position option can offer the following benefits:
- helps make forms easier to read.
- lower user errors when completing form fields.
- more control and flexibility over customization of your forms.
Tip: The Label Position feature is available only for CF7 Skins Ready users.
Adding Label Position
You can apply the Label Position option with three different methods:
1. Using Form Options
To add label position using Form Options:
2. Select Form Options.
3. Choose a Label Position from the drop-down menu.
4. Scroll down and click Save Visual.
Tip: Using this method, you can easily set the Label Position for all the form fields at once.
2. Editing the Label Options field
To add label position by editing the corresponding form field:
2. Choose an option from the Label Position drop-down menu.
3. When you completed making changes on the relevant form fields, scroll down and click Save Visual.
Tip: The Label Position added using this method overrides the position added from the Form Options.
3. Using the Label Options dropdown
To add label position using the Add-ons drop-down menu for a form field:
2. Select the drop-down menu for the required form field.
3. Click Label Position and select the required position from the drop-down menu.
4. When you are done making changes on all your form fields click Save Visual.
Tip: You can use the Add-ons drop-down menu to make quick & easy changes directly on each form field.
After using the Label Position options, you can customize your form as follows:
The Label Position in all the fields of this form are set to Bottom.
Before CF7 Skins v2.3
Prior to CF7 Skins v2.3, the Label Position option was not available in CF7 Skins Ready. The position of the labels was based on the chosen styleStyle When you select a CF7 Skins Style the aesthetic design (CSS code) is automatically created and applied to your form. and it could not be modified.