How to Set Background Image Transparency

analyticspro · Member · Aug 18, 2013 at 12:44 pm
Copy link

Add topic to favorites
I am using the Confit theme and would like to set the transparency of the background image.

Here is a link that covers how to set transparency:
http://css-tricks.com/css-transparency-settings-for-all-broswers/

This is the code the author gives to set the transparency:
```
.transparent {
	zoom: 1;
	filter: alpha(opacity=50);
	opacity: 0.5;
}
```
How do I address this code to the background image? I have used “inspect element” to look at the source code of the page, but I am still not sure how to point it to the background image.

I have the CSS upgrade. Here is a test blog with the Confit theme.

http://clsanalytics.wordpress.com/

The blog I need help with is: (visible only to logged in users)
1travis · Member · Aug 19, 2013 at 1:36 am
Copy link
it’s set to private
analyticspro · Member · Aug 19, 2013 at 3:00 am
Copy link
Sorry about that. I set it to public.
thesacredpath · Member · Aug 19, 2013 at 8:52 pm
Copy link
You need to have a separate div in the HTML that covers the entire body area and is set to position: absolute, otherwise all child divs will also inherit the transparency.

If you are wanting a transparent background, I would suggest creating your own, or editing the existing image in an image editing program and set the transparency/opacity of the image as you desire. You will have to save the image as a PNG with transparency and then you can go to Appearance > Header and insert that new background image. Here is the link to the existing image if you decide to download it and modify it: http://s0.wp.com/wp-content/themes/pub/confit/images/background.jpg?m=1348121841g .
analyticspro · Member · Aug 19, 2013 at 10:39 pm
Copy link
I don’t know CSS, but I’m guessing what you are saying about the creation of a separate div in HTML is not really possibly in WP.com, or if it is it would take a lot of CSS coding. This would be the best solution as it could be applied to any number of images. However, an overly involved solution is not in the cards.

Do you know if there is a copyright on the standard WP images that prevent modification and reuse?

Thanks for your help.
analyticspro · Member · Aug 19, 2013 at 10:41 pm
Copy link
Oops…prevents, not prevent.
analyticspro · Member · Aug 21, 2013 at 5:39 pm
Copy link
The transparent png did not look the way I had hoped, so I went with a different background. Thanks for your help.
thesacredpath · Member · Aug 21, 2013 at 6:46 pm
Copy link
You are welcome, and on the images used in themes here, they are all GPL, so you can modify them if you wish.

Your site is looking great!
analyticspro · Member · Aug 22, 2013 at 4:26 pm
Copy link
Thanks Sacred Path. That’s good to know, too, about the images being GPL.
thesacredpath · Member · Aug 22, 2013 at 5:45 pm
Copy link
You are welcome.

No items found.