Transparent Simple Social Icons?

Community Forums Forums Design Tips and Tricks Transparent Simple Social Icons?

This topic is: not resolved

This topic contains 6 replies, has 3 voices, and was last updated by  David Browne 1 year, 6 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #37104

    David Browne
    Participant
    Post count: 167

    I wanted to make my simple social icons appear on their own, without a coloured background. Does anybody know how to do this? It is not one of the options within the widget screen as that only allows colour codes to be entered for the background, not the word ‘transparent’ as you would write in the css.

    It is not in the stylesheet as it is a plugin so firebug cannot help me. Does anybody know how to edit the colours in the code? I’m not sure where to look.

    Thanks


    We are Dave & Erin. Full time travellers and designers. Currently in Sydney. Follow us on Google +. I’m new to twitter so be the first to say hey Twitter

    Note: Known to give only give negative critique on design. I don’t mean to offend anybody, it is just more efficient pointing out mistakes than saying “yes, its beautiful” every time. :)

    • This topic was modified 1 year, 7 months ago by  David Browne.
    • This topic was modified 1 year, 7 months ago by  David Browne.
    #37112

    Davinder Singh Kainth
    Participant
    Post count: 1363

    To give it transparent look, you can enter color code of your website’s background. I can give you exact color code for specific color, if you can post link of your website.

    For standard color codes, you can refer this - http://html-color-codes.info/


    Need website customization services or other Genesis / WordPress help ?
    Davinder @ Design Studio iGuiding Media | My Blog | Fresh Genesis Themes Collection

    #37116

    David Browne
    Participant
    Post count: 167

    My background is a textured image.. this is the problem. I can get the colour close but not exactly. I need it transparent really.


    We are Dave & Erin. Full time travellers and designers. Currently in Sydney. Follow us on Google +. I’m new to twitter so be the first to say hey Twitter

    Note: Known to give only give negative critique on design. I don’t mean to offend anybody, it is just more efficient pointing out mistakes than saying “yes, its beautiful” every time. :)

    #37119

    braddalton
    Participant
    Post count: 10567

    You can use the plugins CSS in your child themes style.css to modify it.

    Will still show in Firebug.

    Can you link to your social icons please.

    http://www.w3schools.com/css/css_image_transparency.asp


    #37153

    David Browne
    Participant
    Post count: 167

    the website it is on is http://nomadspirit.net

    ah i didnt realise there was a css for the plugin also. Sorry, maybe I can have a play then once I have found the file. Firebug wasn’t giving me a location to find the css i needed,


    We are Dave & Erin. Full time travellers and designers. Currently in Sydney. Follow us on Google +. I’m new to twitter so be the first to say hey Twitter

    Note: Known to give only give negative critique on design. I don’t mean to offend anybody, it is just more efficient pointing out mistakes than saying “yes, its beautiful” every time. :)

    #37163

    braddalton
    Participant
    Post count: 10567

    Firebug will give you a line number in your plugins style.css file


    #38709

    David Browne
    Participant
    Post count: 167

    Hi, I finally figured it out. It wasn’t just the css code. After changing the css to transparent I also had to delete this code from the simple-social-icons.php

    background-color: ‘ . $instance['background_color'] . ‘ !important;

    i think this turns off the ability to change the colour in the widget menu and allows the css code to make it transparent. So for anybody wanting to do it, now you know :)

     


    We are Dave & Erin. Full time travellers and designers. Currently in Sydney. Follow us on Google +. I’m new to twitter so be the first to say hey Twitter

    Note: Known to give only give negative critique on design. I don’t mean to offend anybody, it is just more efficient pointing out mistakes than saying “yes, its beautiful” every time. :)

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

You must be logged in to reply to this topic.