How to Add New Class Styles to Kupu

by Anne Bowtell last modified Mar 19, 2010 10:01 AM
Contributors: Yuri Carrer
This document explains how to add and define new custom class styles for use in kupu.

 Pre-requisites: CSS knowledge

1. Go to Site Setup in your Plone site.

2. Select the kupu visual editor add-on product configuration icon, as seen below:

Site-setup kupu

 

3. Scroll down to the paragraph styles box.

Kupu paragraph styles

4. Add your new paragraph style in the box. Format is title|tag or title|tag|className, one per line. For example:

Smalltext|p|smalltext

5. Open your ZMI.

6. Make sure that your site is in debug mode when first making changes. This will allow you to see your changes right away. 

7. Go to http://yoursite/portal_skins/plone_styles/ploneCustom.css/manage_main.

8. Click the customize button.

9. Enter your new paragraph style where it says “add your custom stuff here”.

.smalltext {font-size: 70%;}

Note: scroll down the page for available elements. See base_properties for definitions of those elements.