We believe that content management must be easy, slick and cool. A core factor to achieve that is a fast UI - in our vision, interactions should take less than 1 second. So we call it the 1-2nd vision. We've already achieved much using AJAX, angular-js, drag-and-drop upload and more. Now in 2sxc 8.4 we're introducing quick-insert / quick-edit, which allows inserting content and app modules in less than 1 second.
Adding a DNN Module was Cumbersome
In the standard DNN implementation, adding a module to a page is very cumbersome. It takes at least 6 steps, namely:
- Click on Module (a menu appears)
- Click on Insert-Module in a the menu
- Wait for the page to reload, as it will now go to edit-mode
- Choose a module and drag...
- ...and try, really, really try hard, to drop it in the right place
- Wait for the page to reload
This is kind of ok once you get used to it, but it's really not nice. It also takes about 10-20 seconds; possibly longer. Not sexy.
Warning about DNNEmptyPane
DNN has a special behaviour which is as follows:
- When a pane has no modules inside, it receives a CSS class called DNNEmptyPane
- For special reasons this DNNEmptyPane will then automatically have a width: 0px
This is a problem, because the insert-toolbar can't highlight the pane to show where inserting will happen. Because of this, we had to include a CSS giving the DNNEmptyPane a width:auto.
There are cases where skin-designers may have accidentally relied on this DNNEmptyPane, thinking it a good idea to use this for things like "border which is only visible if a module is added" or something. We recommend against such patterns as there are better ways. BUT if our implementation causes bad surprises, it's easy to compensate:
- Our solution uses a very weak CSS selector. This means we really only address the ".DNNEmptyPane" and nothing else.
- Because of this, you can easily add a stronger selector like "div.DNNEmptyPane" or "body .DNNEmptyPane" which will take precedence over our rule
- so you could add a rule like "div.DNNEmptyPane {width: 0px}" which would be stronger than our rule
But better would be to re-think your implementation, because anything you did relying on DNNEmptyPane can also be done with another class, and as we believe that in-page editing is a key usability feature, we recommend that you change your implementation.