Ellipsis

References

"Where is What":http://plone.org/documentation/tutorial/where-is-what/ "Using DIYPloneSytles to create custom sytles": http://plone.org/documentation/tutorial/creating-custom-style

Prerequisites

Have the following downloads in ~/Projects/plone/Downloads

• DIYPlone

Immediately prior to presentation

• Fresh reboot and all apps off
• Delete test svn directory
• Rm -rf ~/Projects/plone/Zope
• Set display not to sleep
• Start Snapz X pro
• Start with Plone 2.1.2 already downloaded and Admin password already set
• Start Apps. Safari will be used for anonymous view, Camino for admin, Firefox for PeterB, Mozilla for talk (or paper), TextMate for Editing

Goals for today

• Understand the difference between Zope and Plone, and how to install Plone in Zope
• Understand how to create a Plone site in Zope, and preform basic content customization
• Understand why skin development is importance for scaling and maintenance

Getting started

We have a Mac OS 10.4.5 with Python 2.3.5 as part of the OS, Zope 2.8.6 built from source in to /usr/local/bin (note that the Plone packaged install uses Zope 2.7.X, and Zope builds well in MacOS)

• Make a local zope instance:

  cd ~/Projects/plone
  /usr/local/bin/mkzopeinstance.py  # Enter "Zope" for dir, and peterb for user
  

• Enter admin info, then:

  cd Zope
  tar -zxf ~/src/Plone-2.1.2.tar.gz
  mv Plone-2.1.2/* Products/
  

• Set debug mode on by setting "debug-mode on":

  mate etc/zope.conf
  bin/zopectl start
  

• Create our site (in Camino)

  • Open ZMI at http://localhost:8080/manage
  • Create wag site: "Plone Site" [Add] (make sure Id is lowercase)
  • Open wag in ZMI and note all the objects available for customization
  • Login and update page: Welcome to Web Advisory Group

Creating a distinctive WAG site

Let's compare the default plone site at localhost://8080/wag to the WAG 2.1 site at http://tremor.dpc.ucar.edu:9508/wag (soon to be at www.ucar.edu/wag). The WAG site is to have a cleaner design (configuration, and some configuration) and a distinctive style (skin) and navigation and text (content) appropriate to our needs.

Skin/Style Customizations

Key point: code and customizations on the filesystems, content and configuration in to ZODB

Key point: presentation of content is called a skin. We're looking at the default skin. The skin can be customized either TTW (through-the web) or by building a skin product. First we will do it TTW (and show the drawbacks to that)

• ZMI -- wag -- portal_skins -- plone_styles -- base_properties -- customize (note that this has been deprecated, but there's no info on what it's been replaced by)

• Customizing will create base_properties in portal_styles -- custom -- base_properties

  change Text and Line Width (be sure to tick checkboxes)

• view it

• undo it: The entire zope site is kept with one potentially very large database called the ZODB that's kept in the fileystem in var/Data.fs. We'll say more about that later....

Reasons for using Filesystem devel instead of TTW

• TTW makes for a very messy undo list in your ZODB
• TTW makes it hard to know happened where, when
• Filesystem lets you find bits of code with grep, find
• Filesystem lets you use a real version control system
• Filesystem lets you save skin variants for management to review
• Filesystem lets you use your favorite editor!

Create WAGSkin product for on-the-filesystem development

Download DIYPloneStyles, generate "fresh" WAGSkin, and open in TextMate:

cd ~/Projects/plone/Zope/
wget http://plone.org/products/diyplonestyle/releases/1.0.5/diyplonestyle-1.0.5.tar.gz
cd Products && tar -zxf ../diyplonestyle-1.0.5.tar.gz
DIYPloneStyle/bin/generator.py --productname WAGSkin # Note: this must be using python 2.3.5
cd WAGSkin
mate .

(Note that we're using diyplonestyle 1.0.5 The recently released 2.1.X series doesn't automatically include the base styles, so you have to turn that on yourself, which I've not yet figured out, or build all styles from scratch)

Commit fresh WAGSkin to Subversion:

svn mkdir -m "committing fresh WAGSkin"  http://svn.dpc.ucar.edu/test/plone
svn mkdir -m "committing fresh WAGSkin"  http://svn.dpc.ucar.edu/test/plone/Products
svn mkdir -m "committing fresh WAGSkin"  http://svn.dpc.ucar.edu/test/plone/Products/WAGSkin
cd ~peterb/Projects/plone/Zope/Products/WAGSkin
svn co http://svn.dpc.ucar.edu/test/plone/Products/WAGSkin/. .
svn status
svn add skins Extensions
svn commit -m "committing fresh WAGSkin"

Add product to site (this may not be absolutely necessary with debug-mode on):

~/Projects/plone/Zope/bin/zopectl restart

Browse to "Plone control panel":http://localhost:8080/wag/ -- Site Setup -- Add/Remove Products

Make sure to refresh browser (Firefox: Command-Shift-R or CTRL-Shift-R)-- and if this isn't working for you, remember to have debug-mode on in your zope.conf

Customize WAGSkin

Now lets tune up this site

• open skins/wagskin_styles/base_properties.props

• change backgroundColor to Yellow, reload

• now replace the banner with Sylvia's work (and change reference in base props):

  svn cat http://svn.dpc.ucar.edu/test//plone-works/Products/WAGSkin/skins/wagskin_styles/wag_banner.png > wag_banner.png
      svn cat http://svn.dpc.ucar.edu/test//plone-works/Products/WAGSkin/skins/wagskin_styles/listspacer.gif > listspacer.gif
      svn add listspacer.gif  wag_banner.png 
      svn commit -m "Graphics"
  

• now replace whole base props document with what we have that works in Subversion:

  svn cat http://svn.dpc.ucar.edu/test//plone-works/Products/WAGSkin/skins/wagskin_styles/base_properties.props
  

• and view the changes with svn diff. Commit to Subversion

• now change the CSS, but checking out what I already have in subversion:

  http://svn.dpc.ucar.edu/test/plone-works/Products/WAGSkin/skins/wagskin_styles/wagskin.css.dtml
  

• commit to Subversion

Next, we'll modify Extension/Install.py and Extensions/util.py to insert a custom UCAR tab on the right side. This use of the API could be used to do all of the ZMI changes we did above to remove unnecessary links.

• For the sake of preserving indentation, we'll do this, then describe what's happened:

  # remove product from wag site
  zope stop
  cd ~//Projects/plone/Zope/Products/WAGSkin/Extensions
  svn cat http://svn.dpc.ucar.edu/test/plone-works/Products/WAGSkin/Extensions/utils.py > utils.py
  svn cat http://svn.dpc.ucar.edu/test/plone-works/Products/WAGSkin/Extensions/Install.py > Install.py
  zope start
  

• Show diffs in TextMate

• All of this accomplishes editing Extensions/utils.py and adding near the top:

  from Products.CMFCore.permissions import View
  
  def setupUCARTab(self, out):
         at=getToolByName(self, 'portal_actions')
  
         at.addAction('ucar_tab',
                      name='UCAR',
                      action='string:http://www.ucar.edu',
                      condition='',
                      permission=View,
                      category='portal_tabs',
                      visible=1)
  
         print >> out, "Added UCAR Tab"
  
         # Move index_html to the bottom
         # (cribbed from ConfigurationMethods.py in CMFPlone)
         cloned_actions = at._cloneActions()
         num_actions = len(cloned_actions)
         state_index = 0
         for action in cloned_actions:
              if action.id == 'index_html' and action.category == 'portal_tabs':
                  break
              state_index = state_index + 1
         state_action = cloned_actions.pop(state_index)
         cloned_actions.append(state_action)
         at._actions = cloned_actions
  
         print >> out, "Moved Home Tab"
  

• and editing Extensions/Install.py and adding the following to the install(self) function:

  setupUCARTab(self,out)
  

Extending Plone with an Archetype-based custom Content Type

I've been wanting to make a site where I can keep a public record of the rare outages at DLESE.org, and I decided to try Plone's Archetypes product to create a custom "Outage" content-type. Let's see what it looks like, then how it's made

• Checkout and restart:

  cd ~/Projects/plone/Zope/Products
  svn co http://svn.dpc.ucar.edu/sysadmin/trunk/plone/Outage 
  zope restart
  

• Install in Plone Add/Remove products, then go to home page and add new "Outage"

• Enter sample data for Title, Description, Start Time, Duration, etc. Enter a bad email and see how it fails nicely

• Enter again, but see that if fails badly with an alpha in an Integer field -- but there's not a corrups "Outage" in the folder

• So change all the integer lines to something like:

  IntegerField('expected_hours', validators=("isInt")),
  

• Restart Zope, and test if there's time

• The next steps would be to create a custom folderish type, OutagesFolder, that organized multiple outages by date, and edit .pt files to display nicely. Also, add logic to send email updates to indicated groups.

Hosting Plone

<VirtualHost *:80>
ServerName wag.ucar.edu
RewriteEngine On
RewriteRule ^/(.*) http://localhost:8080/VirtualHostBase/http/wag.ucar.edu:80/wag/VirtualHostRoot/$1 [L,P] 
</VirtualHost> 

<VirtualHost *:80>
ServerName itc.ucar.edu
RewriteEngine On
RewriteRule ^/wag/?$ http://127.0.0.1:8080/VirtualHostBase/http/itc.ucar.edu:80/VirtualHostRoot/wag/ [L,P]
RewriteRule ^/wag/(.*)$ http://127.0.0.1:8080/VirtualHostBase/http/itc.ucar.edu:80/VirtualHostRoot/wag/$1 [L,P]
</VirtualHost> 

<VirtualHost *:80>
ServerName plone.ucar.edu
RewriteEngine On
RewriteRule ^/itc/wag/?$$ http://127.0.0.1:8080/VirtualHostBase/http/plone.ucar.edu:80/wag/VirtualHostRoot/_vh_itc/_vh_wag/ [L,P] 
RewriteRule ^/itc/wag/(.*)$ http://127.0.0.1:8080/VirtualHostBase/http/plone.ucar.edu:80/wag/VirtualHostRoot/_vh_itc/_vh_wag/$1 [L,P] 
</VirtualHost>