Tagged: , , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • July 25, 2013 at 10:35 am #26719
    dxeptive

    Hi there,

    Just wondering if there is a way to have icons beside menu/menu items?

    For example as of now it is:

    Home || Services || FAQ ||

    I want it to be:

    [icon] Home || [icon] Services || [icon] FAQ ||

    The icons will ofcourse be custom, I’ve got them ready to go, just wondering how to implement it.

    Thanks so much,

    J

    July 26, 2013 at 10:04 am #131377
    dxeptive

    Can anyone help me with this?

    Thanks,

    J

    July 26, 2013 at 3:45 pm #131378
    ANKirschner

    Second this.

    July 26, 2013 at 7:53 pm #131379
    Dude

    Yes this is possible. You can insert html code into the title fields (eg just insert a simple image html tag: http://www.htmlgoodies.com/primers/html/article.php/3478181/Basic-HTML-Images.htm ) or use the shortcode generator (magic wand icon in the tinymce editor field on the post/page editor screen) to generate a font icon shortcode and insert the shortcode into the title field of the menu item.

    July 28, 2013 at 9:36 am #131380
    dxeptive

    Hi Dude,

    Thanks for your reply; the html method works, the shortcode method doesn’t.

    However when i use the html method, text isnt aligning properly, as in vertical alignment.

    The icon would appear, but the text would be at the bottom of the icon, like in the image attached. http://i.imgur.com/zn7t4BU.jpg

    I know the image isn’t linked properly, I’m just putting the code in to get a screenshot.

    How can i get the text of the menu to vertical align to the size of the icon?

    Thanks,

    J

    July 29, 2013 at 5:40 am #131381
    Ismael

    Hi,

    Maybe you can add a negative top margin for each menu item.

    #menu-item-755 a {
    
margin-top: -10px;
    
}

    OR

    .main_menu ul:first-child > li a {
    
margin-top: -10px;
    
}

    Please give us a link to your website.

    Regards,

    Ismael

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Adding Icons next to Menu Items’ is closed to new replies.