How can I split and wrap HMENU items in TYPO3?

Question

I'm trying to create a custom menu with TypoScript, I have 8 Menü items an d I want to remove the css class "dropdown_1column and dropdown_1column" for the first 2 items and I do not know how?

I have experienced that it is with the Typoscript onSplit function possible, whats wrong in this code?

 wrap = <ul class="levels">|</ul>|| <ul class="levels">|</ul>|*|<div class="dropdown_1column"><div class="col_1 firstcolumn"><ul class="levels">|</ul></div></div>||<ul class="levels">|</ul>

The first two items should be wrapped in:

 <ul class="levels">|</ul>

The remaining items should be wrapped in:

 <div class="dropdown_1column"><div class="col_1 firstcolumn"><ul class="levels">|</ul></div></div>

here ist my html output:

<li>
   <a class="drop" href="blblbl/">item</a>
      <div class="dropdown_1column">
          <div class="col_1 firstcolumn">
            <ul class="levels">
               <li>
               <li>
               <li>
            </ul>
      </div>
 </li>

and it must be so

<li>
   <a class="drop" href="blblbl/">item</a>
      <div>
          <div>
            <ul class="levels">
               <li>
               <li>
               <li>
            </ul>
      </div>
 </li>

Thank You for Help.

Answer 1

You could either go fo optionSplit to format items based on their position or you could split the menu in two parts and use begin and maxItems to define the range of items to use.

The latter is less sophisticated but should serve you well:

10 = COA
10 {
  10 = HMENU
  10 {
    # your menu definition here
    maxItems = 2
    wrap = <ul class="levels">|</ul>
  }
  20 = HMENU
  20 {
    # your menu definition here
    begin = 3
    wrap = <div class="dropdown_1column"><div class="col_1 firstcolumn"><ul class="levels">|</ul></div></div>
  }
}

Answer 2

Your option split syntax is wrong. It must be first |*| middle |*| last first |*| middle |*| last first |*| middle |*| last . Elements are filed in beginning from last. You can further split each property by a double pipe ( || ).

first || second |*| middle |*| second last || last

Thus it should be

wrap = <ul class="levels">|</ul>|| <ul class="levels">|</ul>|*| <div class="dropdown_1column"><div class="col_1 firstcolumn"><ul class="levels">|</ul></div></div> |*|  <div class="dropdown_1column"><div class="col_1 firstcolumn"><ul class="levels">|</ul></div></div>

which has the format

first || second |*| middle |*| last

whereas the middle and the last part share the same code

Answer 3

I'd say that no one has read TSref here :)

What you need:

According to 4th rule of optionSplit 1 :

"if the last part is absent, the middle value is repeated"

So the most elegant and shortest optionSplit syntax will be:

first || second |*| the_rest

In Typoscript code it will be something like:

<ul class="levels">|</ul> || <ul class="levels">|</ul> |*| <div class="dropdown_1column"><div class="col_1 firstcolumn"><ul class="levels">|</ul></div></div>

What you got:

The optionSplit you wrote has syntax like this:

F || S |*| M1 || M2

which produces menu like:

F S M1 M2 M1 M2 M1 M2....

because the (the last, or if absent) the middle part is repeated continuously after the first part.

For more about optionSplit .