Healing Touch Pro social icon glitch

Home Forums Medical Healing Touch Pro social icon glitch

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #158744
    Robert Jones
    Participant
    • Topics: 7
    • Replies: 14
    • Total: 21
    Member since: November 11, 2015

    I Put the social icons in foot 1 columb and they all showed up fine. But when I attempted to change one to facebook it was a small white box with no F inside it.
    I wanted to add instagram, facebook and Yelp icons. At first I thought maybe the theme does not have the icons but I think it does.
    Below is the icon code in the footer section of the theme.

    [space height=”20″][social_area] [social icon=”facebook” link=”#”] [social icon=”twitter” link=”#”] [social icon=”instagram” link=”#”] [social icon=”linkedin” link=”#”] [social icon=”pinterest” link=”#”] [/social_area]</h6>

    Then I added the css line in custom CSS area of the theme.
    .social-icons .fa-facebook::before {
    content: “\f09a” !important;
    }

    When I pasted it, the live view of the page did show the F for facebook. But as soon as I clicked publish, the F turned into to f09a on the visual display.

    See image below

    Icons

    #158801
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25768
    • Total: 25768
    Member since: August 16, 2013

    Hi,

    Kindly show us your website URL please?

    Regards,
    Brad

    #158811
    Robert Jones
    Participant
    • Topics: 7
    • Replies: 14
    • Total: 21
    Member since: November 11, 2015

    https://jonesvision.rocks/

    Both header and footer are effected. It just does not like like facebook, others work.

    When I type

    [social icon=”facebook” link=”#”]

    Where does the theme look for the icon? It has to be a file someplace. Where are those files stored? If I look at the site with a File manager or command prompt is there a directory or place where one could swap out image files?

    What if I wanted icon=facebook” to show a picture of a pumpkin? I feel to far removed from what is going on under the hood. So when something breaks not sure where to look to fix it.

    Thanks

    #158813
    Robert Jones
    Participant
    • Topics: 7
    • Replies: 14
    • Total: 21
    Member since: November 11, 2015

    Hmm I guess i did not put the link to the site

    Here it is

    https:\\jonesvision.rocks

    #158876
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25768
    • Total: 25768
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    .fa.fa-facebook {
        font-family: "Font Awesome 5 Brands" !important;
    }

    Regards,
    Brad

    #158910
    Robert Jones
    Participant
    • Topics: 7
    • Replies: 14
    • Total: 21
    Member since: November 11, 2015

    Thanks Brad.

    Do you have a cheat sheet on more icon tricks?

    How would I have known that for that icon to display I would need to put that line?

    .fa.fa-facebook {
    font-family: “Font Awesome 5 Brands” !important;
    }

    #159033
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25768
    • Total: 25768
    Member since: August 16, 2013

    Hi,

    You can use that CSS code.

    Regards,
    Brad

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