How To Make Transparent Image Show Up As Transparent In Blogger

Bloggers who write personal blogs are much care about their blog design and each widget and other stuff. Usually  Personal blog writes  insert their signature at the bottom of post .Unfortunately i come to see that it doesn't blend with background image of blog, instead it shows white background on transparent Image.




Here, Transparent Images play good, but i don't teach you how to make you Transparent Images here.
Let you Learn from Here or Google it it .

Note: Ensure your Transparent Image Format  be PNG/GIF not JPEG.
If you Upload this Image directly to blogger you wouldn't get Transparent image instead white background be there.

Note: This Code works for Blogger who run blogger templates .

How To Make Transparent Image Show Up As Transparent In Blogger

  1. Log In to Blogger Dashboard and Go to Template Designer to Add CSS.
  2. Now Copy down the Code below and Paste down on your CSS code Box.


    1. Go to Layout >> Add a Gadget >> Add a HTML/JavaScript Gadget.
    2. Copy Down Below Code after Replacing Facebook URL

    3. // Code To Make Transparent Image Show Up As Transparent
      .post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {     background: none repeat scroll 0 0 transparent;


    4. Click on 'Apply to Blog' button & Refresh your blog to see how Transparent Image works out :)




By : Hasi Haseeb
Category:

8 comments:

  1. amazing Tool For Transparent Image making

    Thanks

    ReplyDelete
  2. great thanks..........but one problem....when i post a transparent baground png image.......it automatically frames it with a shadow border...which i dont want.


    any ideas to get rid of the border.

    ReplyDelete
    Replies
    1. Please Post your Blog URL here, Then only i could solve your query.
      Most cases removing CSS code for image shadow would solve your problem.

      Delete
    2. thanks........i found a solution...i changed the css code and it works.

      Delete
  3. there is shadowwww!! please help me Hasi Haseeb... :'(

    ReplyDelete
    Replies
    1. Check out your HTML code and search for code which shows shadow there.
      Remove the code or make its value to 0.

      Delete
  4. didn't worked :( .. i created my signature using mylivesignature.com it generated an HTML for image, i pasted it at relevant position to appear a signature at end of every post... it has the white background.. then i followed your step to make that image transparent but it didnt worked. help out

    ReplyDelete

Type your Comment Here...!