Preserving transparent background in PNG, GIF images

  • Apologies if this has been solved already. There are several relevant articles in WP forums and elsewhere, but none that seem to address this exact issue.

    When I upload PNG or GIF images with transparent background (e.g., a circular image in a square frame) via WP media manager, they look fine on the editing page. (Backgrounds also show transparent when files are viewed directly in the site’s cPanel.) But in Preview or “live” site display, the backgrounds turn to opaque pale gray. Test page https://fpond.org/flow/?p=4573 shows the effect, which seems to be browser-independent.

    After JPEG images didn’t work, I tried GIF and PNG, all saved from Photoshop in sRGB with transparency enabled. No improvement.

    Suggestions, please? Many thinks.

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Dion

    (@diondesigns)

    Add the following to the Custom CSS section in the theme Customizer, and I think the problem will be solved.

    .post img {
  background-color: transparent;
  border-width: 0;
  border-radius: 0;
}
    Thread Starter ctenos

    (@ctenos)

    Magic – thanks for this suggestion!

    In case useful to someone else: I pasted the code into the Atahualpa theme options section “Add HTML/CSS Inserts.” Didn’t see any change. Adding it via Appearance > Customize > Additional CSS did the trick.

    Again, many thanks!

    Thread Starter ctenos

    (@ctenos)

    Test page removed. In case anyone wants to see the result of Dion Designs’s guidance, it’s the top image here: https://fpond.org/flow/?page_id=111.

    Thanks again to DD and the Forum, not to mention the whole WordPress team!

    • This reply was modified 4 years, 12 months ago by ctenos.
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Preserving transparent background in PNG, GIF images’ is closed to new replies.