Skip to content. | Skip to navigation

Personal tools

Navigation

You are here: Home / Classes / JavaScript, jQuery & jQuery Tools in Plone / Recipe for Adding JS to theme/browserlayer

Recipe for Adding JS to theme/browserlayer

by Steve McMahon last modified Oct 23, 2011 05:44 PM
A recipe for stepping from a zopeskel theme to a browserlayer with JavaScript.

Turning a ZopeSkel theme into a browserlayer

  • Use plone3_theme skeleton
  • Remove useless eggs from package and setup.py
  • Remove skins.zcml, skins directory, profiles/default/skins.xml
  • Remove references from configure.zcml and profiles.zcml
  • Globally (entire project) replace "IThemeSpecific" with something more appropriate like IBlingoutLayer. In interfaces.py, change to simple Interface "from zope.interface import Interface".
  • Remove <interface /> section from browser/configure.zcml
  • Add profiles/default/browserlayer.xml pointing to new interface:

 

    <?xml version="1.0"?>
    <!-- Register the package-specific browser layer,
         so that it will be activated
         when this product is installed. -->
    <layers>
        <layer name="blingout.customization.layer" 
          interface="Products.blingout.browser.interfaces.IBlingoutLayer" />
    </layers>

 

Adding JavaScript to a browserlayer or theme

  • Use plone3_theme skeleton
  • Add a resource directory 'javascripts' to browser/configure.zcml:
<browser:resourceDirectory
    name="Products.blingout.javascripts"
    directory="javascripts"
    layer=".interfaces.IBlingoutLayer"
    />

 

  • Add content to profiles/default/jsregistry.xml setup step::

 

    <javascript
       id="++resource++Products.blingout.javascripts/main.js"
       cacheable="False" compression="safe" cookable="False"
       enabled="True" expression=""  inline="False"/>

 

  • Create browser/javascripts/main.js
  • Restart to process zcml
  • Reinstall to process profile step