Liftweb Menu customization

Question

I want to create a menu that looks like:

HOME | FOO | BAR | ABOUT | CONTACT

How might I go about doing this?

Here is what I have tried:

&         


        

Answer 1

Having found the other answers unsatisfactory I discovered my own solution...

(Note that I am new to Lift and believe menus are too difficult to code manually)

Solution

• Partially use MenuWidget (from lift-widgets) to do the plumbing of enabling superfish menus
• Don't use MenuWidget to render the menus as it doesn't do it properly
• Use the standard Menu.build to render the menus
• Add extra stuff to properly terminate the 'floating' effects of the menu
• Add extra stuff to enable centered menus

Full solution is available at: http://subversion.assembla.com/svn/freshcode_public/learn_scala/lift/src/main/scala/code/snippet/CustomMenu.scala

package code.snippet

import net.liftweb.widgets.menu.MenuWidget
import xml.{Text, NodeSeq}

object CustomMenu {

  private def styleElem = {
    
  }

  def render(in: NodeSeq) = {
    // Need to get MenuWidget to provide the plumbing
    // We render menu ourselves because MenuWidget doesn't seem to do it properly.
    MenuWidget(List("No Group")) ++
      
        {styleElem}
       ++
      

          
      
 ++
      // This div terminates the floating effects properly.
      

  }
}

Usage:

nothing