Warning

This document hasn't been checked for compatibility with current versions of Plone. Use at your own risk.

How to Make Your CSS Changes Take Effect Instantly

by Veda Williams — last modified Dec 30, 2008 03:03 PM
This tutorial explains how to ensure that any CSS changes you make can be seen instantly. This is the most common problem themers run into when they are new to Plone.

Enabling development mode

Before beginning any CSS customization you should turn on debug-/development mode. This will guarantee that caching and compression of CSS is disabled. This will also ensure that you can see your changes in real time, after refreshing your browser.

Here is how you enable debug-/development mode:

  1. log on to your Plone site as the 'admin' user
  2. add '/manage' to the URL to access the ZMI
  3. navigate to ZMI > portal_css
  4. click the Debug/development mode checkbox
  5. click the "Save" button

When you are finished making your CSS modifications you should disable debug-/development mode as it does impact the performance of your Plone site.

Prerequisities

These instructions are not specific to any version of Plone.


Contribute

Something wrong or out of date? Anybody can edit or create a new article in the knowledge base. Simply create an account on this site, log in, and click the Edit button to contribute.