Support » Theme: OceanWP » Menu icon missing: Homepage display Square shape instead of icon

  • HI i am using OceanWp theme.

    The menu icons for Blog, Contact and search is not showing on Homepage..

    While these icons are visible on all other pages of the website.

    Please, can someone tell what is the issue?

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Hello,

    Your icons are not being found.

    Disable any cache plugin and check again.

    The icons you are using are from line icon. It is possible that it not fetching it’s resource correctly due to some misconfiguration.

    Thread Starter aanuragshukla

    (@aanuragshukla)

    HI i found this line of code and it worked for search icon

    .icon-magnifier:before {
    content: “\e090” !important;
    }

    BUt for others icons where do i get the content name

    Hello,

    It might work but thats not the finding the root cause. You are overriding something doesn’t mean it solved the problem. But anyway it’s not a big deal. Even this way won’t harm.

    I just checked again with your website and found the root cause.

    You are using different providers or plugins to insert icons in menu and in the middle of page.

    The icon beside Knowledge Spear “Globe Icon” is causing the problem. If you inspect element it will show following CSS

    .ekit-wid-con .icon:before, .fasicon, .icon, .icon:before {
         font-family: 'elementskit'!important;
    }

    Because of !important it overrides your content style for the menu icons.

    Please check and resolve that from your end.

    Thread Starter aanuragshukla

    (@aanuragshukla)

    HI @mrrajsoni

    Those icons are made from “Elements kit” and yes they are the one causing issue. Thanks for pin pointing the error.Really appreciate your effort.

    If i disabled those icons everything comes out fine. but i want those icons

    Before your help,i turned off Elements kit plugin all together and i found out it resolved the issue, but as i wanted to use that particular plugin, i went with the override solution and wrote an email to plugin author, waiting for there reply.

    what else can i do? please suggest

    Hi,

    I agree with the @mrrajsoni.
    @aanuragshukla it a plugin conflict issue with the elementor kit. You should try to contact the plugin support once.
    For now, you can try to add the below CSS code from the Appearance > Customize > CUstom CSS, this could fix the issue.

    .icon:before {
        font-family: 'elementskit','simple-line-icons' !important;
    }
    Thread Starter aanuragshukla

    (@aanuragshukla)

    Hi @abhikr781
    I have received a mail from plugin support, they have given me the below code
    For the menu icon issue please add this below code on Appearence > Customize > Additional CSS

    .icon-book-open:before {
    content: “\e04c” !important;
    font-family: ‘simple-line-icons’ !important;
    }
    .icon-call-out:before {
    content: “\e046” !important;
    font-family: ‘simple-line-icons’ !important;
    }
    For a permanent solution of root cause, i have written a new mail, waiting for a reply.

    Thread Starter aanuragshukla

    (@aanuragshukla)

    Hi @abhikr781
    I tried your code, it works well on desktop but in mobile icons are again square.

    While the code by plugin support works on both desktop and mobile, so for now i am using that one.

    Will keep you updated when i receive a mail from plugin support about a permanent solution.

    Thread Starter aanuragshukla

    (@aanuragshukla)

    I received a reply from plugin support

    This is a known issue to us also. We have been working with this issue and fixed it already. Hopefully after this update your mentioned two issue will be solved.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Menu icon missing: Homepage display Square shape instead of icon’ is closed to new replies.