A form doesn’t need to be fancy to convert well, but it shouldn’t be crowded and messy either. Ninja Forms will look fantastic on a well-styled theme with no additional styling needed, but there may be times when you want to take your form to a new level!
Elevate your forms with Layout & Styles
Layout & Styles gives you the ultimate control over Ninja Forms without having to write lengthy amounts of CSS code:
- Create multiple column form layouts right within the Ninja Forms builder.
- Easily add styles to form elements, labels, and wrappers.
- Add default styles to elements, and/or specify styles by element type, form, or form field.
- Export and import styles.
- Easily style standard form components: datepicker, success message, even and odd field rows, etc.
- Add styles to your form’s success and error messages.
Who should use Layout & Styles
- Anyone who wants to make small changes to their forms, but knows little to no CSS.
- Anyone who likes lots of options, fine-grained control, and likes to experiment
- Anyone who knows CSS very well and wants to speed up the process of styling a Ninja Form
Can I style all elements, including those added by other add-ons?In most cases, yes. There may be elements added by other add-ons that are not yet supported by Layout & Styles, but the vast majority are.
How much CSS do I REALLY need to know?We have a guide that explains all you need to know for basic forms styling. As with most things, however, the more you know the more you can do.
Can I make fields span separate columns/rows?You can span multiple columns with ease, but spanning multiple rows with a single field is not possible at this time.
Can I style pseudo-classes with this extension?Pesudo-classes are a fairly complex use case and not currently editable from within Layout and Styles (but you can style them in your theme’s stylesheet)
3.0.20 (21 June 2017)
- Added a button to \”remove all styles\” from the plugin-wide styling section.
3.0.19 (02 May 2017)
- Added Multi-Part Forms plugin styles if the Multi-Part Forms add-on is active.
3.0.18 (11 April 2017)
- Forms should now import with proper field orders in all installations.
3.0.17 (17 March 2017)
- Completed a deep-dive of all plugin-wide styling settings. They should all work properly now.
3.0.16 (07 March 2017)
- Fixed a bug that could cause the builder to crash without warning in some instances.
3.0.15 (02 Februrary 2017)
- Fixed a PHP warning about unset variables.
3.0.14 (26 January 2017)
- Added a filter for Ninja Forms version 3.0.25 that allows Layout & Styles to correctly order fields in submissions.
3.0.13 (19 January 2017)
- Saved fields can now be properly dragged onto rows and dividers.
3.0.12 (21 November 2016)
- Field styles should apply properly on the front-end in all cases.
3.0.11 (26 October 2016)
- Fixed a bug that was introduced in version 3.0.10 that caused rows with empty columns to be removed.
- Sometimes column widths were totalling over 100%. This caused fields to wrap around to a new row.
3.0.10 (17 October 2016)
- Corrupt data should no longer cause Layouts to crash the builder with an \”undefined ParentNode\” error.
3.0.9 (12 October 2016)
- Added better error handling for missing field types. This should prevent some JS errors from being thrown on display.
3.0.8 (28 September 2016)
- Fixed a bug that caused field order to randomise when sorting fields between cells and rows.
- Fixed a bug with template imports that caused templates to fail.
- Added version number to script inclusion to help prevent caching issues.
- Fixed a bug with hover styles not being applied to submit buttons.
3.0.7 (26 September 2016)
- Fixed a bug with conversion from the RC of Ninja Forms.
3.0.6 (11 September 2016)
- Fixed a bug with conversion and invalid form layouts.
3.0.5 (09 September 2016)
- Fixed a bug with conversion.
3.0.4 (08 September 2016)
- Fixed a bug with applying plugin wide styles.
3.0.3 (06 September 2016)
- Compatibility with Multi-Part Forms v3.0.
3.0.2 (06 September 2016)
- Improved conversion efficiency.
- Compatibility with Multi-Part Forms v3.0.
3.0.1 (27 July 2016)
- Fixed a bug that could break form conversion in Ninja Forms.
- Updated with Ninja Forms v3.x compatibility
- Deprecated Ninja Forms v2.9.x compatible code
1.2.7 (12 May 2015)
- Fixed a bug that could cause column layouts to fail even when they are correct.
1.2.6 (17 March 2015)
1.2.5 (4 March 2015)
- Fixed a bug that removed the Multi-Part Styles section if that extension was also activated.
1.2.4 (3 March 2015)
- Fixed a bug that could cause a fatal error if Ninja Forms core was deactivated.
1.2.3 (4 February 2015)
- Preparing for compatibility with Ninja Forms version 2.9.
1.2.2 (24 November 2014)
- Fixed a bug that could prevent field layouts from saving properly.
1.2.1 (17 November 2014)
- Adding a warning for a common invalid column layout error.
- Fixed a bug with default styling.
- Updated support for i18n.
- Fixed a bug that prevented the new options from showing up.
- Added rating-specific styles on a per-field basis.
- Added individual styling to rating fields.
- Converting Layout and Styles over to the new Ninja Forms loading class.
- Added per form title styling.
- Fixed a bug that prevented multi-part pages from being added on the Layout and Styles tab.
- Fixed some CSS specificity errors with textboxes and textareas.
- Admin scripts should now load the min or dev versions based on the NINJA_FORMS_JS_DEBUG constant.
- Added display selector.
- Adjusted what\’s advanced and what\’s basic.
- Limited some selectors from Default Field Styles.
- Moved styles to be output before form and not after.
- Fixed a bug that could cause multi-part forms to behave incorrectly when styled.
- Adjusted a CSS selector that could cause styles from not applying properly.
- Fixed a fairly major bug with Layout & Styles and Multi-Part forms that could cause multi-columned pages to behave incorrectly.
- Added additional styles for core such as an error selector fix, form title, button and hover. Also added styles for MP Page Titles, and pre / next hovers.
- Changed the license and auto-update system to the one available in Ninja Forms 2.2.47.
- Fixed a bug that prevented previous and next button in multi-part forms to be styles.
- improved i18n compatibility.
- Changed references to wpninjas.com to the new ninjaforms.com.
- Fixed a bug that prevented the per form hover state styles being applied to submit buttons.
- Fixed a bug that prevented List fields from working properly on the Default Field Styles tab.
- Updates for compatibility with WordPress 3.6
- Fixed a visual bug with the placement of the Form Settings metabox.
- Fixed a bug that was preventing the \”Field Type Settings\” tab from working properly.
- The selector used for the \”next\” and \”previous\” buttons in Multi-Part Forms has been changed.
- Added \”Page\” styles for use with AJAX submissions and Multi-Part Forms.
- Added new AJAX submissions and Multi-Part Forms styling options.
- Added a filter to the fields array that is output on the layout editing screen.
- Fixed a bug that could cause the \”Error Message Styles\” from saving properly.
- The admin JS file should now include properly on sites using versions of WordPress before 3.5.
- Added styling options for Multi-Part Forms elements.
- Fixed a bug in the minified JS.
- Fixed a bug that prevented some users from activating their installations.
- Initial release