How do I add multiple images in JSON to meet Google's schema.org requirements? The Google guidelines for article on schema.org state:


  For best results, provide multiple high-resolution images (minimum of
  300,000 pixels when multiplying width and height) with the following
  aspect ratios: 16x9, 4x3, and 1x1.


How do I do this in Drupal?
This takes a little while to set up but is pretty straightforward.


Download and install the Image Widget Crop and Schema.org Metatag modules.
Go to admin/config/media/crop and create three crop types: 1x1, 4x3, and 16x9.  Set the aspect ratios to 1:1, 4:3, and 16:9, and set a hard limit of height 696 and width 696 for all three as stated in Google's documentation.
Go to admin/config/media/image-styles and create three image styles, 1x1, 4x3, and 16x9, and each should use the effect Manual crop pointing to the crop type you created in step #2.
Go to /admin/structure/media and find your image type. Go to Manage form display and use the crop widget.  Require all three crops.
Go to /admin/config/search/metatag/ and choose the content that includes the images.
For Schema.org Article, scroll down to Image and choose ImageObject. Enter the URLs as tokens.


For example, if your image styles are:


hero_16x9
hero_4x3
hero_1x1


And your node contains an entity reference to the image you want to use in field_ref_media_hero, then you can enter the URLs separated by commas like this:

[node:field_ref_media_hero:entity:field_media_image:hero_16x9:url], [node:field_ref_media_hero:entity:field_media_image:hero_4x3:url], [node:field_ref_media_hero:entity:field_media_image:hero_1x1:url]