Support » Themes and Templates » Icon in menu

  • knuthbecker

    (@knuthbecker)


    Hi Gurus,
    So I want to add an icon in one of the menupoints of my website but it doesn’t work. I followed this guide but it still doesn’t seem to work. Does anyone have an idea?

Viewing 6 replies - 1 through 6 (of 6 total)
  • Is your change online ? Because I don’t see any specific class in the menu

    esmi

    (@esmi)

    Forum Moderator

    You will probably need to start customising your theme’s CSS – possibly via a child theme or a custom CSS plugin.

    alphaalec

    (@alphaalec)

    You could try this plugin: http://wordpress.org/plugins/menu-image/ I’ve used it on a project recently and it works well.

    Or you could use css to put a background image on the menu item in question using a :before or :after psuedoclass.

    knuthbecker

    (@knuthbecker)

    I added this to Custom.css

    [ Moderator note: please wrap code in backticks or use the code button. ]

    .home-link-icon a{
    background-image:url(http://fiskeolien.dk/wp-content/uploads/2013/08/iconsmall.png) !important;
    background-repeat:no-repeat !important;
    background-position:center -47px;
    text-indent:-9999px;
    height: 52px;
    width: 35px;
    }

    And added this CSS class to the menupoint: home-link-icon

    But still doesn’t work.

    esmi

    (@esmi)

    Forum Moderator

    Try using Firefox with the Firebug add-on for this kind of CSS troubleshooting. Or use whatever developer tool is available in your web browser.

    You set a width and height for the entire link, not just for the image, removing the height & width and replacing with a padding-left:35px will do the trick 🙂

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Icon in menu’ is closed to new replies.