Remove all Menu Li Classes, Replace with first, last, active

I’ve been having a hell of a time removing all of word-presses default menu classes from the li’s while keeping first and last

Can I ask… why?

and replacing current-menu-item with active, the standard for css.

No – that’s completely incorrect. For a start, there’s no standard for class names in CSS. And the current-menu-item class is not the same as the :active pseudo class. Those two classes are used for entirely different things.

I am also very interested in a solution to this. I have been trying almost since the release of WordPress 3.0 to accomplish just this. Why you ask? I’ve already developed an external CSS file that defines various, specific classes for my navigation menu. I want to use this same CSS file across the entire site – some pages of which may be using WordPress and some pages are not. Also, I find that the additional id’s and classes that WordPress throws in there are not necessary for my purposes and just creates superfluous and clunky HTML. Using the single word “active” verses “current-menu-item” is just a personal preference of mine. I have created a walker class that strips a lot of the code, but a solution for cleaning up the the li elements still proves to be annoyingly elusive. Below is my walker that I’ve got so far (placed in the functions.php file):
[Code moderated as per the Forum Rules. Please use the pastebin]

And then within the PHP file where the menu should appear, I simply put the following block of code:
[Code moderated as per the Forum Rules. Please use the pastebin]

Another option that I found on stackoverflow.com (see here) is to insert the following block of code in your functions.php file:

add_filter('nav_menu_css_class', 'my_css_attributes_filter', 100, 1);
add_filter('nav_menu_item_id', 'my_css_attributes_filter', 100, 1);
add_filter('page_css_class', 'my_css_attributes_filter', 100, 1);
function my_css_attributes_filter($var) {
  return is_array($var) ? array() : '';
}

The above solution is great for stripping out most of the unwanted id’s and classes, but still leaves

class=””

on the li element instead of deleting the class altogether. It also failes to remove the

class=”sub-menu”

on the ul element of a submenu.

Whether using a custom walker or some other block of code in the functions.php file, the desired end result is HTML that looks like this:
[Code moderated as per the Forum Rules. Please use the pastebin]

If anybody out there can provide some additional insight, modifications to the code above, or some other way of accomplishing this end result, I’m sure there are a lot of people out here in the WordPress community – myself included – that would greatly appreciate it.

Here is an updated version of the walker that strips out all of the WordPress mess from the menu code:
[Code moderated as per the Forum Rules. Please use the pastebin]

While doing an excellent job of stripping out unnecessary code, this does nothing to add the first and last classes and I’m not 100% pleased with the line breaks and tabs. I’m still searching for that perfect solution. Does anybody out there know what it is?

I’ve implemented the same start_el function mentioned above, and the most elegant way to mark the first and last menu item is to add it to the “CSS Classes” field in the actual menu editor. Simple – but gets the job done.

I’m still struggling with this. Unfortunately, the solution offered by forbze does not work. It would appear that my custom walker (see above) strips out any custom classes I insert from the backend. I would offer a reward for an answer, but after reading the forum rules, I’ve found that I can’t offer money for a solution to this through these forums. If somebody has already created a custom walker or some other function that pulls this off – I would be very grateful if you would share that with us.

Also, since I can’t edit the above, I’ll repost some updated specifications for what I’m trying to do. The goal is for the final HTML to look like this:

[Code moderated as per the Forum Rules. Please use the pastebin]

I use this to make the sub-menu have the class “menu” instead of “sub-meu”. I am sure that you can change it to remove the class:

function start_lvl(&$output, $depth) {
    $indent = str_repeat("\t", $depth);
    $output .= "\n$indent<ul class=\"menu\">\n";

  }

Okay folks, I’ve finally found an answer to this problem. Praise God. Yes, I have been working on it this whole time. It has been, by far, the most frustrating thing I have ever tried to do with WordPress. Here is the fix on how to achieve a clean WordPress menu, using wp_nav_menu without resorting to a custom walker:

https://pastebin.com/470Q2G9K – place this code in your functions.php file

https://pastebin.com/u1tNQ8XY – place this code in your theme file where you want the menu to appear

The above solution doesn’t place line breaks or tabs as nicely as I would like, but aside from that – I’d say it does a nearly perfect job! If anybody has any comments or suggestions, please post a reply – I’d love to keep making this better.

Thanks.

Since I posted the above two links, I discovered a couple of mistakes. I guess I was just too excited to put up my results. Here’s two new links that should work better:
https://pastebin.com/W16cxDfY – functions.php
and
https://pastebin.com/CGx4aprf – for your WordPress template