The first part of this blog post took a deep dive into many of the Contact Form Advanced widget’s new features that were introduced in EverWeb 3.0. After exploring features such as import text file, Placeholder text, Selection List control type and Control Padding, this post takes an in-depth look at the remainder of the widget’s new features…
New ‘Control Section Options’
The updated Contact Form Advanced widget’s settings have been reorganised in EverWeb 3.0 with the introduction of the new ‘Control Section Options’ section. This gives you greater flexibility in the display of your form controls with a number of small, but significant, new features that can make a big impact to your form.
The first option allows you to add a Custom Background Color for the currently selected control. Select the control that you want in the Form Controls list, then check the ‘Use custom background color’ option. The color swatch then becomes available so that you can choose the color that you want as the background. This is a great feature when you want to highlight a particular field in your contact form.
The Control Padding feature adds vertical and horizontal padding to the currently selected control. If you want vertical padding only, select the ‘Control Spacing’ option in the Fonts and Styles section of the widget. However, note that this option applies to all of the controls in the form. You may find that you get best results using a combination of the two options.
The third new Control Section option is ‘Max Content Width’. This option lets you control how wide the control can be. This is a useful option when the form is displayed on a large monitor. You may find that the fields in the form appear too wide. Use the Max Content Width option to limit how wide the field can be displayed on a screen.
The final new option in the ‘Control Section Options’ is the control ‘Alignment’ field. Highlight the control that you want in the Forms Control list, then use the Alignment dropdown menu to set the control to be either Left, Center or Right aligned.
New Submit Styled Button
EverWeb 3.0 introduced the Styled Button to the PayPal and Contact Form Advanced widgets. In the Contact Form Advanced widget the Styled Button is used specifically to style the ‘Submit’ button. In the PayPal widget, the Styled Button can be applied to all of its button types: Add to Shopping Cart, Buy Now, View Cart and Donate. For both widgets, the Styled Button works in the same way and has the same features.
When using the Contact Form Advanced widget, you can either use the default button, your own button image or a Styled Button. In all scenarios, start by changing the ‘Submit Caption’ to change the button’s label. If you want to change the alignment of the button to either left, center, right or full width, use the ‘Alignment’ dropdown menu.
Next click in the ‘Use styled button’ box to activate the Styled Button’s settings. If you already have ‘Use Custom Image Button’ already checked, this will be deactivated in favour of the Styled Button settings. If you decide that you actually want to use an image and not a Styled Button, recheck the ‘Use Custom Image Button’ which will automatically deselect the Styled Button options.
The options for the Styled Button are straightforward to use. Set the background color of the button using the ‘Background Color’ swatch and change the color of the button’s text using the ‘Text Color’ swatch. Use the ‘Border Radius’ option to set how rounded the button’s corners will be. If you have a setting of zero, the corners will be square, whilst using a setting of 50 will make the corners very rounded. The ‘Mouseover Background’ and ‘Mouseover Text’ options set their respective colors for when a visitor mouses over the button. The final option is ‘Button Font’. Click on the ‘Fonts’ button to open the Fonts Panel where you can adjust the type of font and font size so that they match the style of your website.
On their own, the new features added to the Contact Form Advanced widget make for a significant upgrade in features and functionality. Add in the SPAM Protection and Contact Form Enhanced Addon, and you have the perfect way to create the contact form that you have always wanted!
If you have a question, comment or suggestion, please let us know in the Comments Section. We’re happy to help!
EverWeb on Social Media
You can also find EverWeb on the following social media platforms: