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  daveerin 11 months, 3 weeks ago.

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

    daveerin
    Participant
    Post count: 46

    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. Follow us on Google + or follow our journey on NomadSpirit.net. We also collect Resources for Genesis

    • This topic was modified 12 months ago by  daveerin.
    • This topic was modified 12 months ago by  daveerin.
    #37112

    Davinder Singh Kainth
    Participant
    Post count: 974

    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

    daveerin
    Participant
    Post count: 46

    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. Follow us on Google + or follow our journey on NomadSpirit.net. We also collect Resources for Genesis

    #37119

    braddalton
    Participant
    Post count: 7460

    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


    WordPress Developer & Consultant
    Brad Dalton400+ StudioPress Tutorials & 1200+ Code snippets

    #37153

    daveerin
    Participant
    Post count: 46

    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. Follow us on Google + or follow our journey on NomadSpirit.net. We also collect Resources for Genesis

    #37163

    braddalton
    Participant
    Post count: 7460

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


    WordPress Developer & Consultant
    Brad Dalton400+ StudioPress Tutorials & 1200+ Code snippets

    #38709

    daveerin
    Participant
    Post count: 46

    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. Follow us on Google + or follow our journey on NomadSpirit.net. We also collect Resources for Genesis

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

You must be logged in to reply to this topic.