How to set height and width for multiple og:image elements

Question

If you set multiple og:image headers, e.g.:

  <meta property="og:image" content="img1.png" />
  <meta property="og:image" content="img2.png" />

How do you set multiple widths and heights if the images are different dimensions?

    <meta property="og:image:width" content="100">
    <meta property="og:image:height" content="100">

Can I only set one set of width and height elements or an I do multiple like this?:

  <meta property="og:image" content="img1.png" />
  <meta property="og:image:width" content="100">
  <meta property="og:image:height" content="100">

  <meta property="og:image" content="img2.png" />
  <meta property="og:image:width" content="200">
  <meta property="og:image:height" content="200">

Answer 1

You can set multiple. According to the documentation you can put structured properties after you declare their root tag. Whenever another root element is parsed, that structured property is considered to be done and another one is started.

For example:

<meta property="og:image" content="https://example.com/rock.jpg" />
<meta property="og:image:width" content="300" />
<meta property="og:image:height" content="300" />
<meta property="og:image" content="https://example.com/rock2.jpg" />
<meta property="og:image" content="https://example.com/rock3.jpg" />
<meta property="og:image:height" content="1000" />

means there are 3 images on this page, the first image is 300x300, the middle one has unspecified dimensions, and the last one is 1000px tall.