Adding content inside the anchor tags within WordPress main nav

Filtering menu items is something that I don’t enjoy much. 🙂 So I’m going to give you another idea. Instead of using extra HTML, I have a purely CSS solution. It targets the top level of your menu, and leaves the submenu alone. If you’re on the FontAwesome site, you can get unicode for the symbol you want. I grabbed the unicode for your choice.

See if this works for you. (You may have a different ID or class on your top level). You’ll probably need to adjust for spacing. I do all FontAwesome stuff on my sites this way.

ul#menu-top-navigation-menu > li > a:after  {
    content: "\f107";
    font-family: 'FontAwesome';
    font-size: 27px;
    padding-left: 12px;
    speak: none;
}