How to?

This needs to be added to the ‘css classes’ field for the menu item. If you don’t see have that field shown, add it by selecting ‘css classes’ in the ‘Show advanced menu properties’ section of the ‘screen options’

Hello thank you for the reply. I must have overlooked that part of the setup. I have adjusted things properly and added the mpopup tag to the class section, however its still not working. Has this plugin been tested on websites that use ajax to load pages without refreshing the website?

Please provide a link to your site with an indication of which menu item the mpopup class is applied to.

No specific testing for sites that load content via ajax without a reload has been performed.

Website: https://www.noize.fm

You can find the Popup link as a sub menu to the artist menu on the main navigation at the top of the site.

Your link does not have the mpopup class applied to it. If you view the page source the menu item looks like:

<li id="menu-item-3028" class="menu-item menu-item-type-custom menu-item-object-custom"><a href="https://noize.fm/popup.html"><i class="mpopup"></i>Popup</a></li>

The mpopup class is applied to an ‘i’ element within the menu item instead of the menu item. This may be due to your theme or another plugin diddling with the menu walker. To investigate whether this is the case this you can temporarily deactivate all other plugins and switch to a default theme such as twentyfifteen.

Could I add the class manually in the custom css section of my theme using something like this?

.menu-item-3028{class: mpopup !important;}

no, that will not work work – the browser will not understand it as it is not valid css.

If your theme is breaking the default WordPress behaviour and is not allowing you to add classes to menu items you need to ask the vendor of your theme why this is and how to prevent it.