In the Form Styles tab of the form module, you can make styling changes for the form itself (not the form fields). Here you can set a background color or image for the form, as well as adjust horizontal and vertical padding for the form.
For example:
Here, you can also set the font style for your form’s Submit button, assuming you are using text for the button, as set in the Structure of the form.
The Element Styles tab in the form module gives you styling control over the actual fields (“elements”) within your form. Here you can control the horizontal alignment of the form fields within the form, as well as the alignment of the text in form fields. You can add/style the border around the form fields, as well as control their padding and spacing. And you can also select the font styles you want applied. Most of the options are pretty self-explanatory, but let us quick highlight the different font styles and what they apply to:
- Label font style – Labels are the text that display above a form field.
- Input font style – This is the font style that will apply to placeholder text located in the fields, as well as text typed into the field by a user:
- Validation text font style – This is the text appears on the front of the site when someone tries to submit a form without valid inputs in a field.
(Be aware that the Submit button font style, assuming you are using text and not a graphic, is set in the Form Styles tab.)
The form submission appearance is controlled in the Submission tab of the form module:
For example, here is a ‘success’ message, shown after the form has gone through:
Use the color controls to alter the color and opacity of the overlay. To change the text that is shown for form submissions, you will want to go to the “ProPhoto > Settings > Site Settings > Forms” area.
