Support » Theme: Kale » social icon not showing up correctly

  • Resolved Mimi

    (@feedmi)


    I have followed the online documentation on how to set up social links. However the icons are not showing up correctly for the Instagram, Facebook, and Pinterest links. The links work and sends me to the correct social pages. I also tried inserting links of different social accounts other than mine and the icons appear normal. It is my specific link for some reason that is not making the icons appear correctly. Could someone help me out?

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hi feedmi.

    Thank you for contacting us and for using our theme. We appreciate it.

    If you check https://help.lyrathemes.com/article/224-social-media-links you’ll see that the menu name has top be Social with Capital S, nothing less, nothing more. If you have that and you add the social links using http:// or https:// preferably, everything else should just fall into place and proper icons should be showing up.

    Please check that out and let us know if this helped.

    Kind regards.

    Thanks for your reply.

    Yes I named it “Social”. I also tried both http:// and https:// and both resulted in incorrect icons.

    The link I want that leads to incorrect icon: http://instagram.com/feedmi_
    The link I tested that resulted to correct icon: http://instagram.com/instagram

    Same goes for the Pinterest and Facebook icons and links. I am not sure why but it seems to not like my social accounts specifically. If I put links to another business’s or my friend’s social accounts, the icons appear normally.

    Hi feedmi,

    Could you try something? I think you’ve found an interesting scenario due to the “feed” in your username. 🙂

    If you don’t mind, try entering this in Appearance > Customize > Additional CSS:

    .widget .menu-social-container .menu li a[href*="facebook.com"]::before {content: '\f09a';}
    .widget .menu-social-container .menu li a[href*="instagram.com"]::before {content: '\f16d';}
    .widget .menu-social-container .menu li a[href*="pinterest.com"]::before {content: '\f0d2';}

    Let us know if this fixes the problem for you.

    Thank you so much, that worked!

    Happy to hear that. Thanks! 🙂

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.