Menu/Navigation Icons

[WDiaz]

Hi there, I am trying to change my navigation bar icons to be more of what each tab is, however the "default" icon is still there as well I am using this plugin for the icons: 

 

 

the default icon is the first one, then the paperclip is what I added 

 

So my questions is how do I get rid of the first icon to just have the paperclip? 

[mr-pimpen]

you will need to make some changes to your ccustom css and your navabaritems

add this to the navabaritem in your theme look for

<li {{if $active}}class='ipsNavBar_active' data-active{{endif}} id='elNavSecondary_{$item->id}' data-role="navBarItem" data-navApp="{expression="mb_substr( \get_class( $item ), 4, mb_strpos( \get_class( $item ), '\\', 4 ) - 4 )"}" data-navExt="{expression="mb_substr( \get_class( $item ), mb_strrpos( \get_class( $item ), '\\' ) + 1 )"}">

replace with

<li {{if $item->active()}}class='ipsNavBar_active' data-active{{endif}} id='elNavSecondary_{$item->id}' data-role="navBarItem" data-navApp="{expression="mb_substr( get_class( $item ), 4, mb_strpos( get_class( $item ), '\\', 4 ) - 4 )"}" data-navExt="{expression="mb_substr( get_class( $item ), mb_strrpos( get_class( $item ), '\\' ) + 1 )"}" data-FontAwesome="{$item->title()}">

add this to your custom css

/* Primary Menu */
.ipsNavBar_primary > ul > li > a:before,
.ipsNavBar_secondary > li > a:before{
content: "\f00b";
font-family: "FontAwesome";
font-size: 10px;
font-weight: normal;
display: inline-block;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-bottom: -2px;
margin-right: 3px;
opacity: 0.6;
line-height: 1;
}



/* The User menu and Create */
#elUserLink_menu a:before,
#elCreateNew_menu a:before{
content: "\f02b";
font-family: "FontAwesome";
font-size: 14px;
font-weight: normal;
display: inline-block;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-bottom: -2px;
line-height: 1;
}

#elUserLink_menu a[href*="admin"] i{
display: none;
}

#elUserLink_menu a:before,
#elCreateNew_menu a:before{
display: inline-block;
width: 22px;
opacity: 0.7;
}

#elUserLink_menu a:hover:before,
#elCreateNew_menu a:hover:before{
opacity: 1;
}

/* Add Icon on the primary navigation bar */
.ipsNavBar_primary > ul > li[data-FontAwesome='Browse'] > a:before{ content: "\f005" }
.ipsNavBar_primary > ul > li[data-FontAwesome='club'] > a:before{ content: "\f1b3" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Support'] > a:before{ content: "\f1cd" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Forums'] > a:before{ content: "\f086" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Gallery'] > a:before{ content: "\f030" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Downloads'] > a:before{ content: "\f019" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Articles'] > a:before{ content: "\f15c" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Blogs'] > a:before{ content: "\f02d" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Calendar'] > a:before{ content: "\f073" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Chat'] > a:before{ content: "\f27a" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Staff'] > a:before{ content: "\f007" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Users Online'] > a:before{ content: "\f0c0" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Activity'] > a:before{ content: "\f0ac" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Search'] > a:before{ content: "\f002" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Guidelines'] > a:before{ content: "\f0e3" }
.ipsNavBar_primary > ul > li[data-FontAwesome='Tutorials'] > a:before{ content: "\f19d" }

/* Add Icon on the secondary navigation bar */
.ipsNavBar_secondary > li[data-FontAwesome='Browse'] > a:before{ content: "\f00b" }
.ipsNavBar_secondary > li[data-FontAwesome='club'] > a:before{ content: "\f1b3" }
.ipsNavBar_secondary > li[data-FontAwesome='Support'] > a:before{ content: "\f1cd" }
.ipsNavBar_secondary > li[data-FontAwesome='Forums'] > a:before{ content: "\f086" }
.ipsNavBar_secondary > li[data-FontAwesome='Gallery'] > a:before{ content: "\f030" }
.ipsNavBar_secondary > li[data-FontAwesome='Downloads'] > a:before{ content: "\f019" }
.ipsNavBar_secondary > li[data-FontAwesome='Articles'] > a:before{ content: "\f15c" }
.ipsNavBar_secondary > li[data-FontAwesome='Blogs'] > a:before{ content: "\f02d" }
.ipsNavBar_secondary > li[data-FontAwesome='Calendar'] > a:before{ content: "\f073" }
.ipsNavBar_secondary > li[data-FontAwesome='Chat'] > a:before{ content: "\f27a" }
.ipsNavBar_secondary > li[data-FontAwesome='Online Users'] > a:before{ content: "\f0c0" }
.ipsNavBar_secondary > li[data-FontAwesome='Activity'] > a:before{ content: "\f0ac" }
.ipsNavBar_secondary > li[data-FontAwesome='Search'] > a:before{ content: "\f002" }
.ipsNavBar_secondary > li[data-FontAwesome='Todays Activities'] > a:before{ content: "\f06e" }
.ipsNavBar_secondary > li[data-FontAwesome='My Searches'] > a:before{ content: "\f00e" }
.ipsNavBar_secondary > li[data-FontAwesome='Unread Content'] > a:before{ content: "\f111" }
.ipsNavBar_secondary > li[data-FontAwesome='My Created Content'] > a:before{ content: "\f005" }
.ipsNavBar_secondary > li[data-FontAwesome='Guidelines'] > a:before{ content: "\f0e3" }
.ipsNavBar_secondary > li[data-FontAwesome='Tutorials'] > a:before{ content: "\f19d" }
.ipsNavBar_secondary > li[data-FontAwesome='Staff'] > a:before{ content: "\f132" }

/* Add Icon on the user bar */

/* Profile */
#elUserLink_menu > li[data-menuItem='profile'] > a:before{ content: "\f007" }

/* Attachments */
#elUserLink_menu > li[data-menuItem='attachments'] > a:before{ content: "\f0c6" }

/* Followed Content */
#elUserLink_menu > li[data-menuItem='manageFollowed'] > a:before{ content: "\f1d8" }

/* Administrator Panel */
#elUserLink_menu > li[data-menuItem='content'] > a:before{ content: "\f03a" }

/* Account Configurations */
#elUserLink_menu > li[data-menuItem='settings'] > a:before{ content: "\f013" }

/* Mod Panel */
#elUserLink_menu > li[data-menuItem='modcp'] > a:before{ content: "\f132" }

/* Admin Panel */
#elUserLink_menu > li[data-menuItem='admincp'] > a:before{ content: "\f023" }

/* Logout */
#elUserLink_menu > li[data-menuItem='signout'] > a:before{ content: "\f08b" }

/* Clients */
#elUserLink_menu a[href*="/clients/"]:before{ content: "\f07a" }

/* Edit */
#elUserLink_menu > li[data-menuItem='edit'] > a:before{ content: "\f040" }

/* Ignored Users */
#elUserLink_menu > li[data-menuItem='ignoredUsers'] > a:before{ content: "\f235" }

/* Options */
#elUserLink_menu > li[data-menuItem='options'] > a:before{ content: "\f0ac" }

/* Messages */
#elUserLink_menu > li[data-menuItem='messages'] > a:before{ content: "\f01c" }

/* Add Icon on create bar */

/* Default icon that is displayed if you do not add */
#elCreateNew_menu a:before{ content: "\f0fe" }

/* Announcement */
#elCreateNew_menu a[href*="/announcements/"]:before{ content: "\f0a1" }

 

[Tony]

The question(s) in this support topic have been answered and the topic author has resolved their issue. This topic is now closed. If you have other questions, please open a new topic.