craft-seomatic icon indicating copy to clipboard operation
craft-seomatic copied to clipboard

Missing `og:image` tag

Open markhuot opened this issue 3 years ago • 11 comments

Describe the bug

I've set my "SEO Image" to a static string (for testing purposes). For example, https://www.example.com/foo.jpg. With that set I can dump(seomatic.meta) and see ["seoImage"]=> string(140) "https://www.example.com/foo.jpg". But I also see ["ogImage"]=> string(0) "" and the true issue I can't figure out is that I don't get an og:image meta tag. (Note: the example URL is a real image that resolves to a real JPG)

To reproduce

Steps to reproduce the behaviour:

  1. Go to the SEOmatic "Content SEO" settings and configure the settings for a channel
  2. Scroll to "SEO Image Source" and enter an image URL (I've also tried entering {{ entry.imageField.url }}
  3. There's no og:image meta tag output

Expected behaviour

I believe this is a misconfiguration, but I can't figure out why I'm not getting an og:image and I'm not sure what to trace/debug to see where it's falling down.

Screenshots

Screen Shot 2022-01-21 at 5 19 49 PM Screen Shot 2022-01-21 at 5 23 10 PM

Versions

  • Plugin version: 3.4.15
  • Craft version: 3.7.26

markhuot avatar Jan 21 '22 22:01 markhuot

First thing I'd suggest is updating to the latest version, which is SEOmatic 3.4.22, just so we're on the same baseline:

https://github.com/nystudio107/craft-seomatic/releases/tag/3.4.22

Next, go to the Facebook tab, and tell me what those settings are set to? Also, try re-saving those settings for that Content SEO section.

Finally, is there an SEO Settings field in the mix for this section?

khalwat avatar Jan 22 '22 00:01 khalwat

I've attempted to reproduce this locally by putting a URL in the SEO Image field in Content SEO, and leaving the Facebook settings set to "Same as SEO Image" and I am seeing it generate an og:image tag properly, FWIW.

khalwat avatar Jan 22 '22 00:01 khalwat

So I found out where things are going wrong for me. The issue is that count($data) here, https://github.com/nystudio107/craft-seomatic/blob/f00efb180f743ed81a425bf6a8c2d0403ba7321d/src/models/MetaTag.php#L155 is only,

["property" => "og:image"]

That's causing the render to skip.

That's getting skipped because {seomatic.meta.ogImage} is evaluating to null and the content prop is getting dropped from $data.

I'm trying to trace where/why seomatic.meta.ogImage is coming back null even though title and description both come back as expected.

markhuot avatar Jan 24 '22 16:01 markhuot

Ah, you had it… and I didn't understand what you were asking, sorry. There is an SEO Settings field enabled for this content type. In that field I see the correct static string in the General tab, but when I click to the Facebook tab I see the old "From Asset Field" image source, which is pointing an empty field.

So, then the question is: why is the SEO Settings field not updated with what's in my Content SEO Settings? Do I need some sort of re-save on the entry?

markhuot avatar Jan 24 '22 18:01 markhuot

SEO Settings fields are overrides -- this was made much more clear in an update where you have to toggle a lightswitch to override.

Data from Content SEO is not propagated to the SEO Settings fields, because you could be left in a situation where you'd have to change the settings in every single entry if you wanted an override to happen.

It's normal/fine for the field to be blank, if there is an empty setting for anything in an SEO Settings field, it falls back on the settings in Content SEO.

Can you check what your settings are for the Facebook Image in Content SEO for this section?

khalwat avatar Jan 24 '22 20:01 khalwat

Yup, I'm following. I see the light switches per-field and (to start) they are all disabled, meaning they're pulling from the per-channel settings, I believe.

I did some more testing and was able to break it pretty consistently, I think… All of these work regardless of whether the settings are set in the per-channel config or on an individual entry. I tested both ways and saw the same thing.

  1. If seoImage is pulling "From Asset Field" everything works 100% of the time and I don't have any issues.
  2. If seoImage is pulling "Custom Image" everything works 100% of the time and I don't have any issues.
  3. If seoImage is pulling "Custom URL" it breaks og:image unless I disable "Transform Facebook OpenGraph Image". And it only works if I disable the transform in the per-entry override field. If I disable the transform on the channel and disable all entry-overrides (so it's pulling entirely from the channel) it still doesn't work.

Note, I'm using "Custom URL" to trigger a behavior that pulls a nested asset field. Basically, if the channel is blog post I have a behavior called carouselImage that pulls (entry.leadImage ?? entry.author.headshots.one()).url. This is somewhat beside the point, though, because I can break it the same way by entering a static image URL in to "Custom URL" too.

markhuot avatar Jan 24 '22 21:01 markhuot

Try going to the Content SEO -> Facebook settings, and change it from "Same as SEO Image" and instead change it to "Custom URL" and paste in your custom code there.

khalwat avatar Jan 24 '22 21:01 khalwat

Yup! That seems to help. And with that set in the content settings I can successfully ignore the per-entry override field because it works in either situation.

Phew, that's an interesting one. Anything I can do to help here? Is this a documentation issue? Should I be setting this in some other way?

markhuot avatar Jan 24 '22 21:01 markhuot

I'm not sure I fully understand what is going on. If you have SEO Image set to Custom Text, the PullField helper:

https://github.com/nystudio107/craft-seomatic/blob/develop/src/helpers/PullField.php

Should pull the data from the SEO Image field (twig code in your case), and stuff it into the Twitter & OG:Image fields.

khalwat avatar Jan 27 '22 19:01 khalwat

I think there's like a logic issue. If the SEO Image field is set to Custom URL then no image transforms can or should be applied, it should ignore that, and just copy the data into the Twitter Image and OG Image fields.

khalwat avatar Jan 27 '22 19:01 khalwat

I believe the issue is,

  1. Set the "SEO Image Source" to "Custom URL" and enter Twig code like {entry.imageField.url} for example.
  2. Notice on the "General Settings" there is no longer an option to "Transform SEO Image". That light switch UI has been removed.
  3. Navigate to the "Facebook Settings" and notice that if the "Facebook Open Graph Image Source" is set to "Same as SEO Image" the "Transform Facebook OpenGraph Image" field is still operable.
  4. Change the "Facebook Open Graph Image Source" to "Custom URL" and notice the "Transform Facebook OpenGraph Image" field goes away.

The bug seems to be that when Facebook is pulling from the SEO Image it's not honoring the transform options from the SEO Image and still trying to set the transform itself, when that's not possible on a URL/piece of Twig.

Let me know if that doesn't make any sense. I can grab a screen cast or we can hop on a quick zoom too.


Note: the workaround for me has been to specify all three General, Twitter, and Facebook images as "Custom URL" and copy/paste the same Twig code in to each. That works without any issue (other than the duplication, which isn't the end of the world).

markhuot avatar Jan 27 '22 20:01 markhuot

I'm going through the backlog, and I'm unable to reproduce this -- so I believe it has been fixed. I will re-open this issue if you still encounter it.

khalwat avatar Jul 24 '23 00:07 khalwat