I want to create each image for each screensize

Hello, there,

No, you don’t need to do that at all. Our plugin will find the images in the watched directories anyway because these directories are supposed to be the directories where you already have your images saved. If you wish to specify which screen sizes our plugin should take into account then you need to set the Breakpoints options in the plugin settings page. However, the default ones are usually pretty OK.

Let me know if you need anything further!

Cheers,
Takis

Thanks for the prompt response! I found the images of the various header images for different screen sizes created by your plugin.
I actually want to change the design of the header image for different screen sizes. It looks like I can just save my replacement file with the same filename that was created by your plugin and replace it in the directory. Well, in theory that seems to be correct. Does that sound right to you?

I don’t think it is working. The default breakpoints you set in your plugin are fine. I replaced the files for the header image created by the plugin with my new files and I used the identical filenames. For the larger screen widths 1021 and 1024, I made a different design of the header image where the line of orange text is a smaller font and on 1 line, but for smaller screen sizes the orange text is larger and on 2 lines. But I don’t see the versions I created for 1140 x 285 and 1024 x 206 loading, it’s still the version with the text on 2 lines: https://graceanimalhospice.org

Oh, I am so sorry, but I do not think I have understood exactly what you are trying to do. It is quite difficult for one to understand all the small details of the other person’s design.

Could you perhaps point me to something more particular?

On the other hand, I do see that the Adaptive Images plugin is indeed working as expected in your website and that it resizes images as it is supposed to (per breakpoint and device screen size).

Cheers,
Takis

The link to the website I sent in my email – you can see a header image graphic. In that image, there is text in orange and it is on two lines. I have created another version of this graphic where the orange text is on one line and a smaller font size. I want this alternate version to be displayed for screen sizes wider than 1021 pixels. In other words, When the user is viewing on a screen larger than 1021 pixels wide, I would like the header image to show the alternate version where the text is on one line and a smaller font.
If WP is indeed using the header files created by your plugin and displaying the file located in the Watched Directory, then the file that has been named and designated for screen size widths 1021 and 1024 seems to be what it would display when a site visitor is viewing the website on a laptop where the screen width is 1021 or larger. If I replace the file generated by the plugin designated for screen width 2021 and 1024 with my alternate version of the header image, theoretically shouldn’t it show my alternate version of the header image?

Hello, again,

I think I understand what you mean now. Unfortunately, this is not something our plugin can do. It will resize per device breakpoint any image that will be requested, but it cannot substitute it or alternate it with another one. What you are trying to achieve can be done in other ways like the image srcset attribute or simply with CSS media queries. This way you can show and hide the image version you wish for any device size. I guess CSS media queries should be the easiest way to go.

Cheers,
Takis

I see. thanks for getting back to me Takis!

You are welcome!