1

There are hundreds of posts having "full" size images already published within post content.

Blog contributors have uploaded very large image (some like 3000px wide) files, by design these were fitted within css width:100% and height:100% so no one could notice this from the frontend until I started investigating the high page load timings.

The images inside the posts also have editorial formatting. Like ".align-right" etc.

I am in need of a technique to replace these with the full sized images with large ones.

Some approach:

  • Get all posts
  • regex content and find image tags
  • try to find image id's from the filenames
  • replace post content with the full image urls
  • update post

What do you think? Is there an easier way to accomplish this task?

Thank you.

1
  • I think your workflow is the best you can find. Regex to get images urls is relatively easy to write, and Google will help you if you need. To get image id from urls in this answer there is a function for that.
    – gmazzap
    Commented Nov 16, 2013 at 23:42

1 Answer 1

3

I solved my own problem by using the creating a page using the following template. Just create and visit the page using the template below.

You will only be viewing the results with primitive pagination, follow the code and it's easy. Changes will not be saved until you visit /whatever-permalink-you-have/?updating=true

Caution

Please backup your database first if you decide to use this. It is always best to make trials on a duplicated database.

If you are using shortcodes that produce html output, they will be rendered into the post body. Please change the code accordingly.

This file uses PHP Simple HTML DOM Parser. It is expected to be in libs/ folder.

<?php
    /**
     * Template Name: Util: Replace full sized images with large
     */
    ?>

    <html>
    <body>
    <style>
        body {
            font-family: "Arial", sans-serif;
        }

        a.caution-link {
            background: red; 
            color: white; 
            text-decoration:none;
            display: inline-block;
            padding: 3px 5px 3px 5px;
            font-weight: bold;
        }
        a.caution-link:hover {
            background: black;
        }
    </style>

    <?php

    if (!class_exists('Refresh_Full_Sized_Images_With_Large_Action')) {

        /* PHP Simple HTML DOM Parser */
        include('libs/simple_html_dom.php');

        class Refresh_Full_Sized_Images_With_Large_Action {

            public function __construct() {

                /* options */
                $this->limit = 10;
                $this->start = 0;

                /* get the posts */ 
                $this->getPosts();
                /* do the action */
                $this->checkAndUpdatePosts();

            }

            private function getPosts() {

                global $wpdb;
                /* only apply if the url parameter "updating" is "true" */
                if ( isset($_GET['updating']) && $_GET['updating'] == "true" ) {
                    $this->isUpdating = true;
                    echo ("<h1>UPDATED</h1><hr>");
                    } else {
                    $this->isUpdating = false;
                    echo ("<h1 style='color:#ccc'>JUST CHECKING...</h1><hr>");
                }

                /* set the limit above or you may change this parameter from the url */ 
                if ( isset($_GET['limit']) && is_numeric( $_GET['limit'] ) ) { 
                    $this->limit = $_GET['limit'];
                }       

                if ( isset($_GET['start']) && is_numeric( $_GET['start'] ) ) { 
                    $this->start = $_GET['start'];
                }       


                /* the sql, finding posts having "size full" image tags inside */
                $sql = "select ID, post_content, post_title, post_type from $wpdb->posts
                        WHERE 
                        MATCH(post_content) AGAINST ('\"size full wp-image\"' IN BOOLEAN MODE) AND
                        post_type IN('post')
                        ORDER BY ID DESC
                        LIMIT {$this->start},{$this->limit}";

                /* get results */
                $this->foundPosts = $wpdb->get_results($sql);

                /* the top links */
                $next = $this->start+$this->limit;
                $links = "<a href='?start=0&limit=$this->limit'>CHECK FIRST {$this->limit}</a> | ";
                $links .= "<a href='?start=$next&limit=$this->limit'>CHECK NEXT {$this->limit}</a> | ";
                $links .= "<a href='?start=$next&limit=$this->limit&updating=true' class='caution-link'>NEXT {$this->limit} POSTS + APPLY</a> | ";
                $links .= "<a href='?start=$this->start&limit=$this->limit&updating=true' class='caution-link'>APPLY TO THESE</a> <hr>";
                echo $links;
            }

            /* loop found posts and update image attributes  if necessary */
            private function checkAndUpdatePosts(){

                foreach ( $this->foundPosts as $thePost ) {

                    /* show us a link to check the posts before update and the action link */
                    echo "<h3><a href='",get_permalink($thePost->ID),"'/ target='_blank'>{$thePost->ID}</a> • {$thePost->post_type} • {$thePost->post_title}</h3>";

                    $i=0;

                    $html = str_get_html( apply_filters('the_content', $thePost->post_content ) );
                    $images = array();

                    /* go through the images having "size-full" class and update if necessary */
                    foreach( $html->find('img.size-full') as $image ) {

                        $imageID = $this->get_img_id_from_url( $image->getAttribute('src') );
                        $imageWidth = $image->getAttribute('width');

                        if ( !is_numeric($imageID) ) {
                            $images[$i]['n/a'] = $image->getAttribute('src');
                            $images[$i]['width'] = $imageWidth;
                            $images[$i]['returned'] = $imageID;
                            $images[$i]['error'] = "Not found.";            
                            $isUpdatingCheck = false;
                            $i++;
                            continue;
                        } else {
                            $isUpdatingCheck = true;
                        }

                        $images[$i]['imageID'] = $imageID;

                        $newImg = wp_get_attachment_link( $imageID, 'large' );
                        $newImgMetaData = wp_get_attachment_image_src( $imageID, 'large' );

                        $images[$i]['found']['width'] = $image->getAttribute('width');
                        $images[$i]['found']['src'] = $image->getAttribute('src');
                        $images[$i]['found']['escaped_html'] = esc_html( $image->outertext );
                        // $images[$i]['found']['html'] = $image->outertext;

                        $images[$i]['new']['width'] = $newImgMetaData[1];
                        $images[$i]['new']['src'] = $newImgMetaData[0];

                        $image->setAttribute('src', $newImgMetaData[0]);
                        $image->setAttribute('width', $newImgMetaData[1]);
                        $image->setAttribute('height', $newImgMetaData[2]);
                        $image->setAttribute('class', str_replace('size-full', 'size-large', $image->getAttribute('class') ));

                        $images[$i]['new']['escaped_html'] = esc_html( str_replace( '</img>','', $image->outertext ) );         
                        // $images[$i]['new']['html'] = $image->outertext;

                        $i++;

                    }

                    /* if updating, do the action */
                    if  ( $this->isUpdating && $isUpdatingCheck ) {
                        $this->updatePost( $thePost->ID, $html->outertext );
                    }

                    /* show us some info */
                    echo '<pre>';   
                    print_r($images);       
                    echo '</pre></hr>';             

                }


            }

            /* find the image id from the url */
            private function get_img_id_from_url( $attachment_url = '' ) {
                global $wpdb;
                    $imgSQL =  "SELECT ID FROM $wpdb->posts WHERE guid = '{$attachment_url}'";
                    $imageID = $wpdb->get_var( $imgSQL );

                    /* second try, use postmeta table to find the id */
                    if (!is_numeric($imageID)) {                    

                        $findIt = $this->splitn( $attachment_url, '/', 5 );
                        $meta_value = $findIt[1];

                        $imgSQL =  "SELECT post_id FROM $wpdb->postmeta WHERE meta_value = '{$meta_value}'";
                        $imageID = $wpdb->get_var( $imgSQL );

                    }

                return $imageID;
            }

            /* update the post */
            private function updatePost ( $post_id, $post_content ) {

                $my_post = array(
                  'ID'           => $post_id,
                  'post_content' => $post_content
                );

                wp_update_post( $my_post );
            }

            /* split a string from the nth pos */
            private function splitn($string, $needle, $offset) {

                $newString = $string;
                $totalPos = 0;
                $length = strlen($needle);
                for($i = 0; $i < $offset; $i++)
                {
                    $pos = strpos($newString, $needle);
                    // If you run out of string before you find all your needles
                    if($pos === false)
                        return false;
                    $newString = substr($newString, $pos+$length);
                    $totalPos += $pos+$length;
                }
                return array(substr($string, 0, $totalPos-$length),substr($string, $totalPos));
            }


        } // class ends

    } // if

    $theImageUpdater = new Refresh_Full_Sized_Images_With_Large_Action();

    ?>
    </body>
    </html>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.