Support

As I say the documenation:

The images were selected so that they cover the vast majority of photographs we have seen used on real world sites.

They are not the first photos I came across. I spent a week poring over thousands of photos to hand pick the ones that make sense for a preview of the template regardless of what kind of image, aspect ratio, and dimension you choose (within reason). 

And that's the entire point. The actual image or image size does not matter. What matters is having roughly the same aspect ratio. That's why you get portrait, panorama portrait, landscape, panorama landscape, and square. Landscape photos can have the image on the left, right, or centre –since everyone follows the rule of thirds, or their photos look like a dog's breakfast– which is why for landscape in particular you get three images. That's how you end up with seven sample images in total. They are not a random selection of seven images. They are the seven images you can use to produce a generic representation of your template no matter what kind of image and image size you are going to be using.

Aside: If you plan on having drastically different aspect ratios or image compositions you will definitely want to create different templates, selecting the right template for each article. However, this is an extremely unlikely use case. The aspect ratio is typically dictated by the far more rigid constraints of the site's HTML/CSS template, and the composition is typically dictated by the site's nature. I have not seen a site which uses a mix of image sizes, aspect ratios, and art styles in the same article category and doesn't look like a gaudy mid-1980s grocery store weekly offers catalogue. But I digress.

Images will be resized before they are used by your template. The actual size of the image does not matter as long as your image is at least as high or as wide (or both!) as the dimensions you choose to resize it to – hence the resizing options. You just need to pick an image with a similar aspect ratio to your source material. The erensever sample image is square, just like your example. That's the one you need to pick. No, the subject is not relevant. I picked an image which lets you understand if you are cropping the top and/or bottom part of the image because of the positioning of the city skyline below and the sky above the hot air balloons. This gives you an immediate visual feedback on the direction you are going.

If you have to tweak the cropping too much to make your article photo work you will be far better off cropping it manually to the desired target aspect ratio in Photoshop and use a custom field to set the custom image. This is the use case for letting you choose the source of the extra image as coming from custom field and falling back to the full text image. The idea here is that most articles would use the full text image, but since you have that one special snowflake article where the full text image just won't crop the way you want it you will do that manually and provide the manually cropped photo in your extra field. I think you get the idea now :)

You will definitely have a problem if your image is smaller than the resize target (auto-resize is a best-fit to the width and height of your OG image template, as per the documentation). Of course, having a too small image will always be a problem because upscaling it would look terrible no matter what. The only solution to a too-small image is using a different image, or a completely different template, both of which are perfectly possible already.

Finally, keep in mind that the template preview is just that. A simple preview of the generic use case of your template. It's not meant to be an exact represenation of a specific article's image. For that, you need to enable the Frontend Preview feature. If you want the OG image generation to skip the cache, set "Regenerate Images On Every Page Load (Development Mode)" to Yes. Again, if you have that one article that just won't look right unless you start tweaking so much that everything else looks like someone was on a bad acid trip when setting up the template – stop, crop manually, use a custom field. Knowing what can be done automatically and what needs manual intervention is part of the art direction you are doing. The whole point of this software is to automate the vast majority of the repetitive work you'd be otherwise doing and empower you to take manual control when the automation won't cut it. Alternatively, you can enforce guidelines for article photos, but my experience is that it's orders of magnitude easier managing computers than people :D