functions - Possible to hook into Media Library preview File column and use a custom image?

admin管理员组

文章数量:1279148

The project I'm working on, I couldn't find an easy way to have WordPress create the thumbnails sizes I needed without tons of waste, nor to simultaneously generate WebP versions, so I disabled the thumbnails, I upload a full-size jpg or png, and then I manually generate my WebP and other sizes and copy them to the uploads. A custom PHP function handles building responsive <picture>.

However, I'd like to avoid the media library loading up the full-size image as the thumbnail all the time, as it's a waste of bandwidth. I'd like to point to a small WebP or JPG version that is not in the library but in the uploads folder and have it load that image instead. The file name is almost the same, just needs to be appended with _width (width being a number) which I could do with strtr or something.

Is there a way to access the Media Library File column with a function and a hook/filter so I can change the src path to the thumbnail image? I'd also need to avoid PDF, SVG and TXT file uploads and just target JPG or PNG files. If it's not possible, I'll have to generate a thumbnail with a custom size.

The project I'm working on, I couldn't find an easy way to have WordPress create the thumbnails sizes I needed without tons of waste, nor to simultaneously generate WebP versions, so I disabled the thumbnails, I upload a full-size jpg or png, and then I manually generate my WebP and other sizes and copy them to the uploads. A custom PHP function handles building responsive <picture>.

However, I'd like to avoid the media library loading up the full-size image as the thumbnail all the time, as it's a waste of bandwidth. I'd like to point to a small WebP or JPG version that is not in the library but in the uploads folder and have it load that image instead. The file name is almost the same, just needs to be appended with _width (width being a number) which I could do with strtr or something.

Is there a way to access the Media Library File column with a function and a hook/filter so I can change the src path to the thumbnail image? I'd also need to avoid PDF, SVG and TXT file uploads and just target JPG or PNG files. If it's not possible, I'll have to generate a thumbnail with a custom size.

• functions
• filters
• hooks
• uploads
• media-library

Share Improve this question edited Oct 8, 2021 at 0:18 liquidRock asked Oct 7, 2021 at 19:31 liquidRockliquidRock 20711 silver badge99 bronze badges 10

• WP 5.8 can create webp images automatically if the server has support. Otherwise, it's not clear what you mean by file column, can you describe it using other words or a screenshot? Are you talking about the custom table view? Or the panel on the right when selecting an image? Or something else? – Tom J Nowell ♦ Commented Oct 7, 2021 at 23:56
• Also, have you asked how to dynamically generate images to avoid the waste you didn't want? This sounds more like a fix for a fix rather than a fix for a problem – Tom J Nowell ♦ Commented Oct 7, 2021 at 23:57
• I couldn't find anything about dynamically creating all file formats necessary. WordPress seems to default to using whatever type you feed it (give it WebP, you only get WebP, etc.) I built Photoshop actions and have a file renamer, so it's actually not much of a chore, time is limited and couldn't spend more time digging or posting for solution. As for "File Column," thumbnails are displayed in the File column in the Media Library. I want to modify the wp_get_attachment_image src for the thumbnails. wp_enqueue_media might be the way, but not sure how to go about it. I'll add a screenshot. – liquidRock Commented Oct 8, 2021 at 0:15
• Also, as I said, WordPress makes thumbnails for everything, even if you don't need the sizes for all images in your design. I scoured this site and others and even posted here (or SO) about how to specifically make WordPress use the image_sizes I wanted based on a file prefix, but no one responded. As it is, I already have 2,000 images do to responsive and the site isn't live, and I couldn't keep waiting without a reply, so this is the route I took. Everything works great and I use a plugin to organize uploads into directories. Just need to modify the admin thumbnail src somehow. – liquidRock Commented Oct 8, 2021 at 0:22
• And one last note, having WordPress dynamically generate WebP might not be ideal. I have to finesse quality in Photoshop sometimes and I made variants of my actions because sometimes the image quality will fall apart unless you bump up the WebP quality by a few percent, while other images hold up fine. Having one quality setting for everything wouldn't work well for this project. – liquidRock Commented Oct 8, 2021 at 0:24

 |  Show 5 more comments

1 Answer 1

Sorted by: Reset to default 1

I managed to solve this after being pointed in the right direction. In my case, I filtered wp_get_attachment_image_attributes to change all the paths in the admin for attachments at once.

In my case, I am using descriptive suffixes on all my image files (i.e. _featured etc) so modifying them was easy using strtr which I also used to change the extension from jpg to webp.

Now all attachment image previews load in the files I want in the correct format at the desired size, and it works for Media Library, featured images, and custom fields.

add_filter( 'wp_get_attachment_image_attributes', 'my_attachment_filter', 10, 3 );
function my_attachment_filter($attr, $attachment, $size){
    if (is_admin()){
        if (array_key_exists( 'src' , $attr)){
            $old_src = $attr['src'];
            $new_src = strtr($old_src, array('_featured' => '_featured_eighth', '_portrait' => '_portrait_204', '_og.' => '_og_320.', '.jpg' => '.webp'));
            $attr['src'] = $new_src;
        }
    }
    return $attr;
}

本文标签： functionsPossible to hook into Media Library preview File column and use a custom image