<< ALL BLOG POSTS

Turn static theme into a Diazo theme through the web

Table of Contents

static to diazo Overview

  1. Find/Create a static theme
  2. Create a new Diazo theme in the Theming control panel
  3. Copy in files from theme
  4. Write/Build the rules.xml

Detailed Steps

  1. sample final themeFirst you’ll need a static theme. You can create one yourself, or find one on a free template site (make sure to read the terms of use!). The great thing is the theme doesn’t need to know anything specific about Plone, but you should still make sure all Plone elements that you want are displayed in the theme.

  2. Create a new Diazo theme

    • Go to Site Setup > Theming (or directly to @@theming-controlpanel)
    • Click the ‘New theme’ button. You will have the option to immediately enable the new theme. Note: I do not recommend this for a live site.
  3. You are taken to a theme editor where you can upload all files from your theme. Keep the folder structure the same. The only files you’ll need in addition to your static files are rules.xml and manifest.cfgmodify theme sample

  4. Write the rules. This is a single file that replaces the static content in your theme with dynamic content from Plone, based on the rules you define. The theme editor has tools built in to help you write the rules.

Show inspectors - This turns on a couple frames in the window, showing you both the static theme and unthemed Plone site. Hovering or clicking on the elements will give you a selector for that element.

inspector

Build rule - This is a wizard that writes rules for you based on settings you enter and elements you select. This is very helpful for learning Diazo syntax.

Build rule 1

build rule 2

Help - This displays the manual for plone.app.theming - the product that turns your Diazo theme into a Plone theme.

Once you have built all the rules, you can then Activate your theme in the Theming Control Panel to apply it to the entire site.

 

Like what you've read? Have a suggestion of something you'd like to see? Leave a comment below! You can see more trainings like this one at sixfeetup.com/plone-cms/plone-how-to. Also, be sure to sign up for our weekly Plone & Python How-To digests.

Related Posts
How can we assist you?
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.