Menu with separate Image for Each Page using optionSplit

Typoscript to have custom image menus with different image for each page using optionSplit…

I was just curious on how to get a separate image as menu item for each page. Then I found that we can use the optionSplit funtion to do this.

The example shows how to do this.

# Page Menu – a 3rd level menu

lib.pagemenu = COA
lib.pagemenu.10 = HMENU
lib.pagemenu.10.entryLevel = 3

# Level 3

lib.pagemenu.10 {
    stdWrap.ifEmpty.wrap =  
    1 = TMENU
    1 {
        wrap = <div class=”numbers”>|</div>
        expAll = 1
        NO.allWrap.dataWrap = <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”1.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”2.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”3.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”4.gif”></a>
        NO.doNotShowLink = 1

        ACT < NO

        CUR = 1
        CUR.allWrap.dataWrap = <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”1-mo.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”2-mo.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”3-mo.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”4-mo.gif”></a>
        CUR.doNotShowLink = 1
    }
}