plone.app.toolbar 1.4.0

Toolbar for Plone

The goal of plone.app.toolbar is to provide an even easier way to theme Plone by creating managing toolbar inside iframe.

Contents

• Is safe to use this package?

• Installation

• Diazo rules

• Help with develpment

Is safe to use this package?

This package should be safe to install and easy to uninstall (there is also uninstall profile). That means its fairly safe to give it a try, but just in case don’t forget to create backup before testing it.

As of version 1.4.0 there is quite comprehensive unittest coverage of python code as well as high coverage of our javascript code. There are also some robot tests which are testing integration with Plone, but this will be improved with future releases.

This project will be integrated with Plone 5 and will never reach version 2.0.0. You can monitor progress of PLIP here.

If you wonder why there is no Alpha/Beta marker in version, its because version of this package is kept in sync with other projects deriving from Mockup (eg. plone.app.widgets). Version 1.4.1 would then mean we’re using Mockup version 1.4 and there was one bugfix only to the python code. Version packaged javascript inside is still in sync with Mockup project.

Installation

For now only tested with Plone 4.3.2:

[buildout]
extends = http://dist.plone.org/release/4.3.2/versions.cfg
versions = versions
parts = instance

[instance]
recipe = plone.recipe.zope2instance
user = admin:admin
http-address = 8080
eggs =
    Pillow
    Plone
    plone.app.widgets[archetypes,dexterity]
    plone.app.toolbar
zcml =
    plone.app.widgets
    plone.app.toolbar

[versions]
plone.app.jquery = 1.8.3
plone.app.vocabularies = 2.1.12
plone.app.querystring = 1.1.0


[versions]
plone.app.jquery = 1.8.3

Make sure you install the “Plone Toolbar” profile when creating your Plone site or include plone.app.toolbar:default profile in your metadata.xml..

Diazo rules

First we need to copy the toolbar’s HTML code:

<before theme-children="/html/body"
    content="//div[@data-iframe='plone-toolbar']" />

Then, in case we are not copying all resources from Plone (content) into the theme we have to include the toolbar’s resources and its dependencies as well:

<before theme-children="/html/head">
    <link rel="stylesheet" type="text/css"
        href="++resource++plone.app.widgets.css"/>
    <link rel="stylesheet" type="text/css"
        href="++resource++plone.app.toolbar_init.css"/>
    <link rel="stylesheet" type="text/css"
        href="++resource++plone.app.toolbar.css"/>
    <script type="text/javascript"
        src="++resource++plone.app.jquery.js"></script>
    <script type="text/javascript"
        src="++resource++plone.app.toolbar_init.js"></script>
    <script type="text/javascript"
        src="++resource++plone.app.toolbar.js"></script>
    <script type="text/javascript"
        src="++resource++plone.app.widgets.js"></script>
</before>

Also, in order to correctly support updating a page after using Edit, you must ensure that the element #portal-column-content exists within your theme. In short, as with Plone’s default theme, this element should correspond to the main content column. It will be repopulated with updated content after an edit action takes place via the toolbar. A rule similar to this is needed - in this case, the entire element is placed into the theme:

<replace css:theme-children="#content article"
    css:content="#portal-column-content" />

For the technically minded, the element of #portal-column-content will be repopulated with HTML corresponding to the same element ID from a response body returned after an edit takes place.

The above rules and consideration should be enough so that your theme will support plone.app.toolbar.

Help with develpment

All client side code (javascript/css/images) is done and tested as part of Mockup project.

For any feature / bug / comment please create an issue in the issue tracker.