1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Navbar / Navtab Icons ?

Discussion in 'General XenForo Discussion and Feedback' started by ExpertPixels.com, Jul 10, 2014.

  1. ExpertPixels.com

    ExpertPixels.com Well-Known Member

    Hey all,

    Id love to see the ability to add icons albeit (Font-Awesome ones or Custom ones) being added next to each of the Navtabs.. Now i have found a way to make this happen but without much knowledge of XF Addon's i don't this many people will be able to wrap their heads around how i do it.

    Id love to see a better XF Navtab System that allowed admins more control over the Tabs / Tabs Options... I recall paying like $15 or something for a old IPB addon that basically gave the site owners much better control over their navbar and tabs, but to see a option like this out of the box would be a huge boost for XF.

    This is my Tutorial / Guide: http://xenforo.com/community/resources/font-awesome-icons-in-the-navbar-other-places.3403/

    Now it's simple'ish if your comfortable within XF templates and JS but i feel a simple addon would make life easier for everyone.

    If someone could help me make an addon to use my method i am sure many people would be very grateful.

    Regards, Darren
  2. tajhay

    tajhay Well-Known Member

    @*******'s Menu Manager addon already allows this, as well as even creating 3 level menus.
    ExpertPixels.com likes this.
  3. Russ

    Russ Well-Known Member

    Just my own method for it, it's pretty easy with just CSS:

    .navTabs .publicTabs .navTab .navLink:before
       color: #FFF;
       font-family: FontAwesome;
       font-weight: normal;
       margin-right: 5px;
    .navTabs .navTab.home .navLink:before
       content: "\f015";
    .navTabs .navTab.forums .navLink:before
       content: "\f0e6";
    .navTabs .navTab.resources .navLink:before
       content: "\f008";
    .navTabs .navTab.members .navLink:before
       content: "\f0c0";
    Easy for folks to add new tabs using the specific selector too.
    ExpertPixels.com and tajhay like this.
  4. ExpertPixels.com

    ExpertPixels.com Well-Known Member

    Thanks for that method :) I am open to all options.. The Method above however i received a bit of flack over (As to I did using JS script injection) You can't please everyone but would like to please the majority if possible... I know IE (Internet Explorer + Other older browsers) are not all that kind to css pseudo elements.

    As i was also implementing other scripts (for commercial releases) such as having certain sections fade in and out as you scroll.. now not wanting to have all the other designers steal our code i was going to create on simple .js file to include at the end that would contain all my custom scripts and have it compressed.

    My main goal is to have a not so much framework but a page with the Styles settings so that they could turn on & off what they liked.. so using the append / pre-pend scripts as ive done i figured having everything in the one file may of been easier for the end users.

    Thanks again Russ i do appreciate it and will further investigate your option.

    Regards, Darren
  5. ExpertPixels.com

    ExpertPixels.com Well-Known Member

    Thanks for letting me know, Like ive said i was away from XF for a while.. Would you like me to request this to be removed ? I am sorry tho the last time i searched for such a thing it was not available (Otherwise id probably had used it myself lol).

    I also try to rely on as little 3rd party addons as possible due to the fact most webmasters / coders burn themselves out and abandon their work leaving many people who relied on their addons / scripts / code in a spot of bother.

    Thank you for bringing that to my attention tho, I shall take a look at it later today.

    Regards, Darren

Share This Page