DNN Custom Forms by OnyakTech
OnyakTech Custom Forms DNN Module
by OnyakTech

Advanced Form Styling

Use the following HTML in your Form Template to take the appearance of your form to a new level. Below is a screen shot of the OnyakTech Forms using these styling options today on real we site. This styling uses BootStrap3.

Header Styling
<h2><em class="fa fa-pencil-square teal">&nbsp; </em>DEALER APPLICATION</h2>
<p>Dealer Application</p>
Define Rows
<div class="row">
<div class="col-md-6">
<div class="form-group"><label class="control-label">First Name: </label> [TEXTBOX-FIRSTNAME]</div>
<div class="form-group"><label class="control-label">Last Name: </label> [TEXTBOX-LASTNAME]</div>
</div>
</div>
Center Submit Button
<div class="row">
<div class="col-md-2">&nbsp;</div>
<div class="col-md-8">[REGISTER::Text=Apply::CssClass=btn btn-info btn-block]</div>
<div class="col-md-2">&nbsp;</div>
</div>
Form Control CSS

To complete the styling, set the CSS Class to add to the form controls in Display Setup under Other Options to "form-control". Doing this will have the Forms module add this CSS class to all controls on your form.

If you have checkbox and radio button controls you may also want to enable the "Enable Checkbox/Radio Styling" option as well to improve the appearance of these controls on your form.