Show a warning on the WordPress admin screen when a user uploads a PNG image to an ACF gallery, content area, or featured image.

functions.php

<?php

/**
* Add a big fucking warning when the client uploads a PNG when they should
* be using a JPG
*/
function varga_62341_admin_png_warning() {
  global $post_type;
  echo '<script>var varga_62341_post_type="'.$post_type.'";</script>';
  ?>
  <script type="text/javascript">
    jQuery(function($) {
      var varga62341PngWarningInterval = setInterval(function() {
        // safety check. if there's more than 20 warnings on a page, something
        // has probably gone wrong. clear the interval and remove all warnings
        if ($('.stop-using-pngs').length > 20) {
          clearInterval(varga62341PngWarningInterval);

          $('.stop-using-pngs').remove();
        }

        if ($('.acf-image-uploader, #postimagediv').length > 0) {
          $('img', '.acf-image-uploader, #postimagediv').each(function() {
            var pngFound = $(this).attr('src').toLowerCase().includes('.png');

            if (pngFound && $(this).nextAll('.stop-using-pngs').length == 0) {
              $('<div class="stop-using-pngs"><p style="color: red; text-decoration: none;"><strong>WARNING:</strong> PNGs drastically increase load time (especially on mobile devices), which negatively affects search ranking and conversion rates. If the images don\'t have transparency, you don\'t need to use PNGs. Convert the images to JPG and reupload them.</p></div>').insertAfter(this);
            } else if (!pngFound) {
              $(this).next('.stop-using-pngs').remove();
            }
          });
        }

        var $container = $('#wp-content-editor-container');

        if ($container.length > 0) {
          var pngFound = false;

          if ($('#content', $container).length > 0) {
            pngFound = $('#content', $container).val().includes('.png')
          } else if ($('#content_ifr').length > 0 && $('#content_ifr').contents().find('body').length > 0) {
            pngFound = $('#content_ifr').contents().find('body').html().includes('.png');
          }

          if (pngFound && $container.prevAll('.stop-using-pngs').length === 0) {
            $('<div class="stop-using-pngs"><p style="color: red; text-decoration: none; font-size: 1.25em"><strong>WARNING:</strong> This post contains PNG images. PNGs drastically increase load time (especially on mobile devices), which negatively affects search ranking and conversion rates. If the images don\'t have transparency, you don\'t need to use PNGs. Convert the images to JPG and reupload them.</p></div>').insertBefore($container);
          } else if (!pngFound) {
            $container.prevAll('.stop-using-pngs').remove();
          }
        }
      }, 1000);
    });
  </script>
  <?php
}
add_action( 'admin_footer', 'varga_62341_admin_png_warning' );