Navigation
Archive / Using Images for Navbar Items
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • October 18, 2016 at 10:25 pm #1221757
    themisfit
    Participant

    I’m trying to use images for my navbar items. I’m using <i class=”custom-icons about-us-icon”>Home</i> in the menu label.

    And i’m using custom CSS:

    .custom-icons {
    display:inline-block;
    width:20px;
    height:20px;
    vertical-align:middle;
    margin-left:5px;
    }
    .custom-icons.about-us-icon {
    background:url(http://lanatoley.ca/wp-content/uploads/2016/10/DogHouseIcon-1.png) 0 0 no-repeat;
    }

    But the images are not showing. Any help would be great.

    October 19, 2016 at 2:48 am #1221949
    Paul R
    Moderator

    Hi,

    You can add it directly to your menu as link text.

    eg. <img src="http://lanatoley.ca/wp-content/uploads/2016/10/DogHouseIcon-1.png"> Home

    See screenshot – http://screencast.com/t/xEXlLVbSZt

    Hope that helps

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1221757 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>