How to add white background to a graphic image?

[susansgarden]

Hi everyone. My website recently won an award (yay) and I received a png image to add to my home page image to advertise that. I would like to place it on top of the home page image but the png image they sent me is my problem: It's a gray graphic with the "checkerboard" background underneath it. I would like to change the background area of the graphic to white, while retaining the wording of the award in gray (or maybe black)  for the foreground. I've read help files, watched videos, but can't seem to just affect the background areas of the png image without "losing" the wording of the award. Can someone please help me figure this out? My website is SusansintheGarden.com. I have no problem editing my photos in PS but am stuck on this graphic problem. Thanks very much. (feeling like a dummy!)

[Silkrooster · Accepted solution]

It was not clear if you were seeing the checkboard in your browser or in photoshop. In photoshop, that checkboard tells you that the background is transparent, which mean you can overlay it on top of a white background.

In photoshop create a layer and fill it with white then move that layer below your image layer.

The quick and dirty way is to just save as a jpg. Since jpg does not support a transparency background, the background will be white.

Just don't delete the png, in case you want to have a different background at a later time, it will be easier to do.

[susansgarden]

Thank you. I was seeing the checkered background in PS. Your answer was very helpful for future layer issues.

[Silkrooster]

You're welcome

[michelew83603738]

If the layer is a background layer, click the lock, add a new layer and drag it to the bottom or use the shortcut Cmd+[ and then fill that layer with white and save as a jpg. It should work unless something else is going on, in which case post a screenshot of the image and layers panel.

[Trevor.Dennis]

michelew83603738  wrote

If the layer is a background layer, click the lock, add a new layer and drag it to the bottom or use the shortcut Cmd+[ and then fill that layer with white and save as a jpg. It should work unless something else is going on, in which case post a screenshot of the image and layers panel.

Michele you are confusing things with that post.  Silkrooster has explained that the PNG already has a transparent background, and can be added to the website as it is. 

Another clue with PNG files with transparency is that if you grab one from the web with a screen grabber, and paste into Photoshop, the background becomes black.  If you right click and save the same file, and then open in Photoshop, it will have the transparency.  The same thing happens if you open a transparent PNG with something like Windows Image Viewer — the background becomes black.  Open that same file in a web browser (they all support transparent PNG files) and you'll see it against a white background.

[Silkrooster]

Had the image only a single background layer, then it would have been relevant. But you are correct when the background is transparent, that step is not needed.

[susansgarden]

Thank you so much, Silkrooster! That was almost too easy although I obviously need to learn more about creating and editing layers. Thank you, everyone for taking the time to reply.