Personal tools
You are here: Home Documentation Tutorials DIYPloneStyle: Creating a Custom Style for Plone Getting Started - The Manual Way
Support

Get Help

Join our chat rooms or support forums if you have more specific questions.

Plone Training
Learn how to design, build, and deploy a website in Plone through one of the numerous Plone training sessions around the world.
Find Plone training…
 
Document Actions

Getting Started - The Manual Way

Preparing DIYPloneStyle for making it the skeleton of a new visual theme for Plone.

davconvent

This tutorial will teach you how DIYPloneStyle can be used as a base for creating a custom style product for Plone 2.1 or Plone 2.5 that adds to a portal a new skin selection and makes use of the new stylesheet and javascript registries.
Page 3 of 10.
  1. Uninstall the product (with the Portal Quick Installer) before modifying anything.
  2. Rename the product to something other than DIYPloneStyle (1). This must be done on the filesystem, not in the ZMI (don't laugh, it happened).
  3. Rename skins/diystyle_base_styles/diystylesheet.css.dtml to something that suits better your product name.
    This file is where you will add your own CSS rules.
  4. Rename all the folders which name starts with diystyle_base in the skins/ directory to something that suits better your product name (2).
  5. In config.py, change the name of your skin selection by modifying the name value of the first entry in SKINSELECTIONS (3). If your product won't provide more than one skin selection, you can remove the layers key from that entry (make sure SKINSELECTIONS match folder names in your skins directory).
    Change DEFAULTSKIN to make it use the name of your skin selection.
    In the STYLESHEETS declaration, replace diystylesheet.css by the name you chose for that template, omitting the .dtml suffix.
  6. In Extensions/Install.py, edit the relevant lines in the import declarations (see # CHANGE comments).
  7. In tests/testStyleInstallation.py, replace all occurences of DIYPloneStyle by the name of your product (see # CHANGE comment).
  8. Edit README.txt, give it another description, remove the usage and credits paragraphs, and replace author names and email addresses.
    If you plan to distribute your work, please leave a note stating that it is based on DIYPloneStyle.
  9. Clear HISTORY.txt from its DIYPloneStyle related content.
  10. Remove the basic example
    • Remove all the files which name starts with diystyle_example in the skins/ directory.
    • In config.py, in the SKINSELECTIONS declaration, remove the lines declaring the DIY Style Example skin.
  11. Remove the bin/ folder as the script it contains only works on a clean, left unmolested version of DIYPloneStyle.

That's it!
Now you can test the initial state of your visual theme by restarting the Zope server and installing it from the Site Setup > Add/Remove Products page (as manager, in the Plone interface).

Your Plone Site should now look like this:

Now have fun with your new project!

Troubleshooting
This part of the tutorial is likely to be the one that will put you into some trouble.
See the Troubleshooting section of this tutorial if you feel that you are in a desperate situation.

 

(1) It is safer to work with a copy of the product so that it's easy to compare with the original version if you feel like in trouble. back

(2) Unless you configured it otherwise in the config.py module, any folder located in the skins/ directory of your product will be registered as an FSDirectoryView with the portal skins tool. Because FSDirectoryViews must have a unique name/id in the skins tool, good practice is to include your product name into folder names to ensure these don't clash - particularly when using a name that might be commonly used. back

(3) In versions prior to 1.0.3, the name of the skin selection is setup using the SKINNAME variable. back

 
by davconvent — last modified May 15, 2007 - 08:28 All content is copyright Plone Foundation and the individual contributors.

Where is config.py?

Posted by fh9 at November 20, 2007 - 08:31
In step 5 above, you mention config.py - but this file is not part of the curent version of the product?
Am I missing something?

DIYPloneStyle now uses a GenericSetup profile

Posted by davconvent at November 20, 2007 - 11:02
That's right.

From Plone 2.5 on, it is recommended to use a GenericSetup profile for third party products installation, instead of installing from an Install python external method.

What used to be set in 'config.py' (and read by the install method) is now set in the GenericSetup XML files located in the 'MyTheme/profiles/default/' directory on the file system. For instance, 'portal_skins' settings can be changed in 'skins.xml', Stylesheets registry settings are made in 'cssregistry.xml', etc.

All the XML files contained in the DIYPloneStyle basic skeleton contain inline documentation to help you find your way when customizing the theme related settings of a Plone portal.

most of this is done in latest version

Posted by deb193 at January 5, 2008 - 02:13
Since the latest version moves the example into a sub-directory, and is essentially aleady a skeleton. Most of the files/folders referenced above do not exist and/or have already been renamed. Readers should focus on what was goin on, but not expect to be able to perform these steps.

For any issues with the web site functionality, please file a ticket.

Please consult the policy on plone.org content if you want your content published on this site.

Servers and hosting by