• Hi ,
    I used this code
    <code>href=&quot;http://facebook.com/username&quot;><img src=&quot;[path to your icon]&quot; width=&quot;30&quot; height=&quot;30&quot; alt=&quot;Facebook&quot; /></a></code>

    i just replace the fb link with my page’s link and i added the url of my image instead of this [path to your icon]
    The icon appears on my page but it has a square white backround .
    I tried some codes to make it tranparent but couldnt make it work .
    Any ideas?

    • This topic was modified 6 years, 3 months ago by louel.
    • This topic was modified 6 years, 3 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Developing with WordPress topic

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

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator bcworkz

    (@bcworkz)

    We’ll need a live link to the page illustrating the problem in order to best help you.

    Hi @louel,

    It looks like your FB icon has been saved with a white background instead of a transparent background. That means you need to re-edit the image and make sure you save it as a PNG (like you are now), but save it with a clear background (or no background colour). I hope that makes sense. Here’s a link to some examples.

    https://balistreetphotographer.com/branding/#clear-logos

    Also, please use the CODE button for inserting your code when you post a message. It’s hard to read your code without doing this.

    Lastly, I see some random CSS in your page that looks like a mistake. Maybe you pasted it in by accident? Or didn’t add the CSS to the correct area? Here’s what’s showing up under your FB icon.

    .widget-area, .about, .search-field { background-color: transparent; }

    For the above code, I used the code button in the post menu bar. 😉

    Thread Starter louel

    (@louel)

    Hi thanks for the reply
    I cropped the image to make sure there is no background
    I don’t know if you can check the link of my uploaded image https://greatmind.gr/wp-content/uploads/2020/01/IMG_20200104_235635.png
    But still nothing happened.
    The code you saw that you said was a mistake was a try to dissappear the white background.
    Any other ideas.
    I found out that others had the same problem with me and they were adding a code like that to fix it..
    Any ideas?

    Moderator bcworkz

    (@bcworkz)

    The image background is transparent alright. If you still see white your browser is using a cached image from before. Flush your browser cache in order to see the latest version. While you’ve achieved your goal, the result does not contrast well with the dark background of your site. If you like the effect then fine, it’s your site. Consider doing more with the “f” itself to bring the contrast up.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Setting transparent backround on css code’ is closed to new replies.