The following tutorial covers changing of Chameleon Plone Theme columns width on a Plone 3 website. See more instruction for different Plone versions in Chameleon diazo theme column width customization in Plone 4.1 and Column Width Customization in Plone 4 tutorials.
Content area on a site with Chameleon Skin installed is subdivided into three columns: column one and two are usual portlet column, column three - is a content area.
Column width can be changed: we define first and second column width, and the third column width is generated on the basis of the other two.
1. Column width change via Zope Management Interface
Go to ZMI and select portal_skins -> qploneskinchameleon. This folder has base_properties document,
that contains information about Plone's color, logo ans border defaults. Now column one width is 215px, column two width is 200px. In case you want to change these numbers press Customize button.
In the opened window change columnOneWidth value from 215px to your new column width,and columnTwoWidth from 200px to new value. Do not delete px.
If you change columnOneWidth or columnTwoWidth value you should change the corresponding columnOneWidthInteger and columnTwoWidthInteger value as well, but no px here. The numbers in ColumnWidth and ColumnWidth Integer lines should coincide so that skin view is not broken.
Let's put, for example, columnOneWidth value = 190px, then columnOneWidthInteger value = 190. And columnTwoWidth value = 220px, then columnTwoWidthInteger = 220.
Save changes. Now return to Plone Interface and you'll see your changes applied: column one narrowed (from 215 to 190px), column two widened (from 200 to 220px).
2. Column Width change via File System
There is a base_properties document in qploneskinchameleon folder:
Open it and you will see the list of main skin properties: Plone's color, logo ans border defaults:
Now column one width is 215px, column two width is 200px. In case you want to change these numbers - change columnOneWidth value from 215px to your new column width,and columnTwoWidth from 200px to new value. Do not delete px.
If you change columnOneWidth or columnTwoWidth value you should change the corresponding columnOneWidthInteger and columnTwoWidthInteger value as well, but no px here. The numbers in ColumnWidth and ColumnWidth Integer lines should coincide so that skin view is not broken. Let's put, for example, columnOneWidth value = 190px, then columnOneWidthInteger value = 190. And columnTwoWidth value = 220px, then columnTwoWidthInteger = 220. Save changes. Now restart server so that changes are applied. When you get back to Plone interface you will see your changes applied: column one narrowed (from 215 to 190px), column two widened (from 200 to 220px).