Support » How-To and Troubleshooting » add "data-icon" field to Nav Menu for icomoon font glyphs

add "data-icon" field to Nav Menu for icomoon font glyphs

  • I have been search for a snippet that will create an additional field for the WordPress Navigation Menu. I particularly need to have a field wrapped inside of a <i class="glyph" data-icon="icon-chart"></i> just before the <li class="menu-item">Home</li>. currently, using CSS pseudo :before is doing the trick, but it is recommended to use “data-icon” instead for faster performance. Also, this will make it very easy for clients to be able to add their own font-glyphs without editing CSS.

    I don’t prefer to use the “description” field for WP nav menus, or even manually inserting inline html <i class-"icon-chart"></i> inside the label field.

    Possibly later on, I can work on extending the field to show a drop down list selector for each menu item, but will require some extensive code.

    I’ve read the documentation here, but not having any luck getting an additional field in the WP Nav Menu editor and the html.


    Any tips would be greatly appreciated.

  • The topic ‘add "data-icon" field to Nav Menu for icomoon font glyphs’ is closed to new replies.