Home New Guten › Forums › WoodMart support forum › Custom Icons in Menus

Custom Icons in Menus

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • August 5, 2022 at 3:26 pm #395779

    axxo
    Participant

    Hi there

    Is there any way to use custom SVG icons in the menus? We’ve build our own iconsets and can only find the support for Font Awesome library trying to add icons in WordPress menus.

    Many thanks
    -a

    Attachments:
    You must be logged in to view attached files.
    August 5, 2022 at 3:55 pm #395783

    Luke Nielsen
    Keymaster

    Hello,

    Judging by your screenshot, these icons you can change directly, navigate to WoodMart -> Header builder -> edit the “Text/HTML” element and in the “Text” tab change the link to the icon that is from Dashboard -> Media.

    https://prnt.sc/Rrx5_THVAAnF

    https://prnt.sc/UuxurLgqb2ou

    If you have your own images so first of all upload them to the Dashboard -> Media and then enter the link to the appropriate “Text/HTML” element in the Header builder.

    If there’s anything else we can do, please get in touch.

    Kind Regards

    August 5, 2022 at 5:10 pm #395800

    axxo
    Participant

    Hi Luke

    Thank you so much for your super-fast response. I’m impressed how good the support is from Woodmart.

    Maybe my example was exactly the wrong one 😉 I was more referring to a menu in WordPress (see attached screenshot). There it’s mentioned to use icons from FontAwesome library. However, we would like to use there our custom SVG icons. Is this somehow possible via CSS?

    Many thanks
    -a

    Attachments:
    You must be logged in to view attached files.
    August 5, 2022 at 5:25 pm #395804

    Luke Nielsen
    Keymaster

    Hello,

    I think it’s possible by using custom CSS code, in order to check it, please upload appropriate SVG images to the Dashboard -> Media and provide your site admin access to the private area so I can try to do it.

    I await your response.

    Kind Regards

    August 5, 2022 at 6:03 pm #395816

    axxo
    Participant

    Hi,

    Many thanks. You’ll find the relevant information below.

    Best
    -a

    August 8, 2022 at 10:08 am #396059

    Luke Nielsen
    Keymaster

    Hello,

    Please enter the below code to the “Custom CSS for desktop” area that is in Theme Settings -> Custom CSS.

    .wd-header-nav .menu-item-8419 .woodmart-nav-link:before {
    content: ' ';
    position: absolute;
    background-image: url('http://www.feavr.com/wp-content/uploads/2022/08/faq.svg');
    background-repeat: no-repeat;
    background-size: 17px 17px;
    height: 17px;
    width: 17px;
}

.wd-header-nav .menu-item-8419 .nav-link-text {
    margin-left: 21px;
}

    In the meantime, please feel free to ask any questions you may have!

    Kind Regards

    August 8, 2022 at 10:37 am #396060

    axxo
    Participant

    Works like a charm! Thank you so much.

    Best
    -a

    August 8, 2022 at 11:25 am #396073

    Luke Nielsen
    Keymaster

    Hello,

    Glad that everything is sorted out.

    Always remember that you can reach out to us with any questions you may have.

    We wish you a splendid day!

    Kind Regards

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘Custom Icons in Menus’ is closed to new replies.