Help with menu html code please

Hi guys

I have been building a site using a copy of the Twenty Twelve theme renamed to my sites name which is working fine.

By default I did not create a ‘menu’ within the wp-admin and I had created my styles to display how I wanted them to which was working fine. I then needed to change the menu a little so I created a new menu in the wp-Admin menu section.

However when I created a new menu in the WP-admin the styles I created were now no longer working as they were before. What I discovered is that the html code for the menu changed a fair bit with quite a few new css id’s and classes added to the html code, here is what I mean.

HTML code before creating menu wp-admin

(Please note this site is not available yet online, I am working off-line locally as it is in development)

<div class="nav-menu">
  <ul>
    <li class="current_page_item"><a href="http://dev-mysite.com.au/" title="Home">Home</a></li>
    <li class="page_item page-item-2"><a href="http://dev-mysite.com.au/?page_id=2">Sample Page</a></li>
  </ul>
</div>

HTML code after creating menu in wp-admin

<div class="menu-main-menu-container">
  <ul id="menu-main-menu" class="nav-menu">
    <li id="menu-item-12" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-12"><a href="http://dev-mysite.com.au/">Home</a></li>
    <li id="menu-item-13" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-13"><a href="http://dev-mysite.com.au/?page_id=2">Sample Page</a></li>
  </ul>
</div>

As you can see there are quite a few classes added to the code. My question is how do I remove them as part of my own theme?

I know I could just go and recreate styles for the new code but it would be much easier removing all the non required html from the menu code created, otherwise there is too much unnecessary html code.

I tried to find where I could edit that new menu code and found two files in the wordpress wp-includes folder that are named nav-menu.php and nav-menu-template.php. By altering certain parts of these files I can add or remove classes etc from the menu html created as shown in the after code above.

I tried to create a copy of these to my Themes folder and edit that one only but that did not result in the changes being done, it only worked if I edit the wp-includes files directly which I do not want to do as they may get updated with any future WP updates.

I hope the above makes sense to someone that can help 🙂 If not please let me know and I can add more info if needed.

Cheers for your help

G