1.1.2betaexperimentalUI Experiment: Fancy Forms

A collection of UI replacements for system-default selectboxes, button and inputs. Warning: it causes severe addiction!

Clone URLhttps://github.com/eKoeS/fancy_forms.git

Add as a submodulegit submodule add https://github.com/eKoeS/fancy_forms.git extensions/fancy_forms --recursive

Compatibility

2.x.x2.1.x2.2.x2.3.x2.4.x2.5.x2.6.02.6.12.6.22.6.32.6.42.6.52.6.62.6.72.6.82.6.92.6.102.6.11
No1.1.2beta1.1.2betaNoNoNoNoNoNoNoNoNoNoNoNoNoNoNo. Soon?

Readme

This extension comes from the need of having fully customizable form controls that better support the user on one hand and are more aesthetically pleasing on the other.

Features

  • Two homemade jQuery plugins, symphonySelectbox and symphonyCheckbox, to respectively replace select and input type"checkbox" elements with more advanced UI controls.
  • Consistent styles using recent standards (i.e. CSS3) for text inputs, textareas and buttons.
  • Replacements for both multiple- and single-choice selectboxes, with two available sizes: "tiny" and "normal".

Future releases will provide:

  • Custom event handlers
  • Better performance
  • Future fixes to future bugs ;)

FAQ: Frequently asked questions

Q: This (awesome) extension causes conflicts with $other_extension. What am I supposed to do?

A: You can populate the ignore array (available in both symphonySelectbox and symphonyCheckbox) with a complex CSS selector. Upon initialization, Fancy Forms will skip any element whose parents match the given expression.

Q: Can this (marvellous) extension be used on frontend too?

A: Sure, all it does is providing some jQuery plugins and stylesheets. Here’s the list of resources you need to include in your pages:

symphony.button.css
symphony.checkbox.css
symphony.checkbox.js
symphony.selectbox.css
symphony.selectbox.js
symphony.textbox.css

While buttons and textareas (as well as textinputs) are completely handled by CSS, selectboxes and checkboxes must be initialised as ordinary jQuery plugins. Example:

$('input[type="checkbox"]').symphonyCheckbox();
$('select').symphonySelectbox();

Installation & Updating

Information about installing and updating extensions can be found in the Symphony documentation at http://symphony-cms.com/learn/.

Version history

Symphony 2.1.0 to 2.2

  • Added extension.meta.xml.
  • The extension has been renamed "UI Experiment: Fancy Forms" (it was previously called "Better Forms").