I'm trying to get a menu with my custom classes.

I would like to be able to

<ul class="my-menu">// class of the whole ul
<li class="with-sub">// add class "with-sub" if has children
<a href="#">submenu</a>
<ul class="sub-menu"> // add class sub-menu to sub menu ul
<li class="title-of-the-parent">// add the title of the parent as first item of the list
<a href="#">TITLE OF THE PARENT</a>
<li class="my-submenu-item">// add a class to all sub-menu items
<a href="#"> Submenu item</a>

For the first level it's fine. I can use menu_tree and menu_link to get what I want.

I would like to know how to use $sub_menu = drupal_render($element['#below']) and customize the sub menu list.

I don't want to use any module, I want to do all through the template.php.

Thanks in advance


2 Answers 2


Take a look at theme_menu_tree() and theme_menu_link(). It should be all you need.

Sorry for the lack of examples, but theme_menu_tree is rather self-explanatory, and the page for theme_menu_link provides several examples.

  • Thanks enzipher, I will take a look. The problem is that I don't find the key for the submenu... for the first level everything it's fine. Nov 19, 2012 at 19:54
  • 1
    It's a recursive function, so it's valid for the submenu items as well. No need to do anything with the submenu rendering itself, although if you need to insert an element you might need to look into that, and in that case you should look into $element['#below'] which contains the submenu.
    – dxc
    Nov 19, 2012 at 20:09
  • I need to have a class for the menu (ul and li) and a class for the submenu (ul and li). Nov 20, 2012 at 9:26

I've solved in this way:

Drupal adds a class menu to the main menu use the preg_match to find it.

function my_theme_menu_tree__menu_block_3($variables) {
  if (preg_match("/\bmenu\b/i", $variables['tree'])){ // if class is menu
    return '<ul class="main-menu">' . $variables['tree'] . '</ul>';
  else {
    return '<ul class="submenu">' . $variables['tree'] . '</ul>';

function _menu_link__menu_block__3(array $variables) {
  $element = $variables['element'];
  $sub_menu = '';
  $parentclass = '';
  $liclass = '';

  if ($element['#below']) {
    $sub_menu = drupal_render($element['#below']);
    $parentclass = "sub";
  if ($variables['element']['#original_link']['depth'] == 1) {
    $liclass = "top";

  $output = l($element['#title'], $element['#href'], $element['#localized_options']);
  $list_menu = '<li class="' . $liclass . ' ' . $parentclass .  '">' . $output . $sub_menu . "</li>\n";
  return $list_menu;

Other implementations are welcome.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.