如何为多个 og:image 元素设置高度和宽度

Question

如果设置多个og:image headers，例如：

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

如果图像尺寸不同，如何设置多个宽度和高度？

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

我可以只设置一组宽度和高度元素还是像这样设置多个？:

  <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

可以设置多个。根据 documentation，您可以在声明根标记后放置结构化属性。每当解析另一个根元素时，该结构化属性被认为已完成并开始另一个。

例如：

<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" />

表示此页面上有 3 张图片，第一张图片为 300x300，中间一张未指定尺寸，最后一张为 1000px 高。

如何为多个 og:image 元素设置高度和宽度

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

html

social-media

facebook-opengraph