Tue 30 Jun 2009 |
Module editing at the frontend
Written by Ankit Ahuja
After last week's post, I've now completed editing of module parameters in a modal popup. Edit icons appear next to the module titles which can be clicked to edit the module parameters. I've deliberately disallowed editing of advanced and other parameters from the modal popup at the front-end to avoid complexity. If it is a custom HTML module, then its content can also be edited via the modal popup.
There are bugs in article & module editing which I'll be fixing in the coming weeks along with adding support for IE and other browsers.
As bobbravo2 pointed out, I'm not sure if the edit icons should be hidden/revealed when editing is toggled or the toggle function should only work for enabling/disabling of editing of titles in-place. The only reason a user will click an edit icon is if she wants to edit the article/module. But then, it makes sense to either enable or disable editing completely rather than partially. I would like your point of view on this.
I'm not sure if I can implement in-place editing any other way ( other than the current way of background-color on hover and clicking to edit ) which will not interfere with the template and at the same time be user-friendly. I don't want popups to be clogging the UI every time you hover over a title as it will be difficult to ascertain the right position where the popup should appear ( template dependent ).
To make it easier to enter or leave editing mode, I've implemented a shortcut key 'e', using which you can toggle editing On/Off. So, anytime you want to perform editing, just press 'e'.
The next task I'll be taking up is of drag & drop placement of modules. Hence, in the coming week, I'll be fixing bugs plus starting up with drag & drop placement of modules.
As always, you can check out the demo at http://ankitahuja.com/playground/joomla
2009-06-30 16:47:45
Is your work pure experimental, or can we expect it in Joomla! 1.6, 1.7 or later?
Kind regards
David-Andrew
2009-06-30 16:47:53
2009-06-30 17:37:13
2009-06-30 17:41:55
@Kyle - Thanks
2009-06-30 18:51:38
I think the best way to deploy this is to make the button toggle all editing functions. Any other way you risk confusing the users.
Really hope this makes it's way into Joomla 1.6.
Thanks again!!
2009-07-01 02:32:55
The idea of modules/menus editing on the front-end using modal is really great. It allows easer access for editors and does not break the layout/design while editing.
Congrats for the great work!
2009-07-01 05:47:58
2009-07-01 07:35:49
The edit on/off button also works for article ...cool!
2009-07-01 07:54:55
2009-07-02 05:36:27
2009-07-07 12:21:53
amazing stuff! I have had hundreds of admins (normal people with admin acces, webmasters without tech knowledge) and believe it or not they almost all struggle with menu editing and module editing (most tech savvy deal ok with articles) This is a "small step for code but a giant step for Joomla"!
Thx you so much for your work and all best at the GSOC, will be watching you
cheers
2009-07-09 18:46:08
I love the progress, and continue to watch. I'm glad to see others (@Marcos, @Digiwise) suggest the front-end menu parameter editing - this is a hugely useful feature that is way too difficult (& confusing) to use on the admin backend.
In terms of the edit button, I think that your current implementation is great, it allows a consistent user experience (when editing is on, you can edit titles, and content; when editing is off, you can preview & navigate the site). I'd say I recant my previous recommendation, given how much you are allowing users to edit on the frontend. Having everything on in "edit mode" is simple.
Having the "edit buttons" show up when you enter "edit mode" provides visual feedback, and will reduce end-user confusion. Imagine this: a first time user relates the edit icons to edit mode, therefore they know they can edit titles, menus, etc; but cannot click on links. When the leave "edit mode" they can preview/navigate the site. If the edit icons were always visible, the only clue that you are in “edit mode” is that hovering on links/titles turns them green, and the state of the edit toggle button in the upper right hand corner.
The edit icons provide simple visual feedback as to which mode you are in, and doesn't break the Joomla! template.