| Menus and Menu Bars
These elements can be used to create menus and menu bars.
 
| Source #1: [% buttons = [
     { link => 'headers.html', text => 'Headers' }
     { link => 'links.html',   text => 'Links'   }
     { link => 'bars.html',    text => 'Bars'    }
   ]
%]
[% INCLUDE html/menu %]
 |  | HTML Output #1: 
[ <a href="headers.html">Headers</a> ][ <a
href="links.html">Links</a> ][ <a href="bars.html">Bars</a> ]
 |  | Output #1: |  | 
 |  | Source #2: <div align="center">
[% INCLUDE html/menu select=2 left=1 right=1 %]
</div>
 |  | HTML Output #2: <div align="center">
<-[ <a href="headers.html">Headers</a> ][<b> <a
href="links.html">Links</a> </b>][ <a
href="bars.html">Bars</a> ]->
</div>
 |  | Output #2: |  | 
 |  | Source #3: <div align="right">
[% INCLUDE html/menu select=2 %]
</div>
[% BLOCK html/button    # define alternate button -%]
[% loop.first ? '[' : '' %]
[% IF link %]<a href="[% link %]">[% END -%]
[% select ? "<b>$text</b>" : text -%]
[% IF link %]</a>[% END %]
[% loop.last ? ']' : '|' %]
[% END %]
 |  | HTML Output #3: <div align="right">
[
<a href="headers.html">Headers</a>
|
<a href="links.html"><b>Links</b></a>
|
<a href="bars.html">Bars</a>
]
</div>
 |  | Output #3: |  
| Source #4: [% PROCESS html/rgb %]
[% INCLUDE html/menubar
     width   = "100%"
     content = "Menu Bar"
     border  = 1
     pad     = 6
     fill    = rgb.grey75
     edge    = rgb.blue.mid
%]
 |  | HTML Output #4: 
<table border="0" bgcolor="#000000" width="100%" cellpadding="1"
cellspacing="0"><tr><td><table border="0" bgcolor="#c0c0c0" width="100%"
cellpadding="6" cellspacing="0"><tr bgcolor="#c0c0c0">
<td>
Menu Bar
</td>
<td align="right">
 [ <a href="headers.html">Headers</a> ][ <a
href="links.html">Links</a> ][ <a
href="bars.html">Bars</a> ]</td>
</tr>
</table></td>
</tr>
</table>
 |  | Output #4: 
    
 |  
| Source #5: [% buttons = [
    { link => 'headers.html', text => 'Headers' }
    { link => 'links.html',   text => 'Links'   }
    { link => 'bars.html',    text => 'Bars'    }
    { link => 'tables.html',  text => 'Tables'  }
    { link => 'menus.html',   text => 'Menus'   }
   ]
%]
[% INCLUDE html/menubar
    content = "Another Menu Bar"
    select  = 5
    width   = '100%'
    border  = 1
    fill    = rgb.red.light
    edge    = rgb.red.dark
%]
 |  | Output #5: 
    
 |  | 
 |  | Source #6: [% buttons = [
     { link => 'tables.html',  text => 'Prev' },
     { link => 'index.html',   text => 'Index'  },
     { link => '',             text => 'Menus'  },
     { link => 'headers.html', text => 'Next'   },
   ]
%]
<font size="-1">
[% INCLUDE html/menubar
     content = "Current Menu Items"
     left    = 1
     right   = 1
     select  = 3
     width   = '100%'
     border  = 2
     pad     = 4
     fill    = rgb.green.light
     edge    = rgb.green.dark
%]
</font>
 |  | Output #6: 
    
     |  |