To cover all the theme options for this subject we need to think about where you are starting from.
- You could be using a standard theme, even TwentySeventeen.
- You could have purchased a designer or build theme, maybe even DIVI,
- You could have a bespoke design made for you.
- You could be using a template builder like the wp-types toolset.
In almost all cases, you should be using a child theme. That will allow us to change the design subtly without losing the original and its updates.
Your theme will have imposed standard sizes for all your images and you need to work out what these are and see how they will work with some example images you would like to use. The most important issues are
- Are your original images big enough to look good at all sizes shown by the theme?
- Does the theme crop your images in any way, and if so does that affect their effectiveness?
- Do your images ‘make sense’ at all the sizes used.
- Do your image work in with the colours used by the theme on the pages.
Tweaking with a child theme
Hands up here, the current theme we have is created by us in the toolset of wp-types. That means we were able to set the sizes and positions of all the images ourselves.
Early on we found that although most of the images are created by finding a sympathetic theme from unsplash.com, we would also be using a few screen captures and other non-standard images. This means that we know that images will be ‘hard-cropped’ by the WordPress media upload process. The width of our images will be the fixed point and the height may change. Therefore we try to keep the aspect ration pretty close to keep as much uniformity as possible.
If you want to make changes to your images then there are two places you will have to look.
Firstly you need to make sure that WordPress is going to create the size of images you want. This means changing the sizes in the media image of WordPress. You also need to know if the theme, or a plugin, is creating another size of an image. You could then consider changing any of these by adding code in your functions.php file.
Secondly, you need to look at how your theme is going to output your images. not only on a standard page but also when the screen size changes for tablets and phone screens. If any of these need a tweak, then you will hopefully be able to override the settings using CSS style changes which you can add to the style.css of your child theme.
Photo by rawpixel.com on Unsplash