Plugins: Automatic Image Size Manipulation

Plugins: Automatic Image Size Manipulation

A comprehensive explanation of all generated image sizes can be found in the article Image Sizes in WordPress.

Responsive Image Markup (srcset)

The plugin Disable Responsive Images Complete prevents the generation of responsive (srcset) markup on the frontend of WordPress websites. It does not impact image sizes within WordPress itself. For more information refer to this article: Disable WordPress Responsive Images, a u pitanju je 1 linija koda sa “max_srcset_image_width” hook.

Define or Disable Image Sizes

Disable media sizes, disable image sizes, how to stop the “bloat shit” in Media Library

Ovi pluginovi ustvarti kontrolišu šta će se sve generisati na backend-u i u kojim veličinama, ali ne daju podešavanja za markup. Na kraju je najkompletniji ipak “Disable Generate Thumbnails” plugin.

Plugin “Admin and Site Enhancements (ASE)” poseduje opciju “Utilities > Image Sizes Panel” koja uključuje stvarno korisnu opciju prikaza ka svim generisanim sizes iz foldera, when viewing an image in the media library. Tako da ovo u svkom slučaju treba koristiti.

Plugin Disable Generate Thumbnails is created by a Japanese minimalist and it only uses hooks intermediate_image_sizes_advanced and big_image_size_threshold for large image threshold, to remove image sizes and it does this in 5 lines of code. What makes this plugin the best is that it also takes image rotation into account, specifically “-rotated.jpg” images, and allows for the disabling of Exif automatic rotation. This is achieved using just one hook wp_image_maybe_exif_rotate, and the “Disable Generate Thumbnails” plugin utilizes it with just one line of code.

The plugin Disable Media Sizes allows you to selectively disable specific image sizes. Unlike the previous plugin, it does not deal with output or markup. If you want to learn more, you can find a detailed guide here: How to Disable WordPress Automatically Generated Images

To quickly list all the registered image sizes on a server CLI, the WP-CLI wp media image-size command is the fastest method.

Simple Image Sizes opcije smešta u “Settings > Media” i takođe služi za definisanje image sizes, ali za razliku od osnovnih, ovaj poseduje korektnu regenerate thumbnaila, za sve slike odnosno po nekim rudimentarnim kriterijumima, ali i pojedinačno pored imena slike u list view. U pitanju je pravi open-source na repo rahe/simple-image-sizes: Simple image sizes is a plugin for WordPress, it allows you to set new thumbnail sizes and regenerte them by ajax. Nešto mi nije uspelo da sa njim trajno uklonim neke media sizes, ali možeš da navedeš 0,0 pa da ih tako ukloniš, ali svejedno - izdvaja se po tome što ima regenerate pojedinačnih slika.

“Image Quality Control” koji se niže pominje je odličan i za ovaj task jer podržava sva detaljna podešavanja a podržava i image regeneration, kompletno svega ali i preko unosa image ID odnosno klikom pored slike (“Run Re-Compression”). Glavna prednost u odnosu na druge je podešavanje kompresije koje može biti korisno.

Image Sizes Controller, Create Custom Image Sizes, Disable Image Sizes je od autora “AVIF Support” i bavi se samo image sizes. U Pro verziji ume da lista sve image sizes za svaku sliku i da označi missing. Ali sve je u odvratnom UI, baš odvratnom. Međutim, ima predivnu opciju “Hide disabled sizes from registered sizes” koja hide disabled sizes from global registered sizes - useful when using other related plugins.

“Scaled” images su malo drugačije

To disable “-scaled” images, deploy tiny PHP code (explained here iz plugina vezanog za srcset markup (čudno ali tako) or use an option named “Large image threshold” in Disable Generate Thumbnails plugin by Japanese minimalist, koji mi se baš zato i više sviđa.

Kako u ovim pluginovima isključujem “scaled” images?

Nothing deletes “-scaled” image files from disk - it’s easy to stop them from getting created, but automatic file removal is not possible so just remove it using FTP or shell or similar.

Postoji i “-cropped”?

Postoji izgleda i još jedna vrsta fajla? “-cropped”?. Note that cropping an image directly in the block editor works differently - a new image is created in the media library with the name “-cropped” and cropped dimensions, all sub-sizes are re-generated for that image.

Set Thumbnail Aspect-Ratio

Ratio Thumbnails Size specify the ratio of thumbnails generation, od omiljenog Japanskog autora minimaliste. Nakon pregleda koda, vidim da u hook intermediate_image_sizes_advanced možeš da promeniš parametar “crop info” i da navedeš kako da se image cropuje.

Set Thumbnail Quality

Image Quality Control | Still BE je jedini kod koga sam pronašao da omogućava ovo podešavanje. Iako zvuči nestvarno, ovaj plugin ipak ne ume da disableovanje image sizes ali ume da doda nove sizes.

Ume sam da enable automatically Generating WebP (isključi i koristi oficijelno rešenje za WebP), ali ne menja ništa priliko servovanja. Opcije koje uključujem su to Autoset Alt from Exif, možda Guarantee a Secure Filename, uključi Force Adding the Query String for Image Cache Clear. Button “Run Re-Compression” radi pravilno i lepo sa oficijelnim WebP pluginom “WebP Uploads”.

JPEG Quality Settings je, baš kao što ime kaže, baš i samo to, i zato mi se i sviđa i možda nije loš kao esencijalni plugin.

WP Resized Image Quality


Ovovovov:

Introducing WP Image Processing Queue - On‑the‑Fly Image Processing Done Right Image Processing Queue deliciousbrains/wp-image-processing-queue: Resize WordPress images in the background


Responsive Image Breakpoints Generator by Cloudinary Responsive Images In WordPress - Sharper Images, Faster Loading


Picturefill.WP kylereicks/picturefill.js.wp: A WordPress plugin to use Picturefill.js for image loading.

1: Resize images and create thumbnails (srcset)

First thing to do is to have proper image sizing and possibly serve srcset adaptive images.

1.1 Serve Responsive / Adaptive Images

Creates srcset to deliver resized images based on device.

Introducing WP Image Processing Queue - On‑the‑Fly Image Processing Done Right


Srcset & Sizes attibutes su glavni za odabir slike

U suštini, srcset wp dobro šalje, jer je to jednostavno, odnosno šalju se sve postojeće veličine.

sizes je mnogo komplikovaniji, jer tu govoriš koji deo širine ekrana zauzima slika. Po defaultu, uzima se 100vw, ali pošto to na deskopu skoro nikada nije, onda moraš da podesiš.

t-hamano/enable-responsive-image: WordPress plugin that adds settings to the Image block to display different images depending on the width of the screen. je super plugin koji ti omogućava da menjaš sliku za svaku veličinu, a pritom i dalje koristi standardni srcset.


The perfectly explained purpose of the image size of (0,0) is that it essentially means “no size constraint” as you are not specifying either width or height. In practical terms, it will not create any new image size, but that image size still exists. When something calls this image size, it will just use the original image that was uploaded.

The list of all available image sizes, both built-in and added with get_intermediate_image_sizes(), returns an array of only names. With wp_get_registered_image_subsizes(), you obtain the names and all the details of each size.

The best way, therefore, is to set unwanted built-in sizes to 0,0 in the Admin UI. However, if you want to do it through PHP code, the only way is to directly enter it into the database using update_option as shown in the example.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
# thumbnail size
update_option('thumbnail_size_w', 200);
update_option('thumbnail_size_h', 200);
update_option('thumbnail_crop', 1);

# medium image size
update_option('medium_size_w', 450);
update_option('medium_size_h', 300);

# large image size
update_option('large_size_w', 800);
update_option('large_size_h', 600);
update_option('large_crop', 1)

If one of values are 0, the other is essentially setting maximum size of width or height. It maintains the original aspect ratio. When either one size limit is met, the image dimension is limited. So an image with a full size of 1080 X 1920 will have a large size of 338 X 600, because the width limit 600 is met. If the crop option was set to 1 or true by using. Then the size will be forced to 800 X 600 with cropping.

WordPress Default Image Size update

Sve opcije vezane za media sizes: Option Reference « WordPress Codex

Srcset: Generating Multiple Image Dimension Files

Configuring Standard Image Size Generation


Trying to disable any extra image generation

# enable any image size in srsset
add_filter( 'max_srcset_image_width', '__return_false' ); 

or

# Disable the srcset markup that is added to every img tag on the frontend
add_filter( 'max_srcset_image_width', fn() => 1 ); 

DX Webp Picture Tag Image Wrapper filters the content and replaces the img tags with tags by adding two sources – one with the image followed by .webp extension, i ovo je najbliže što sam prišao pravilnom generisanju taga, naravno bez AVIF. I on napada ’the_content’ filter i ništa pametnije od toga.

tag is for avif and webp

intermediate_image_sizes_advanced | Hook | WordPress Developer Resources

wtf wp_image_add_srcset_and_sizes

Treba: I just want an image on my page drag and drop image The picture element Serve responsive images

Disabling Unused WordPress Features - WordPress - Design 2 SEO

On The Fly Generation

uploads - How to generate thumbnails when needed only? - WordPress Development Stack Exchange

WebP + AVIF converter automatically convert ali on the fly, ali servuje samo sa .htaccess rewrite rules pa se hvali što only images which are used will be converted. Mislim da je vrlo lepo napisan i koristan. Sve slike snima u cache/fastware-webpavif, a kodiran je bez WP_Image_Editor i koristi ugrađeni WP Cron queue za procesiranje.

Thumbnails od autora je aktivno razvijan sa info na Thumbnails, ali nisam oduševljen kodiranjem i nema queue.

Better image sizes uglavnom je malo unapređeni Fly Dynamic Image Resizer jer je ovaj prestao sa razvojem, ali sa dodatim funkcijama face detection crop, focal point selector for every image, multiple functions to output responsive sizes. Zgodno je i što dodaje button u media library pored image “Regenerate BIS images” i slike se snimaju u subfolder uploads/bis-images iako se i to može promeniti. Inače, sve se dešava tek kada koristiš njegove funkcije za output. Bavi se bespotrebno i sa image sizes i sa big image size threshold, valjda da bi bio kompletno rešenje, ali ne dozvoljava definisanje novih.

Really proper plugin and was the best when active was Fly Dynamic Image Resizer on repo junaidbhura/fly-dynamic-image-resizer: Fly Dynamic Image Resizer plugin for WordPress Y-collective/Icarus: Integrates Fly Dynamic Image Resizer with WP Smush, on the fly.

Optimize Images Resizing generiše razne veličine on the fly i ustvari ne izgleda loše sad.

FWS On-Demand-Resizer je slabo prihvaćen ali pogledaj kod, it will intercept uploading process to prevent creation of thumbnails and intercept getters (wp_get_attachment_image_src(), get_the_post_thumbnail_url(), the_post_thumbnail(),…) to create thumbnail if needed.

OTF Regenerate Thumbnails sa repo na GitHub - gambitph/WP-OTF-Regenerate-Thumbnails: Automatically regenerates your thumbnails on the fly when thumbnail sizes change. ustvari zaslužuje mnogo više pažnje.

WP Performance Pack ima unapređeni algoritam i izgleda se normalno i dalje razvija i čini mi se vrlo dobar. On overrides the registered image editors (those didn’t exist when Dynamic Image Resizer was written) to only create the necessary metadata. This is way more robust and also works when editing images with WordPress. Dosta toga poredi sa Dynamic Image Resizer is intended only as a proof of concept - WP Performance Pack dynamic image feature is the working implementation of that proof of concept.

ResizeFly sa repo na alpipego/resizefly: Dynamically resize your WordPress images on the fly.

syamilmj/Aqua-Resizer: Resize WordPress images on the fly Resize WordPress Images On The Fly With Aqua Resizer

Kama Thumbnail regeneriše po želji, ali samo kad pozoveš njegove funkcije, ali nijedna ne generiše picture tag, more info at Kama Thumbnail and more forked plugins like: rwsite/wp-thumbnail-plugin: Wordpress thumbnail plugin based by Kama Thumbnail with WEBP

Intermediate Image Sizes je davno neažuriran, ali ga svejedno pominjem. Secure Image Resizer i još jedan prastari.

I još jedan dekica Dynamic Image Resizer Dynamic Image Resize sa repo na franz-josef-kaiser/Dynamic-Image-Resize: dynamic-image-resize je vrlo interesantan jer primenjuje altermativni metod u kome se slike kreiraju it hooks into the normal WordPress 404 handler, i teoretski bi ovaj metod trebalo da je drastično brži od drugog algoritma, ali njegova unapređena verzija je WP Performance Pack.


RICG Responsive Images sa repo na ResponsiveImagesCG/wp-tevko-responsive-images: Fully responsive image plugin for wordpress je stari plugin i ne serve-uje tag već se samo bavi sa srcset, što sad mislim da WP već radi native.


plugin recommendation - Resizing images to the actual size used in the editor? - WordPress Development Stack Exchange

Post Types Image Sizes

date 04. Aug 2023 | modified 10. Jun 2024
filename: Plugins » Uploads » Images » Srcset & Sizes