WordPress Images: Difference between revisions

(5 intermediate revisions by the same user not shown)

Line 11:

==History==

WordPress Thumbnails. Errr, don't you mean 'Alternate Image Sizes'? Well, yes. But WordPress life started out referring to them as 'thumbnails'. A thumbnail being a downsized (as in dimensionally and quality) to a smaller size, which in turn usually represented a link to a larger, full sized image. That's how it began with WordPress. And sort of like Max Headroom, the name just sort of stuck, even though it doesn't refer to the same thing anymore.

==Compression==

On the subject of compression, most websites state WordPress compresses JPEG files using the setting of 90%. That is not true anymore as of early 2022. I confirmed this by experimenting with the ''add_filter( 'jpeg_quality', create_function( <nowiki>''</nowiki>, 'return 82;' ) );'' setting in the Child Theme ''functions.php'' file and it is 82%. This author confirms my testing with greater explanation: https://kinsta.com/blog/lossy-compression/ Below is the data (it was a quick test, so not too much data) and a 1066px x 799px Image with a bland background to give the compression program and easy job;

[[File:Skills JPEG 1066px x 799px.jpg|alt=Skills JPEG - 1066px x 799px|thumb]]

Original JPEG / JPG Image File Size (100% Quality): 56.4 KB (57,795 bytes as reported by Windows)

90% Quality File Size: 47.5 KB

86% Quality File Size: 40.0 KB

85% Quality File Size: 38.1 KB

84% Quality File Size: 37.1 KB

82% Quality File Size: 34.8 KB

80% Quality File Size: 33.1 KB

</syntaxhighlight>Now here's the freaky part. What do you think the file size would be if the ''add_filter( 'jpeg_quality', create_function( <nowiki>''</nowiki>, 'return 100;' ) );'' is set to 100? 56.4 KB? Nope. Like Gomer Pyle said, "Surprise, surprise, surprise!" See the table below;<syntaxhighlight lang="text">

Original JPEG / JPG Image File Size (100% Quality): 56.4 KB (57,795 bytes as reported by Windows)

100% Quality File Size: 132 KB

WTF!?

Not until 93% Quality does the compression setting equal the original file size.

</syntaxhighlight>

[[File:Modern Art JPEG 2048px X 2048px.jpg|alt=Modern Art JPEG 2048px X 2048px|left|thumb]]

But wait! That was an attention getter. What if the original file was already compressed? That would account for the odd compressing numbers, right? How about an original piece of Modern Art exported as a JPEG at 100%? Here's the data;<syntaxhighlight lang="text">

Original JPEG / JPG Image File Size (100% Quality): 479 KB

100% Quality File Size: 232 KB

82% Quality File Size: 85.8 KB

</syntaxhighlight>Phew! Sanity restored. But it is something to watch out for. If you've got a JPEG File that's already compressed, WordPress will compress it further. After about 10 uploads and downloads, it's gonna look a little fuzzy. So be careful where you get your JPEGs from. Don't just steal them. Steal them, then edit them. Just kidding. : )

Thanks to this website (http://regex.info/blog/lightroom-goodies/jpeg-quality) it is easy to discern for one's self (instead of taking my word or anyone else who writes an opinion on JPG Compression) how a gradient becomes visible to the human eye around 80% compression. They also include a bar graph that shows the file size. In the end, it seems evident the WordPress guys really did their homework and figured out that 82% is just about the perfect medium for Quality / Size. Good job guys! (I'm using the term 'guys' in a non-gender fashion)

==Image Management==

Line 43:

Line 74:

Thumbnail Cleaner: Good for focusing on getting rid of old thumbnails (Alternate Image Sizes). OK, here's the situation: You're switching to Real Thumbnail Generator and want to get rid of all the Alternate Image Sizes (AIS) in the Uploads Directory / 'flat file structure'. Clean up thumbnails before installing the Real Thumbnail Renerator is the best option. That's because it will scan and delete files in sub directories and those will need to be re-created too. No big deal unless there are a lot of images. Just a note: Using it with Real Media Physical Folders (or no Plugin) will result in any image file in the 'Thumbnail / AKA AIS' being deleted (CONFIRMED with testing, unless protected by a file permissions setting). IE, it seems to go after any image file in the uploads directory that is not the 'original' image.

Media Cleaner (Pro): Good for identifying any unused images (IE, the full size / original images)

Media Cleaner (Pro): Good for identifying any unused images (IE, the full size / original images). If one has a custom setting in a child theme's functions.php settings dealing with enabling Trash for Media items, it will mess this up.

===Media Organizers===

Line 54:

Line 85:

Media Library Assistant: Has its own "Media Screen" (Under Media, Assistant) with a bunch more options, some similar to Admin Columns Pro, LOTs of other stuff; Adds: "Parent Info" / AKA 'Attach to', Attachment Metadata, Attachment File Metadata, Attachment Categories (separate from Real, Media Library Organizer, etc., although all of them can import settings / categories), Attachment Tag, and "Set Feature Image" for an Image (which doesn't seem to make any sense, other than in a Yellow Submarine type of way).

===Bulk Editing===

===Bulk Editing (Renaming, changing Attributes, etc.)===

WP Sheet Editor (with Media Addon): Can Bulk Edit Media File Information

Line 60:

Line 91:

Media Library Assistant: Has it's own special "Assistant" Version of WP Media

Phoenix Media Renamer: This utility works, but one oddity is that the Timer (wait symbol) goes on forever, even if it has successfully renamed something, just reload the page and everything will be renamed and the timer symbol goes away. Also the method is a bit weird in that when doing it inline, one must check off the items to rename, even if it is just one, use the Apply Button and select the action to apply, and change the name

Media File Renamer: : It's advised to remove the Renamer Column when viewing media in the list view, because it takes FOREVER to go down the entire list

===MIME Types===

Line 81:

Line 116:

Real Media Library: Seems to add EXIF Data when uploading files.

WARNING: Haven't figured out which plugin did it, possibly Media Library Assistant (NOPE, checked it on another site, and that wasn't the one responsible), but a plugin added a BUNCH of columns to the the "Media Database", including EXIF, etc. The Smush Plugin does the same thing. It's fairly normal for a plugin to do this AND leave all the data behind (just in case one needs it in the future if the plugin is reinstalled)~~ ~~

WARNING: Haven't figured out which plugin did it, possibly Media Library Assistant (NOPE, checked it on another site, and that wasn't the one responsible), but a plugin added a BUNCH of columns to the the "Media Database", including EXIF, etc. The Smush Plugin does the same thing. It's fairly normal for a plugin to do this AND leave all the data behind (just in case one needs it in the future if the plugin is reinstalled)

===Services===

There are also a bunch of image related plugins from ShortPixel, along with what seems like dozens more, that have 'free' plugins (IE, there is no 'pro' version), and instead sell a service. Interesting concept in that they make their plugin a 'thin-net' client that then sends an original image off to a server to be manipulated (resized, cropped, format changed, etc.). That has the advantage of reducing CPU usage on a server, but it has a downside of using up valuable bandwidth to upload large images and then download them again. In strict terms of time, tried a quick test with a couple of services that offered a free trial and discovered it was faster to deal with the minuscule CPU hit instead of all the time it took to upload the file, have it processed, then download everything (network, CPU, and disk access time all came into play). Of course the testing was done using a huge image file and that would seem to be similar to using a bunch of smaller files. It's an interesting angle and of course the sellers are going to point out all the benefits. But of course they're the ones benefiting too by selling a subscription. My choice? Keep it 'in house'.

==Summary==

Line 87:

Line 125:

*Real Media Library, Real Thumbnail Generator, and Real Physical Media

*Media Library Assistant

*Media Library Assistant (it provides an "Advanced Version" of Media, so if using Menu Editor Pro, think about moving 'Assistant' (under Media) to the top (replacing Library, under Media) as the default function of Media

*WP Sheet Editor

*Media File Renamer (from Meow Apps, and maybe Media Cleaner too)

*Thumbnail Cleaner

*Media File Renamer (from Meow Apps)

**Use Phoenix Media Rename for inline name changes

*Optional

**EXIF Details (if one desires EXIF details in list view)

**EXIF Details (if one desires EXIF details in list view): These are actual values read from the file, not "mapped" EXIF values stored in a WordPress Database (as of 2022, there doesn't seem to be any plugin to change the values in the file, only read them, but there are Windows and Linux utilities to do this.

**Media Cleaner (if one desires eliminating unused images)

**WP Attachment: Shows what Images or Media is attached to a Page or Post, etc. (when editing the Page or Post, etc.)

==Gotchas with Real Physical Media and Real Thumbnail Generator==

===Major Issue===

Ran into an issue with the Real Physical Media Plugin. In the "Settings Section" (on the same page as Settings, Media) for Real Physical Media, when it is first installed, there is a notification that states: "You have not currently activated a file handler. Please activate a file handler in the settings below." Immediately below that is a field titled "File moving handler", which should show a File Renaming Handler indicating the Media File Renamer (by Meow Apps) is selected or needs activating (it appears, like the Henry Ford saying "You can have any color you want as long as it's black." in response to a question about available colors for the Model T Ford). Sometimes it doesn't

The problem involves the name of the PlugIn Directory. IE, the Real Physical Media Plugin Directory should be: real-physical-media If it isn't, the plugin won't work. This isn't completely the fault of Real Physical Media (it just means they've got the plugin directory name hardcoded in somewhere instead of using a call function). Other plugins can have similar issues, so don't rename the plugin folder from its original name.

===Custom CSS===

When using the Real Physical Media Plugin, it is very likely that if custom CSS is being used (like with Custom CSS and JS), those paths will need to be modified manually.

=== File Names with Periods ===

When using the Real Physical Media Plugin, if a file has a Period in it, one of two issues occurs. One, RMP strips out periods (and other non-WordPress compatible characters or modifies them in some way when setting things up and / or uploading files), or it can't handle periods in a file name, other than an extension. The former could be a setting, the latter could be a programming issue. For instance, PictureNameFromXYZ.com.jpg becomes PictureNameFromXYZ.com

~~ ~~

=== Images that have been Inserted as Thumbnails (AKA Alternate Image Sizes) ===

If an image has been inserted into a Post with as "Thumbnail" size (IE, not the Original Size), and "Thumbnails" are regenerated with Real Thumbnail Generator ''and'' and alternative storage location is used, then something breaks for the file path.

@@ Line 11: / Line 11: @@
 ==History==
 WordPress Thumbnails.  Errr, don't you mean 'Alternate Image Sizes'?  Well, yes.  But WordPress life started out referring to them as 'thumbnails'.  A thumbnail being a downsized (as in dimensionally and quality) to a smaller size, which in turn usually represented a link to a larger, full sized image.  That's how it began with WordPress.  And sort of like Max Headroom, the name just sort of stuck, even though it doesn't refer to the same thing anymore.
+==Compression==
+On the subject of compression, most websites state WordPress compresses JPEG files using the setting of 90%.  That is not true anymore as of early 2022.  I confirmed this by experimenting with the ''add_filter( 'jpeg_quality', create_function( <nowiki>''</nowiki>, 'return 82;' ) );'' setting in the Child Theme ''functions.php'' file and it is 82%.  This author confirms my testing with greater explanation: https://kinsta.com/blog/lossy-compression/ Below is the data (it was a quick test, so not too much data) and a 1066px x 799px Image with a bland background to give the compression program and easy job;
+[[File:Skills JPEG 1066px x 799px.jpg|alt=Skills JPEG - 1066px x 799px|thumb]]
+<br /><syntaxhighlight lang="text">
+Original JPEG / JPG Image File Size (100% Quality): 56.4 KB (57,795 bytes as reported by Windows)
+% Quality File Size: 47.5 KB
+% Quality File Size: 40.0 KB
+% Quality File Size: 38.1 KB
+% Quality File Size: 37.1 KB
+% Quality File Size: 34.8 KB
+% Quality File Size: 33.1 KB
+</syntaxhighlight>Now here's the freaky part.  What do you think the file size would be if the ''add_filter( 'jpeg_quality', create_function( <nowiki>''</nowiki>, 'return 100;' ) );'' is set to 100?  56.4 KB?  Nope.  Like Gomer Pyle said, "Surprise, surprise, surprise!"  See the table below;<syntaxhighlight lang="text">
+Original JPEG / JPG Image File Size (100% Quality): 56.4 KB (57,795 bytes as reported by Windows)
+% Quality File Size: 132 KB
+WTF!?
+Not until 93% Quality does the compression setting equal the original file size.
+</syntaxhighlight>
+[[File:Modern Art JPEG 2048px X 2048px.jpg|alt=Modern Art JPEG 2048px X 2048px|left|thumb]]
+But wait!  That was an attention getter.  What if the original file was already compressed?  That would account for the odd compressing numbers, right?  How about an original piece of Modern Art exported as a JPEG at 100%?  Here's the data;<syntaxhighlight lang="text">
+Original JPEG / JPG Image File Size (100% Quality): 479 KB
+% Quality File Size: 232 KB
+% Quality File Size: 85.8 KB
+</syntaxhighlight>Phew!  Sanity restored.  But it is something to watch out for.  If you've got a JPEG File that's already compressed, WordPress will compress it further.  After about 10 uploads and downloads, it's gonna look a little fuzzy.  So be careful where you get your JPEGs from.  Don't just steal them.  Steal them, then edit them.  Just kidding. <span> </span>: )
+Thanks to this website (http://regex.info/blog/lightroom-goodies/jpeg-quality) it is easy to discern for one's self (instead of taking my word or anyone else who writes an opinion on JPG Compression) how a gradient becomes visible to the human eye around 80% compression.  They also include a bar graph that shows the file size.  In the end, it seems evident the WordPress guys really did their homework and figured out that 82% is just about the perfect medium for Quality / Size.  Good job guys! (I'm using the term 'guys' in a non-gender fashion)
 ==Image Management==
@@ Line 43: / Line 74: @@
 Thumbnail Cleaner: Good for focusing on getting rid of old thumbnails (Alternate Image Sizes).  OK, here's the situation: You're switching to Real Thumbnail Generator and want to get rid of all the Alternate Image Sizes  (AIS) in the Uploads Directory / 'flat file structure'.  Clean up thumbnails before installing the Real Thumbnail Renerator is the best option.  That's because it will scan and delete files in sub directories and those will need to be re-created too.  No big deal unless there are a lot of images.  Just a note: Using it with Real Media Physical Folders (or no Plugin) will result in any image file in the 'Thumbnail / AKA AIS' being deleted (CONFIRMED with testing, unless protected by a file permissions setting).  IE, it seems to go after any image file in the uploads directory that is not the 'original' image.
-Media Cleaner (Pro): Good for identifying any unused images (IE, the full size / original images)
+Media Cleaner (Pro): Good for identifying any unused images (IE, the full size / original images).  If one has a custom setting in a child theme's functions.php settings dealing with enabling Trash for Media items, it will mess this up.
 ===Media Organizers===
@@ Line 54: / Line 85: @@
 Media Library Assistant: Has its own "Media Screen" (Under Media, Assistant) with a bunch more options, some similar to Admin Columns Pro, LOTs of other stuff; Adds: "Parent Info" / AKA 'Attach to', Attachment Metadata, Attachment File Metadata, Attachment Categories (separate from Real, Media Library Organizer, etc., although all of them can import settings / categories), Attachment Tag, and "Set Feature Image" for an Image (which doesn't seem to make any sense, other than in a Yellow Submarine type of way).
-===Bulk Editing===
+===Bulk Editing (Renaming, changing Attributes, etc.)===
 WP Sheet Editor (with Media Addon): Can Bulk Edit Media File Information
@@ Line 60: / Line 91: @@
 Media Library Assistant: Has it's own special "Assistant" Version of WP Media
+Phoenix Media Renamer: This utility works, but one oddity is that the Timer (wait symbol) goes on forever, even if it has successfully renamed something, just reload the page and everything will be renamed and the timer symbol goes away.  Also the method is a bit weird in that when doing it inline, one must check off the items to rename, even if it is just one, use the Apply Button and select the action to apply, and change the name
+Media File Renamer:<span> </span>: It's advised to remove the Renamer Column when viewing media in the list view, because it takes FOREVER to go down the entire list
 ===MIME Types===
@@ Line 81: / Line 116: @@
 Real Media Library: Seems to add EXIF Data when uploading files.
-WARNING: Haven't figured out which plugin did it, possibly Media Library Assistant (NOPE, checked it on another site, and that wasn't the one responsible), but a plugin added a BUNCH of columns to the the "Media Database", including EXIF, etc.  The Smush Plugin does the same thing.  It's fairly normal for a plugin to do this AND leave all the data behind (just in case one needs it in the future if the plugin is reinstalled)<br />
+WARNING: Haven't figured out which plugin did it, possibly Media Library Assistant (NOPE, checked it on another site, and that wasn't the one responsible), but a plugin added a BUNCH of columns to the the "Media Database", including EXIF, etc.  The Smush Plugin does the same thing.  It's fairly normal for a plugin to do this AND leave all the data behind (just in case one needs it in the future if the plugin is reinstalled)
+===Services===
+There are also a bunch of image related plugins from ShortPixel, along with what seems like dozens more, that have 'free' plugins (IE, there is no 'pro' version), and instead sell a service.  Interesting concept in that they make their plugin a 'thin-net' client that then sends an original image off to a server to be manipulated (resized, cropped, format changed, etc.).  That has the advantage of reducing CPU usage on a server, but it has a downside of using up valuable bandwidth to upload large images and then download them again.  In strict terms of time, tried a quick test with a couple of services that offered a free trial and discovered it was faster to deal with the minuscule CPU hit instead of all the time it took to upload the file, have it processed, then download everything (network, CPU, and disk access time all came into play).  Of course the testing was done using a huge image file and that would seem to be similar to using a bunch of smaller files.  It's an interesting angle and of course the sellers are going to point out all the benefits.  But of course they're the ones benefiting too by selling a subscription.  My choice?  Keep it 'in house'.
 ==Summary==
@@ Line 87: / Line 125: @@
 *Real Media Library, Real Thumbnail Generator, and Real Physical Media
-*Media Library Assistant
+*Media Library Assistant (it provides an "Advanced Version" of Media, so if using Menu Editor Pro, think about moving 'Assistant' (under Media) to the top (replacing Library, under Media) as the default function of Media
 *WP Sheet Editor
-*Media File Renamer (from Meow Apps, and maybe Media Cleaner too)
 *Thumbnail Cleaner
+*Media File Renamer (from Meow Apps)
+**Use Phoenix Media Rename for inline name changes
 *Optional
-**EXIF Details (if one desires EXIF details in list view)
+**EXIF Details (if one desires EXIF details in list view): These are actual values read from the file, not "mapped" EXIF values stored in a WordPress Database (as of 2022, there doesn't seem to be any plugin to change the values in the file, only read them, but there are Windows and Linux utilities to do this.
 **Media Cleaner (if one desires eliminating unused images)
+**WP Attachment: Shows what Images or Media is attached to a Page or Post, etc. (when editing the Page or Post, etc.)
+==Gotchas with Real Physical Media and Real Thumbnail Generator==
+===Major Issue===
+Ran into an issue with the Real Physical Media Plugin.  In the "Settings Section" (on the same page as Settings, Media) for Real Physical Media, when it is first installed, there is a notification that states: "You have not currently activated a file handler. Please activate a file handler in the settings below."  Immediately below that is a field titled "File moving handler", which should show a File Renaming Handler indicating the Media File Renamer (by Meow Apps) is selected or needs activating (it appears, like the Henry Ford saying "You can have any color you want as long as it's black." in response to a question about available colors for the Model T Ford).  Sometimes it doesn't
+The problem involves the name of the PlugIn Directory.  IE, the Real Physical Media Plugin Directory should be: real-physical-media  If it isn't, the plugin won't work.  This isn't completely the fault of Real Physical Media (it just means they've got the plugin directory name hardcoded in somewhere instead of using a call function).  Other plugins can have similar issues, so don't rename the plugin folder from its original name.
+===Custom CSS===
+When using the Real Physical Media Plugin, it is very likely that if custom CSS is being used (like with Custom CSS and JS), those paths will need to be modified manually.
+=== File Names with Periods ===
+When using the Real Physical Media Plugin, if a file has a Period in it, one of two issues occurs.  One, RMP strips out periods (and other non-WordPress compatible characters or modifies them in some way when setting things up and / or uploading files), or it can't handle periods in a file name, other than an extension.  The former could be a setting, the latter could be a programming issue.  For instance, PictureNameFromXYZ.com.jpg becomes PictureNameFromXYZ.com
-<br />
+=== Images that have been Inserted as Thumbnails (AKA Alternate Image Sizes) ===
+If an image has been inserted into a Post with as "Thumbnail" size (IE, not the Original Size), and "Thumbnails" are regenerated with Real Thumbnail Generator ''and'' and alternative storage location is used, then something breaks for the file path.