Part 4. How to Change Flow Plone Theme Columns Width

Tutorial about changing columns width in Flow Plone 4 Theme.

The following tutorial covers changing of Flow Plone Theme columns width on a Plone 4 website. See instructions for diazo Flow theme column width customization and Column Width Customization in Plone 3.

Content area on a site where Flow Plone Theme installed is subdivided into three columns: column one and two are usual portlet column with content area between them.


Column width can be changed: we define first and second columns  width, then main content area is generated on the basis of the other two.

You can change Flow Plone 4 Theme columns via Zope Management Interface. Go to portal_skins -> flow_styles. There is base_properties document inside:


that contains information about Plone's color, logo ans border defaults. Now column one width is 234px, column two width is 174 px. In case you want to change these numbers press Customize button.


In the opened window change columnOneWidth value from 234px to your new column width,and columnTwoWidth from 174px to new value. Do not delete px. Let's put, for example, columnOneWidth value = 200px, and columnTwoWidth value = 250px.


Save changes. Now return to Plone Interface and you'll see your changes applied: column one narrowed (from 234 to 200px), column two widened (from 174 to 250px) with navigation items lines widened as well.


Connect with our experts Let's talk