Columns macro

The Columns macro makes it easier to use parallel columns in a wiki.

<<Columns(start, leftcolumn)>>

Download & Release Notes

Requirements

The Columns macro requires the proper class definitions into the CSS. For example, using two columns named leftcolumn and rightcolumn the CSS should contain these lines:

#leftcolumn {
        position: relative;
        background: transparent;
        float: left;
        width: 45%;
        border-right: 1px solid gray;
        padding-left: 5%;
        padding-right: 1%;
        margin: 0px;
}

#rightcolumn {
        position: relative;
        background: transparent;
        float: right;
        width: 42%;
        padding-right: 1%;
        margin: 0px;
}

• To apply the macro to your entire site (convenient if you have a farm of wikis to change), apply the changes listed above to the /usr/share/moin/htdocs/<yourTheme>/css/common.css file. (Works as of 1.2.3, haven't tested in subsequent versions yet).

• Also, here's a columns-macro.diff file you can apply rather than editing the changes in by hand; just run patch common.css columns-macro.diff in the directory with your css files.

<<Columns(next, rightcolumn)>>

Usage

Using the Columns macro has three steps.

1. Starting the columns

   • <<Columns(start, columnname)>>

2. Breaking for the next column

   • <<Columns(next, column2name)>>

   • you can repeat the <<Columns(next, columnname)>> as long as you have unique names for each column, and your CSS supports these. (I'm not 100% sure about the uniqueness requirement, it might be possible to make a CSS with one column name that can be used for all columns)

3. Ending the Columnized area

   • <<Columns(end)>>

Technical details

The macro creates <div> -elements, and ending </div> -elements with columnname as the id-attribute. See the source code for details.

<<Columns(end)>>

Download: Columns.py

AnttiKuntsi -- 2004-06-14

Copyright

AnttiKuntsi, BoleslawKulbabinski

License

As far as the author is concerned, this code is released to the public domain, but some restrictions in the MoinMoin COPYING file may apply. Ask a lawyer.

Discussion

• Has any got this working in 1.5.8? I've tried, but unsuccessfully.

• I have if you like you can meet me at irc.freenode.net #moin -- ReimarBauer 2007-06-28 20:53:33

• For 1.5.8, you must add the css code to file /usr/share/moin/htdocs/<yourTheme>/css/screen.css. Make sure you didn't add the code to file common.css too, otherwise it won't work.

• A small problem. MoinMoin will interpret the line break ("\n") immediate after the macro label [[Columns(blah,blah)]] as a paragraph. So in both columns, everything starts with an empty paragraph ("<p> </p>") or get included in a paragraph, leaving a space on the top. This is not looking very good. But anyway, just a suggestion. I think a macro cannot control anything outside itself eh?

  • I did some further investigation and find out actually empty paragraphs does not produce any empty block at all. So we don't have the problem above actually. That was my mistake. Nice!

• Are there any known problems using this macro with V.1.3.5 + the Sinorca4Moin theme. I'm having a few rendering problems. I take it that the correct CSS file in which to include the elements above is common.css? Cheers, Casethejoint (17 Nov 05)

• I've installed a modified version of the macro in our intranet wiki. Modification: I changed the line of the div definition. It now uses "class" as identifier for the column divs instead of "id". As far as I know "id" is meant to be used as a document-wide unique identifier (like in anchors), whereas "class" can be used to address multiple elements at once. Additionally I definied several css classes for left-floating column with different widths (10%,20%,25%,33%,50%,66%,75%,80%,90%). As a result I have a small build-your-own-column-layout-kit, allowing several combinations. Example:

   <<Columns(start,column25)>>
   some text.
   <<Columns(next,column50)>>
   main text.
   <<Columns(next,column25)>>
   some more text.
   <<Columns(end)>>

  CSS snippet:

   .column25 {
     position:relative;
     float:left;
     width:23%;
     padding-left:0%;
     padding-right:1%;
     margin:0px;
   }
   .column50 {
     position:relative;
     float:left;
     width:48%;
     padding-left:0%;
     padding-right:1%;
     margin:0px;
   }

  diff Columns.py my_version_of_Columns.py

   103c103
   <             divtag += '<div id="%s"%s>'%(classname, kwstring)
   ---
   >             divtag += '<div class="%s"%s>'%(classname, kwstring)

  -- 130.75.59.69 2006-07-27 12:38:48

• At least for me (Moin v1.5, Python 2.4, Apache2, Firefox 1.5.0.10) the above changes (id to class, plus .columnXX defs in CSS) did not work. However, simply changing the .column10 to #column10 did! Specifically, I reversed the id -> class change, so Columns.py is the original version and included the above series of .column10{...} .column20{...} definitions in the common.css file as #column10{...} etc.

Thank you!

• -- Matthew Miller, Stability Networks, 2007-03-15 04:56:00

• I have attached a proposed update/change to this macro. Columns-1.8.4.py. This is tested on MoinMoin 1.8.4. It has the following enhancements/changes:

  • Inline CSS means only 1 file to deploy. No manual CSS changes required (less headache for MoinMoin upgrades too)

  • Column widths computed automatically means there can be 2 to 10 columns with no manual CSS updates (10 is an arbitrary limit which could be increased if needed)
  • I didn't bother with the arbitrary keyword arguments since I don't need it and it seems risky for XSS attacks and perhaps not aligned with the spirit of wikis with simple markup
  • Syntax changed as follows:

    • <<Columns(4, start)>>
      this is column 1
      <<Columns(4)>>
      this is column 2
      <<Columns(4)>>
      This is column 3
      <<Columns(4)>>
      This is column 4
      <<Columns(4, end)>>

  • Generically, you do:

    • <<Columns(columnCount, start)>>
      <<Columns(columnCount)>>  (Repeated as needed for the desired number of columns)
      <<Columns(columnCount, end)>>

  • Please review and let me know if you like these changes. I have contacted the original author and if folks like these changes, we can update the main text of this page accordingly.
  • Cheers! Peter Lyons (pete AT REMOVEME peterlyons com) 2010-03-07

I did some small changes to Columns-1.9.x.py based on the 1.8.4 version -- ReimarBauer 2011-03-07 09:04:16

• I've created a patch that allows you have variable width columns: variable-columns.patch