Navigation
Archive / How to create Menu-Icons? (Page 2)
This is archived content. Visit our new forum.
1 2 3
  • Author
    Posts
  • March 16, 2016 at 10:19 am #840228

    drjeff007
    Participant

    Hi,

    For some reason the code for the home icon is displaying but when pasting in the code I just provided in previous post it doesn’t display the member icon.

    Please see attached…

    March 16, 2016 at 11:32 am #840317

    Rupok
    Member

    Hi there,

    Thanks for updating. Your code seems not correct. It should be like <i class=”x-icon x-icon-group”></i>

    You can find and copy the HTML (from source) from here – http://theme.co/x/demo/renew/1/shortcodes/icons/

    Hope this helps.

    Cheers!

    March 16, 2016 at 2:39 pm #840595

    drjeff007
    Participant

    Hi,

    I added your code and still no luck.

    I just noticed something… Please look at new screenshot and you’ll see that the icon that shows up in the menu bar is linked to a custom menu link.

    The other menu items use the internal WP page menu links.
    These won’t display the icons.

    Thank you.

    March 16, 2016 at 6:50 pm #840948

    Friech
    Moderator

    Hi There,

    Sorry, but the code above has a different format of quotes, please update that to:

    <i class="x-icon x-icon-group"></i>

    If this does not work as well; Please provide us login credentials in private reply so we can take a closer look.

    Cheers!

    March 16, 2016 at 7:27 pm #841004

    drjeff007
    Participant

    Awesome that did it!

    One question, is there a way to change icon color?
    They seem to default to what ever the nav fonts are set to.

    Thank again.

    March 16, 2016 at 10:44 pm #841233

    Lely
    Moderator

    Hi There,

    You’re welcome!
    Yes, that is possible using custom CSS via Appearance > Customize > Custom > CSS.
    Please add this :

    .x-navbar .desktop .x-nav > li i {
    color: red !important;
}

    Hope this helps.

    March 17, 2016 at 5:29 am #841565

    drjeff007
    Participant

    Awesome!

    March 17, 2016 at 7:08 am #841654

    Paul R
    Moderator

    Glad it helped.

    Have a great day!

    April 23, 2016 at 1:43 pm #896859

    E
    Participant

    When I tried doing this for the Renew stack, it does not work; nothing happens. What should the code be to add these to Renew stack menus?

    April 24, 2016 at 12:46 pm #897596

    Rupok
    Member

    Hi @eel

    It’s same for all stacks and should work fine. Would you share what you are using?

    Cheers!

    May 22, 2016 at 1:20 pm #1004046

    e-monkeys
    Participant
    This reply has been marked as private.
    May 22, 2016 at 1:55 pm #1004068

    Rupok
    Member

    Hi Nico

    It seems you are already using this and icons are working fine. TO change the icon, you need to use the right icon code. I don’t know which icon you are trying to use so can’t give your the tailored code. But you can find all icons here – http://theme.co/x/demo/integrity/1/shortcodes/icons/ and copy the HTML.

    Hope this makes sense.

    May 23, 2016 at 10:05 am #1005314

    aulaxativa
    Participant

    Hi!!

    Trying to do that, but icons not appearing on menu. I can’t find “Enable Legacy Font Classes option under Settings > Cornerstone” that seems the cause of the problem.

    Under Settings on my dashboard there is no “Cornerstone” menu.

    There is a menu called Cornerstone on my dashboard, but there is no option to activate de legacy font classes.

    Thanks in advance.

    May 23, 2016 at 10:35 am #1005395

    Rupok
    Member

    Hi @aulaxativa

    Let’s follow the previous reply and copy the HTML from Icon shortcode page by inspecting element. See – http://prntscr.com/b7h52y

    HTML code should look like : <i class="x-icon x-icon-adjust" data-x-icon="" aria-hidden="true"></i>

    Hope this makes sense.

    June 14, 2016 at 6:47 pm #1042306

    Peter
    Participant

    Hey! How do I go about changing the colour of this icon once it’s in the menu? 🙂

  • Author
    Posts
1 2 3