History for ZMICustomization

??changed:
-
Introduction

 While working on AdytumSolutions projects as well as working on projects for PBS, I came up with a convenient way to beautify the otherwise rather unattracive default ZMI. All that is required is a .zexp import and un'tar'ing a 'dtml' directory.

Process

 Here's what we had to do:

  * create a location in Zope to hold property information for the ZMI

  * figure out what all the properties were, should be, and name them

  * unify all the different but related properties spread across multiple files

  * find all the color and style (including spacing/widths/heights) references that we wanted to customize

  * replace current hard code with dtml references using the following::

   <dtml-with expr="zmi.properties">
   <dtml-var property_name>
   ...
   </dtml-with>

   <dtml-var expr="zmi.properties.property_name">

  * export the GUI changes with the ZMI as a .zexp and 'tar' up the 'dtml' directory

 Here's all you have to do:

  * 'gunzip'/WinZip the 'dtml.tar.gz' and 'zmi.zexp.gz' files

  * move the 'ZOPE_INSTALL/lib/python/App/dtml' to a backup location

  * move 'dtml.tar' to 'ZOPE_INSTALL/lib/python/App'

  * un 'tar' 'dtml.tar' (thus creating a new 'dtml' directory)

  * move 'zmi.zexp' to 'ZOPE_INSTALL/import'

  * in your ZMI web interface, go the the main frame at the root folder, scroll to the bottom, hit the "import/export" button, in the "import" section, enter 'zmi.zexp' - this will create a folder called 'zmi' at the root location (this folder holds the images and properties for the ZMI customization)

Screenshots

 "AdytumSolutions' ZMI":http://zope.org/Members/adytumsolutions/images/adytum_zmi.jpg/image_view

 "PBS Interactive's ZMI":http://zope.org/Members/adytumsolutions/images/pbs_zmi.jpg/image_view (Note: the screenshot shows an image that just says "PBS" - this is a borrowed image that the PBS Interactive team (a small part of PBS) is using. Also, AdytumSolutions is not implmenting this for PBS Interactive; one of our developers is currently employed there and thus we are showcasing his work here.)

Caveats

 * this code is hackish and not pretty; ideally, "someone" would take out all the html-ish crud and move everything that *should* be in CSS *to* CSS... but we were in a hurry ;-)

 * the table cell counts for the tabs is fixed; there is logic in the ZMI DTML for determining this number generally, and we need to use that

 * the changes are only partially commented

 * we made changes to suite our needs; your mileage may vary

 * there is an incompatibility will this customization and certain views (like External Method views in the ZMI); we haven't taken the time to pinpoint this yet

Downloads

 Here's where you can get the stuff:

 "ZMI Properties and images":http://zope.org/Members/adytumsolutions/downloads/zmi.zexp.gz (a 'gzip' ped Zope export)

 "ZMI DTML files":http://zope.org/Members/adytumsolutions/downloads/dtml.tar.gz (tarball)