facebook messenger font icon

Home Forums Gillion Theme facebook messenger font icon

Home Forums Gillion Theme facebook messenger font icon

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    RESOLVED Posts
  • hife2017
    Participant

    Hi,  Shufflehound support,

     

    I want to add fb messenger and line font icon on my social media (I have svg file), how can I add it?

     

    Thanks

    Attachments:
    You must be logged in to view attached files.

    Hi @hife2017,

     

    I hope you are well today and thank you for your question.

     

    You can add dummy social icons on your site then we can replace it with fb messenger and line font icon.

     

    Could you please share me your site URL where it’s displaying so that i can help you to achieve it?

     

    Best regards,
    Shufflehound team

    hife2017
    Participant

    Hi,  Shufflehound support,

     

    How can I do that?

     

    This is sample site :

    http://dronewithray.com/gillion-theme/

     

    Thanks

    Have you added dummy social icons on your site as described above that you want to replace it with fb messenger and line font icon?

     

    If yes then please tell me which icons are those?

     

    Also please share me  fb messenger and line font icon SVG file URLs from your site so that i can use them to replace it.

    hife2017
    Participant

    Hi,  Shufflehound support,

     

    How can I add dummy social font icon SVG file to my site?

     

    Thanks

    You can add dummy social icons on your site as shown in the attached screenshots.

     

    And you can upload SVG file in the media gallery of your site using the following plugin.

     

    https://wordpress.org/plugins/svg-support/

     

     

    Attachments:
    You must be logged in to view attached files.

    hife2017
    Participant

    Hi,  Shufflehound support,

     

    This is the site, I added dummy social icons (phone icon)

    http://dronewithray.com/gillion-theme/blog-style/masonry-style/page/4/

     

    and this is the url of messenger SVG icon.

    http://dronewithray.com/gillion-theme/wp-content/uploads/2017/12/messenger.svg

     

    How can I replace it?

     

    thank you so much!

     

    Solution for this topic

    You can replace it by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

     #page-container a.social-media-wordpress {
        background: url("http://dronewithray.com/gillion-theme/wp-content/uploads/2017/12/messenger.svg") no-repeat transparent !important;
        height: 18px;
        width: 18px;
        background-size: 100%;
        padding: 0 !important;
        display: inline-block;
        margin: 0 0 0 12px !important;
        line-height: 16px;
    }
    
    i.fa.fa-whatsapp:before {
        content: none;
    }
    
    #page-container .header-standard-position a.social-media-wordpress {
        margin: 15px 9px 14px 10px !important;
    }

    hife2017
    Participant

    Hi,  Shufflehound support,

     

    It works! thank you so much.

    I want to make it act like other social links

    1. Are there any way to change icon color when I hover to it?
    2. I need to point to specific icon to open the link. are there any why that I only need to point to the square like other social link?

    Thanks

    hife2017
    Participant

    Hi,  Shufflehound support,

     

    When I was trying on mobile with social icon.

    1. how can I fix messenger icon to proper position?
    2. Logout button seems weird, how can I make it center or any way better?

    Thanks

    Attachments:
    You must be logged in to view attached files.

    You have to develop more custom code to achieve this.

     

    Developing custom code for custom functionality is beyond the scope of support that we provide here.

     

    If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site. Shufflehound recommends the developer https://www.upwork.com/freelancers/~011652ffec8865c6d5

     

    To help us keep support thread separates could you please create new thread for each of your other questions instead of asking them in your single thread as it makes the thread messy and hard to read.

     

    If you want to you can also add reference of this thread in your newly created thread.

     

    We would be more than happy to help you on your new thread.

Viewing 11 posts - 1 through 11 (of 11 total)