Custom HTML in Drupal 7 menus

One of the things I find with Drupal is although the documentation is very good it's often quite hard to get the information you need, especially when it comes to just straight forward walk throughs of how to do things. I had a problem where I needed to add a vertical line between my inline menu items. Check out the portfolio page to see what I mean. I wanted it on that menu alone and no other. Well obviously what I had to do was change the HTML output by adding in a line like

<li>|</li>

So how do you do that? Well it's actually very simple when you know how.

1. In you main drupal install folder navigate to includes/menu.inc and open in an editor.

2. Look for the function theme_menu_link and copy the entire function.

3. Now open you template.php file in you theme folder and paste the function in

4. Now you want to rename the function to something like this.... YOURTHEMENAME_menu_link__MENU_NAME

5. Now the tricky thing here which is where I stumbled extracting the information out of the Drupal comments and forums. Your menu name can be found by going to the menus admin pages, hover over edit menu for the specific menu you want to edit. You will then see in the URL preview the name of the menu. This is the machine readable name. Now that's not the hard part to find out. Basically at some point in Drupal 7 there was a patch to the menu module because if you added a hyphen into the name in the function it would cause an error in the PHP code. Don't worry if you have the latest build of Drupal 7 you don't need to patch. Anyway, the problem was fixed. Except for me it still wasn't working. The reason it wasn't work is because you have to now turn that hyphen into an underscore, as I've done in the example in point 4. Finding that information took me quite a while. The other thing to remember is the double underscore between link and your menu name.

6. Now it's just a case of adding you HTML specifically around this line,

return '<li' .="" drupal_attributes($element['#attributes'])="" '="">' . $output . $sub_menu . "\n"; </li'>

7. You can do other things if you wish, I added an if statement for example so that it wouldn't add a vertical line to the last item.

Enjoy