CMS Made Simple Forums

Hi:

we're currently using cmsms v1.10.3. I'm building a catalogue without any of the available modules. so, far, it's working. I need help modifying the simple_navigation template or custom build one to accommodate the following structure on category pages.

2 Catalogue
2.1 Hats
2.1.1 Fashion
2.1.1.1 Feathered Hat
2.1.1.2 Fedora
2.1.1.3 Baseball Hat
2.1.2 Work Hats
2.1.2.1 Hard Hat
2.1.2.2 Diving Helmet
2.1.2.3 Bike Helmets
etc.

I need category menu on the page to display levels in this manner:

<img for Hats> - Level 2: I already done in the page template.
<h2 class="catHdg">fashion</h2> - level 3 item
<div class="subCatItems">
<img src="fethered hat"><br/>
<a>Feathered Hat</a> - level 4 item
</div>
<div class="subCatItems">
<img src="Fedora"><br/>
<a>Fedora</a></div> - level 4 item
<div class="subCatItems">
<img src="Baseball Hat"><br/>
<a>Baseball Hat</a> - level 4 item
</div>
<h2>Work Hats</h2> - level 3 item
<div class="subCatItems">
<img src=" Hard Hat"><br/>
<a> Hard Hat</a> - level 4 item
</div>
<div class="subCatItems">
<img src="Diving Helmet"><br/>
<a>Diving Helmet</a> - level 4 item
</div>
<div class="subCatItems">
<img src="bike helmets"><br/>
<a>bike helmets</a> - level 4 item
</div>

i want to show all level 3 items in <h2> non-clickable tags and the level 4 items should display page image, level 4 menu title, and be linked to page.

This is where is gets a little tricky.
Category banner (rectangular) images for level 2, used at the top of the page, will be selected from content_image block.
Category menu listing image (square) for level 4 menu items are selected from page_image under Option tab.

When user clicks on level 4 items, the category menu on the page should display menu items in this manner:

<img for Feather hats> - level 4 item. I already done in the page template.
<div class="items">
<a link to item page><img src="aboriginal feather hats"><br/>
aboriginal fethered hat</a><br/>
$ Price
# item Number - level 5 item
</div>
<div class="items">
<a link to item page><img src="pigmie feather hats"><br/>
pigmie feather hats"></a><br/>
$ Price
# item Number - level 5 item
</div>
<div class="items">
<a link to item page><img src="warrior feather hats"><br/>
warrior feather hats</a><br/>
$ Price
# item Number - level 5 item
</div>

I want to display level 5 items as linked square images (these will also come from page_image under option tab.), with level 5 page title and if possible content_block for price and content_block for item #/SKU. Mockup images are attached for a simpler explanation in case i'm not clear.

I could really use a smarty guru on this one. thanks everyone.