Joomla How to customize main menu

Question

I am learning joomla and faced the next problem.

Here is the main menu in HTML

<ul>
    <li class="active"><a href="#">home</a></li>
    <li><a href="#">bio</a></li>
    <li><a href="#">news</a></li>
    <li><a href="#" class="first-lev">projects<span class="ico"></span></a>
        <div class="sub-nav">
            <ul>
                <li><a href="#">yegor<br/>zabelov<br/>trio</a></li>
                <li><a href="#">gurzuf</a></li>
                <li><a href="#">soundtracks</a></li>
            </ul>
        </div><!-- .sub-nav -->
    </li>
    ...
</ul>

How is it possible to customize the main menu in joomla to:

1. add the class .first-lev to some links

2. add the span inside the item with this class

3. add the wrapper div for sub navigation

Appreciate any help.

Answer 1

1. To add the class to the some links, just go to the admin panel, select your menu item. Go to the link type options->link CSS style, and add class manually.

2. You need to edit default_component.php or defaul_url.php

3. You need to edit default.php

http://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core
To customize menu layout, just copy

/modules/mod_menu/tmpl 

to:

/templates/your_template/html/mod_menu

And then customize the files you just copied. This files override system mod_menu files.
Don't forget to add:

<folder>html</folder> 

at you templateDetails.xml.