Discrepancy Between Metadata Image and SEO Preview Image

[WHITE-developer]

For the og:image, we use the image from the "product images" asset field. We use multiple images in the "product images" field. The first image of "product images" is shown in the SEO preview as expected. However, when we share the page on Facebook, the last image of "product images" appears instead of the one shown in the SEO preview.

To reproduce

Steps to reproduce the behaviour:

1. Set the og:image to use the image from the "product images" asset field as shown in the SEO settings.
2. Check the SEO preview to confirm that the selected image from the "product images" field is displaying correctly.
3. Share the page link on Facebook: Share the page URL on Facebook (e.g., in a post or messenger).
4. Notice that Facebook displays a different image from what was shown in the SEO preview.

Expected behaviour

When you configure the og:image tag to pull from the "product images" asset field, the og:image should display the correct image I have set.

Screenshots

Versions

• SEOmatic version: 5.1.1
• Craft version: 5.3.4

[khalwat]

Have you viewed the HTML source code for the page, and is it showing the correct image in the <meta> og:image tag?

If so, then SEOmatic is doing everything correctly, and the issue is on the Facebook end of things here.

[WHITE-developer]

Hi @khalwat, thank you for your reply. In the <meta> og:image tag the last image of the product images is shown and we expect the first image of product images.

[khalwat]

Okay so you're saying you have multiple images in the Assets field, rather than just one -- and you're expecting it to pick the one you manually arranged to be the first image?

FYI this is what it does by default when you select a source field (myAssetField here):

{{ seomatic.helper.socialTransform(entry.myAssetField.collect()[0], "base", 1, "crop") }}

So it should be taking and using the first asset that is returned from the Asset field in question. You can try this code in your frontend template that corresponds to that section to see what it outputs.

If it's not what you want, you can select Custom URL instead, and enter any Twig you like into that field.

[WHITE-developer]

Hi @khalwat, thank you for your reactions. With your assistance, we identified the issue, and can confirm that it’s not connected to your plugin.