An interface to Yahoo Grids. Improves layout of topics by enabling columns in topics. Various column widths and configurations are supported. Nested columns are possible.
This add-on only installs 1 css file, and can be used safely with non-Yahoo javascript libraries.
We have 2 columns, let's call them mainleft and mainright (you are free to choose section names). The section stubs are:
%STARTSECTION{"mainleft"}%
contents of the main left column
%ENDSECTION{"mainleft"}%
%STARTSECTION{"mainright"}%
contents of the right side column
%ENDSECTION{"mainright"}%
If you do not want to have the section definitions appear twice on the page, wrap these inside a hidden verbatim:
<verbatim class="foswikiHidden"> %STARTSECTION etcetera </verbatim>
Step 2: Include the column definition
Include TwoColumnDefinition and pass column type and section names.
To make the section contents appear in a two column grid, where the right column is 300px wide:
You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.
Open configure, and open the "Extensions" section. Use "Find More Extensions" to get a list of available extensions. Select "Install".
If you have any problems, or if the extension isn't available in configure, then you can still install manually from the command-line. See http://foswiki.org/Support/ManuallyInstallingExtensions for more help.
Test
If installed, you will see 2 columns. View the source (view raw) if you want to start with a working example.
%STARTSECTION{"testleft"}%
3/4 <br />
contents of the main left column
%ENDSECTION{"testleft"}%
%STARTSECTION{"testright"}%
1/4 <br />
contents of the right side column
%ENDSECTION{"testright"}%
This doesn't work out, because the content of the section definition does not start on a newline. Instead, put the contents on a new line:
%STARTSECTION{"mainleft"}%
---+ Topic title
%ENDSECTION{"mainleft"}%
Overlapping columns
Overlapping can occur when columns are nested - this is a known bug with the grid library. Even if you don't do the nesting yourself, it can occur if you use a skin with a sidebar that is based on Yahoo Grids.