The following question was the basis: how can the customer find all images embedded in a page or article in their original size in order to download them, edit them and then embed them again?

Of course, it is relatively easy to find all the original images ‘manually’ without additional code. But this is quite complicated. First, right-click on the image to be swapped and select ‘Open image in a new tab’. Then remove the size information (e.g. “-800×600.jpg”) in the address bar of the browser, which WordPress always appends to the file names of images when the image has been scaled. By cutting off this addition, you get the image in its original size – or the original image as it was once uploaded. You can then save this locally on your computer, edit it and upload it again. Simply select the image you want to replace in the admin view and click on “Replace image” in the image editing view. You can now upload the new image.

Of course, it’s even easier if you have your images well organized and can find the image directly on your local hard drive – then you can save yourself the trouble of downloading it.

Unfortunately, both options were not available in the request I received – the original images could not be found and the trick with the right mouse button was too cumbersome, as it involved a large number of images that were integrated into a wide variety of pages. So a list of all images was to be generated automatically so that the original images could be downloaded directly.

Find article images automatically

The article image (post thumbnail) and all other images saved as attachments can be found relatively easily.

/* Find all attachment images – this goes inside the template */

$images = get_children( array( 'post_parent' => get_the_ID(), 'post_type' => 'attachment', 'post_mime_type' => 'image', 'orderby' => 'menu_order', 'order' => 'ASC', 'numberposts' => 999 ) ); 
 if ( $images ) {

//looping through the images
 foreach ( $images as $attachment_id => $attachment ) {
 
 $img_path_array = (wp_get_attachment_image_src( $attachment_id, 'full' ));?>
 <a href="<?PHP echo($img_path_array[0]); ?>" target="_blank"><?PHP echo wp_get_attachment_image( $attachment_id, 'full' ); ?></a>

<?php
 }
 ?><?php
 
 }

This is a little more difficult with the images placed in the text – these are not stored as attachments. So we first have to find all the images that are included in the text (content). To do this, we search the page content for the code snippet “src=”, which tells us that there is an image there.

This works quite well so far – but we get an array of the images as they are included in the text – i.e. with attached pixel dimensions (e.g. “image-800×600.jpg). However, we can use the get_original_image function to get the original images.

/* Find all inline images - this code snippet goes into the template */
 $regex = '/src="([^"]*)"/';
 $content = $post->post_content;
 // echo($content);
 preg_match_all( $regex, $content, $matches );

foreach($matches[1] as $image):
 
  $the_orig_image = get_original_image( $image);

  echo '<a href="'.$the_orig_image.'" target="_blank"><img src="'.$the_orig_image.'"></a>';
  $ii++;

endforeach;

/* The function get_original_image goes into functions.php of the theme */
function get_original_image( $url ) { 
global $_wp_additional_image_sizes; $new_url = $url; // Get All Image Sizes 
$builtin_sizes = // *** BREAK WAS MISSING *** 
 array( 'large' => array( // *** WRONG ARROW "=–>" ***
 'width' => get_option('large_size_w'),
 'height' => get_option('large_size_h')
 ),
 'medium' => array(
 'width' => get_option('medium_size_w'),
 'height' => get_option('medium_size_h')
 ),
 'thumbnail' => array(
 'width' => get_option('thumbnail_size_w'),
 'height' => get_option('thumbnail_size_h')
 )
 );

$image_sizes = array_merge( $builtin_sizes, $_wp_additional_image_sizes );

// Parse URL
$info = pathinfo( $url );

// Check to see if image is a thumbnail

// Get image size extensions, e.g. -200×200
// Get image size width only extensions, e.g., -200x
// Get image size height only extensions, e.g., x200.
$image_exts = array();
$image_exts_width = array();
$image_exts_height = array();
foreach ($image_sizes as $image_size) {
  $image_exts[] = '-'.$image_size['width'].'x'.$image_size['height'];
  $image_exts_width[] = '-'.$image_size['width'].'x';
  $image_exts_height[] = 'x'.$image_size['height'];
}

// Cycle through image size extensions, e.g. -200×200
foreach ( $image_exts as $image_ext ) {
  //if found, replace the extension with nothing
  $new_url = str_replace( $image_ext , '' , $url );

// we found an original – don't look any further
if ( $new_url != $url )
  break;
}

// if a new url hasn't been generated yet, keep looking…
if ( $new_url == $url ) {
  // Cycle through image width only extensions, e.g. -200x
  foreach ( $image_exts_width as $image_ext ) {

    // check for width, e.g., -200x
    $pos1 = strrpos( $info['basename'] , $image_ext , -1 );
    if ( $pos1 ) {
      // strip, & assign new url
      $new_url = $info['dirname'] . '/' . substr( $info['basename'] , 0 , $pos1 ) . '.' . $info['extension'];
    }

    // we found an original – don't look any further
    if ( $new_url != $url )
      break;
  }

  // if a new url hasn't been generated yet, keep looking…
  if ( $new_url == $url ) {
    // Cycle through image height only extensions, e.g. x200.
    foreach ( $image_exts_height as $image_ext ) {

      // check for height, e.g., x200
      $pos2 = strrpos( $info['basename'] , $image_ext , -1 );

      //example_2a-263×300.jpg -> example_2a.jpg
      if ( $pos2 ) {
        // get position of -, strip, & assign new url
        $pos3 = strrpos( $info['basename'] , '-' , -1 );
        $new_url = $info['dirname'] . '/' . substr( $info['basename'] , 0 , $pos3 ) . '.' . $info['extension'];
      }

      if ( $new_url != $url )
        break;
    }
  }
}

if ( $new_url != $url )
  return $new_url;
else
  return $url;
}

I took the function from the article “How to Get Original Image from a Thumbnail Image in WordPress” (wpsmith.net) – however, there were some errors in the original function. I have corrected these and marked some of them accordingly at the top of the code.

What does the ‘get_original_image’ function do? First, all possible image formats or the respective widths and heights are saved in arrays. Then we compare each image URL found in the text of a page with the possible heights and widths. If height and/or width appear in the file name of the image, the ending with the height and width information (e.g. “-800×600”) is removed – and we have the original image.