Blog items tagged with "release"

New Bootstrap3 Dynamic/Drag-n-Drop Form Designer

New Form DesignerThe new v2.3.8 Patch #4 contains an updated form designer for Bootstrap 3 based themes (sorry we're still running into issues on the non-Bootstrap 3 themes). This allows for much easier and quicker form creation and editing. Whereas the previous interface required going back and forth through various screens (page loads), everything now takes place on the main form designer page with updates being performed in the background. What's more...the form designer looks and operates very similar to the previous version.

To add a new control to the form: you simply select a control from the list of controls to the right (or you can change the theme style to place this list on the left if you use a left sidebar) and drag it onto the form in the location you wish to place it. This opens a dialog on the page to enter the details about that control...or you may cancel the action to add the control.

To move a control to a new location: you simply select the control and drag it either up or down and drop it into it's new place.

To remove a control from the form: you can simply select the control and drag it into the trash can above the list of available controls. You may also remove a control by clicking on the red 'delete' button on that control.

New Form Designer​To edit a control on the form: hover over the control and click on the 'edit' button to bring up the control details.

Some other new features include a button to remove the 'design grid' from the display to provide a better idea of what the form will actually look like (this feature is also available on the non-Bootstrap 3 form designer). We've also added a 'switch styles' button to switch between the two basic form styles of having the label above the control or the labels to the left of the controls

All in all this should be a great improvement for those users dealing with the form module.

Are you having a Facelift letdown?

You've unwrapped (installed) v2.3.0, and much to your dismay it looks the same!  Where are all these major new features?  One of the goals of the Exponent CMS project is to provide seamless or transparent upgrades to newer versions.  While this isn't always true (1.x code deprecation, etc...), we do try to keep your web site looking the same after an upgrade, while offering new features and improving the site management tools.  In this article, I'll attempt to show you how to activate the 'new' interface options and work around a couple minor issues.

First off, some issues which may require some editing or settings changes on your part are:

  • We moved the bootstraptheme navbar/menu code from the theme template file into the navigation view template file.  Here is an article describing needed changes if you have built a custom theme based on 'bootstraptheme' (the Twitter Boostrap v2 theme)
    • This article also describes how to fix a 'jQuery' script crash/collision and solve a 'disappearing content' issue.
  • If the WYSIWYG editor (CKEditor) doesn't appear, there may be a conflict between 'Minification' and CKEditor.  Several different ways to work around this issue are:
    • Turn Minification OFF using the Exponent, Super Admin Tools, System Cache menu
    • Leave Minification ON, but turn off 'Minify and Combine linked js scripts' using the 'Minify' tab of the Configure Website command found on the Exponent menu
    • Switch to begin using the new optional TinyMCE WYSIWYG editor (see below)
  • Some settings/input forms may not save or close because we've added better validation of entries.  Specially, this would apply to 'url' (link) and 'email' (address) type input.  Though this is NOT the case in every place Exponent asks for a url or email, some of them require specific entry formats.  The 'url' entry may be rejected if it doesn't begin with a protocol such as 'http://'.  And an 'email' entry may be rejected if it doesn't contain the '@' sign, or it contains more than one email address (a comma is included).  We have a fix for the multiple email address entry.
  • We now correctly load style sheets in an expected sequence.  The main framework library stylesheets (YUI, Bootstrap, etc...) are always loaded first, then the Exponent system stylesheets (core styles and those in the module views), and finally the theme stylesheets.  This ensures the styles cascade correctly and that the theme custom styles have 'final' say on the styling.  However, you may discover some display anomalies exposed by the correct loading order we now use, but they should easily be fixed by a custom theme style update.
  • You may notice the .less stylesheet compiler takes a bit longer than before, but it is also faster than before.  As before, we ONLY compile .less files into .css stylesheets once, or when updated, so like any caching option, the first time to the page is a bit slower.  We've had to switch to a new 'less' compiler which is compatible with Twitter Bootstrap v3 (TB3), and in turn, TB3 also has some very complex stylesheets.  However, we've now sped up the less compilation cache checking.  So if you have Error Reporting turned OFF, the .less file will only be compiled/checked if the corresponding .css file is missing.  If Error Reporting is turned ON, it will operate as in the past few versions where the cache is checked for each .less file and it will be (re) compiled if the .css file is missing or any of the .less files (including those being @import'ed) or the less variables have changed.

Now, here's how to use some of the new features:

  • The new 'elFinder' File Manager is activated by changing the setting on the 'File Manager' tab of the Configure Website command found on the Exponent menu.  Here is an article describing it.
  • The new 'TimyMCE' WYSIWYG editor is activated changing the setting on the 'WYSIWYG' tab of the Configure Website command found on the Exponent menu.  Here is an article describing it.  Just like the CKEditor, you can create a custom configuration with an alternate skin, plugins, or toolbar, etc...
  • The new 'Workflow' feature is activated using the Exponent, Super Admin Tools, Turn Workflow On/Off menu item.  Here is an article describing it.
  • We've provided an initial implementation of a TB3 based theme (bootstrap3theme) which also includes a new TB3 based admin user interface (new slingbar and chrome)!  Designers can begin to develop their own custom TB3 theme(s) based on this one, though we will probably tweak the bootstrap3theme over the next six months.  We strongly recommend you move away from any Twitter Bootstrap v2 (TB2) theme development as it has been deprecated and no new features or updates to TB2 support are planned for Exponent.  However, we will still continue to support YUI3 based themes (YUI2 compatibility has been deprecated by YAHOO and is subject to breaking in the future).  We will also continue to support non-Bootstrap/non-YUI based themes (which inherit YUI2/3 widgets, etc.. at this point).
    • TB3 is the 'new interface' direction we are moving toward, and away from YUI2/3 as the primary/only user interface.  This interface is called 'NewUI'.  These themes are identified by a head config setting of 'framework=bootstrap3'.
    • TB2 development is suspended, but uses TB2 buttons and controls (though some widgets are still YUI2/3 based/styled) with YUI2/3 slingbar and chrome.  Since there are conflicts between TB2 and TB3 it will not receive any NewUI interface elements.  These themes are identified by a head config setting of 'framework=bootstrap'.
    • YUI and other non-Bootstrap themes are based on YUI2/3 (styled) buttons, controls, slingbar and chrome.  These themes are identified by a head config setting of 'framework=yui',  'framework=jquery', or no 'framework' setting.  However, these themes may be 'upgraded' to use the 'NewUI' by changing a system setting.  Once this setting is turned on, the theme will use the NewUI (TB3) slingbar, chrome, controls/buttons, and other widgets.  Since this feature is not yet fully robust/implemented, there is no user interface to turn it on or off.  However, it can be activated within your non-Bootstrap based theme by adding 'define("NEWUI",'1');' to your theme's 'config.php' file (found in the custom theme folder).
            <?php
                define("NEWUI",'1');
            ?>
  • There is a new 'church web site' sample database which may be selected during installation.  This is in addition to the general site, blog site, and eCommerce site sample databases.  If you've already installed Exponent, but want to use one of these samples to 're-initialize' your site (will NOT affect current users/groups, but may affect their permissions), you can locate the /install/samples folder in the Exponent package file and do a 'Restore Database' (which will wipe-out/overwrite all/most current site content).
  • If you need to move some blog, news, or portfolio items to another site, you can now export and import them, by module and by item.  Importing the export file will add them to your content instead of overwriting it as would occur with a 'Restore Database.'
  • There are many more new features, most of which can be found on the module configuration setting views.  Look for a future article describing some of these.

And finally, here are some new features which are automatically implemented:

  • Out of the box, you should have better Search Engine Optimization (SEO) since we now provide better, more specific meta data to the search engines.  This should appear as greater search hit detail (event & product data such as dates, cost, reviews, etc...).
  • If you use a Twitter Bootstrap based theme, you should immediately notice better response on mobile and handheld devices, or even on desktops when the browser window size changes.
  • On some of the management views (manage users/groups/permissions, display form data, and event registrations) we now use a 'widget' which provides for much faster paging and column sorting, better filtering (search), and options to copy/print/export.

As mentioned in previous articles the next upgrade, v2.3.1 shouldn't be expected until around the end of 2014.  What this means is that only patches will be released to address issues with v2.3.0 such as bug fixes or a 'proper' or 'broader' implementation of existing features.  Now go have fun with your 'NEW' web site!